[Backport 2.11] Make checkpoint mandatory, add watermark delay, minor UI fixes

common/constants/index.ts

@@ -89,6 +89,7 @@ export const ACCELERATION_INDEX_NAME_INFO = `All OpenSearch acceleration indices
 - All user given index names must be in lowercase letters. Index name cannot begin with underscores. Spaces, commas, and characters -, :, ", *, +, /, \, |, ?, #, >, or < are not allowed.  
   `;
 
+export const TIMESTAMP_DATATYPE = 'timestamp';
 export const FETCH_OPENSEARCH_INDICES_PATH = '/api/sql_console/sqlquery';
 export const POLL_INTERVAL_MS = 2000;
 export const ASYNC_QUERY_ENDPOINT = '/api/spark_sql_console';

common/types/index.ts

@@ -32,6 +32,11 @@ export interface RefreshIntervalType {
   refreshInterval: string;
 }
 
+export interface watermarkDelayType {
+  delayWindow: number;
+  delayInterval: string;
+}
+
 export type AccelerationIndexType = 'skipping' | 'covering' | 'materialized';
 
 export interface GroupByTumbleType {
@@ -57,6 +62,7 @@ export interface FormErrorsType {
   replicaShardsError: string[];
   refreshIntervalError: string[];
   checkpointLocationError: string[];
+  watermarkDelayError: string[];
 }
 
 export type AccelerationRefreshType = 'auto' | 'interval' | 'manual';
@@ -75,22 +81,30 @@ export interface CreateAccelerationForm {
   replicaShardsCount: number;
   refreshType: AccelerationRefreshType;
   checkpointLocation: string | undefined;
+  watermarkDelay: watermarkDelayType;
   refreshIntervalOptions: RefreshIntervalType;
   formErrors: FormErrorsType;
 }
 
 export type AsyncQueryLoadingStatus = 'SUCCESS' | 'FAILED' | 'RUNNING' | 'SCHEDULED' | 'CANCELLED';
-export type TreeItemType = 'covering_index' | 'skipping_index' | 'table' | 'database' | 'materialized_view' | 'Load Materialized View' | 'badge'
+export type TreeItemType =
+  | 'covering_index'
+  | 'skipping_index'
+  | 'table'
+  | 'database'
+  | 'materialized_view'
+  | 'Load Materialized View'
+  | 'badge';
 
 export interface TreeItem {
   name: string;
   type: TreeItemType;
   isExpanded: boolean;
   values?: TreeItem[];
-  isLoading?: boolean
+  isLoading?: boolean;
 }
 
-export interface isLoading {
+export interface DatasourceTreeLoading {
   flag: boolean;
   status: string;
 }

common/utils/async_query_helpers.ts

@@ -47,7 +47,7 @@ export const pollQueryStatus = (id: string, http: CoreStart['http'], callback) =
         status === 'scheduled' ||
         status === 'waiting'
       ) {
-        callback({status: status})
+        callback({ status: status });
         setTimeout(() => pollQueryStatus(id, http, callback), POLL_INTERVAL_MS);
       } else if (status === 'failed') {
         callback({ status: 'FAILED', results: [] });

public/components/Main/__snapshots__/main.test.tsx.snap

@@ -155,7 +155,7 @@ exports[`<Main /> spec click clear button 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -193,7 +193,7 @@ exports[`<Main /> spec click clear button 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -712,7 +712,7 @@ exports[`<Main /> spec click run button, and response causes an error 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -750,7 +750,7 @@ exports[`<Main /> spec click run button, and response causes an error 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -1269,7 +1269,7 @@ exports[`<Main /> spec click run button, and response is not ok 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -1307,7 +1307,7 @@ exports[`<Main /> spec click run button, and response is not ok 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -1826,7 +1826,7 @@ exports[`<Main /> spec click run button, and response is ok 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -1864,7 +1864,7 @@ exports[`<Main /> spec click run button, and response is ok 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -2467,7 +2467,7 @@ exports[`<Main /> spec click run button, response fills null and missing values
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -2505,7 +2505,7 @@ exports[`<Main /> spec click run button, response fills null and missing values
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -3107,7 +3107,7 @@ exports[`<Main /> spec click translation button, and response is ok 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -3145,7 +3145,7 @@ exports[`<Main /> spec click translation button, and response is ok 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
@@ -3659,7 +3659,7 @@ exports[`<Main /> spec renders the component 1`] = `
     >
       <a
         class="euiButton euiButton--primary"
-        href="https://opensearch.org/docs/latest/search-plugins/sql/index/"
+        href="https://opensearch.org/docs/latest/search-plugins/sql/sql/index/"
         rel="noopener noreferrer"
         target="_blank"
       >
@@ -3693,7 +3693,7 @@ exports[`<Main /> spec renders the component 1`] = `
     >
       <div
         class="euiPageSideBar"
-        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto;"
+        style="max-width: 400px; width: 400px; max-height: 1200px; overflow-y: auto; overflow-x: hidden;"
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"

public/components/Main/main.tsx

@@ -829,7 +829,7 @@ export class Main extends React.Component<MainProps, MainState> {
       refreshTree: !this.state.refreshTree,
     });
   };
-      
+
   setIsAccelerationFlyoutOpened = (value: boolean) => {
     this.setState({
       isAccelerationFlyoutOpened: value,
@@ -863,7 +863,7 @@ export class Main extends React.Component<MainProps, MainState> {
           setIsAccelerationFlyoutOpened={this.setIsAccelerationFlyoutOpened}
         />
       );
-      link = 'https://opensearch.org/docs/latest/search-plugins/sql/index/';
+      link = 'https://opensearch.org/docs/latest/search-plugins/sql/sql/index/';
       linkTitle = 'SQL documentation';
     } else {
       page = (
@@ -881,7 +881,7 @@ export class Main extends React.Component<MainProps, MainState> {
           asyncLoading={this.state.asyncLoading}
         />
       );
-      link = 'https://opensearch.org/docs/latest/observability-plugin/ppl/index/';
+      link = 'https://opensearch.org/docs/latest/search-plugins/sql/ppl/index/';
       linkTitle = 'PPL documentation';
     }
 
@@ -957,18 +957,26 @@ export class Main extends React.Component<MainProps, MainState> {
         </EuiFlexGroup>
         <EuiPage paddingSize="none">
           {this.state.language === 'SQL' && (
-            <EuiPanel grow ={true}>
-              <EuiPageSideBar style={{ maxWidth: '400px', width: '400px', maxHeight: '1200px' ,overflowY:'auto'}}>
+            <EuiPanel grow={true}>
+              <EuiPageSideBar
+                style={{
+                  maxWidth: '400px',
+                  width: '400px',
+                  maxHeight: '1200px',
+                  overflowY: 'auto',
+                  overflowX: 'hidden',
+                }}
+              >
                 <EuiFlexGroup direction="column">
                   <EuiFlexItem>
                     <EuiFlexItem grow={false}>
                       <EuiFlexGroup direction="row" gutterSize="s">
-                      <EuiFlexItem grow={false}>
+                        <EuiFlexItem grow={false}>
                           <EuiButtonIcon
                             display="base"
                             iconType="refresh"
-                            size='m'
-                            aria-label='refresh'
+                            size="m"
+                            aria-label="refresh"
                             onClick={this.handleReloadTree}
                           />
                         </EuiFlexItem>

public/components/SQLPage/DataSelect.tsx

@@ -74,8 +74,10 @@ export const DataSelect = ({ http, onSelect, urlDataSource, asyncLoading }: Cust
   }, []);
 
   const handleSelectionChange = (selectedItems: any[]) => {
-    setSelectedOptions(selectedItems);
-    onSelect(selectedItems);
+    if (selectedItems.length > 0) {
+      setSelectedOptions(selectedItems);
+      onSelect(selectedItems);
+    }
   };
 
   return (