From efc3b448e24c39b5da352f00b6c7a3f7482f5386 Mon Sep 17 00:00:00 2001
From: Paul Sebastian <paulstn@amazon.com>
Date: Tue, 19 Mar 2024 15:14:48 -0700
Subject: [PATCH] add callout for s3 datasources

Signed-off-by: Paul Sebastian <paulstn@amazon.com>
---
 .../explorer/log_explorer.scss                |  4 +
 .../event_analytics/explorer/no_results.tsx   | 75 ++++++++++++++++---
 2 files changed, 68 insertions(+), 11 deletions(-)

diff --git a/public/components/event_analytics/explorer/log_explorer.scss b/public/components/event_analytics/explorer/log_explorer.scss
index f8c25dac73..823c18f6dc 100644
--- a/public/components/event_analytics/explorer/log_explorer.scss
+++ b/public/components/event_analytics/explorer/log_explorer.scss
@@ -32,4 +32,8 @@
 
 .search-area {
   position: relative;
+}
+
+pre.euiCodeBlock__pre.euiCodeBlock__pre--whiteSpacePreWrap {
+  margin-bottom: 0;
 }
\ No newline at end of file
diff --git a/public/components/event_analytics/explorer/no_results.tsx b/public/components/event_analytics/explorer/no_results.tsx
index 272417f7f2..94fd1e7fdf 100644
--- a/public/components/event_analytics/explorer/no_results.tsx
+++ b/public/components/event_analytics/explorer/no_results.tsx
@@ -4,7 +4,10 @@
  */
 
 import {
+  EuiButtonIcon,
   EuiCallOut,
+  EuiCodeBlock,
+  EuiCopy,
   EuiEmptyPrompt,
   EuiFlexGroup,
   EuiFlexItem,
@@ -19,12 +22,18 @@ import { useSelector } from 'react-redux';
 import { coreRefs } from '../../../framework/core_refs';
 import { selectQueryAssistantSummarization } from '../redux/slices/query_assistant_summarization_slice';
 import { selectQueries } from '../redux/slices/query_slice';
+import { selectSearchMetaData } from '../redux/slices/search_meta_data_slice';
+import { DATA_SOURCE_TYPES, QUERY_LANGUAGE } from '../../../../common/constants/data_sources';
 
 export const NoResults = ({ tabId }: any) => {
   // get the queries isLoaded, if it exists AND is true = show no res
   const queryInfo = useSelector(selectQueries)[tabId];
   const summaryData = useSelector(selectQueryAssistantSummarization)[tabId];
   const queryAssistLoading = summaryData.loading;
+  const explorerSearchMeta = useSelector(selectSearchMetaData)[tabId];
+
+  const datasourceName = explorerSearchMeta?.datasources[0]?.name;
+  const languageInUse = explorerSearchMeta?.lang;
 
   return (
     <EuiPage paddingSize="s">
@@ -81,17 +90,61 @@ export const NoResults = ({ tabId }: any) => {
       ) : (
         <EuiFlexGroup justifyContent="center" direction="column">
           <EuiFlexItem grow={false}>
-            <EuiCallOut
-              title={
-                <FormattedMessage
-                  id="observability.noResults.noResultsMatchSearchCriteriaTitle"
-                  defaultMessage="No results match your search criteria"
-                />
-              }
-              color="warning"
-              iconType="help"
-              data-test-subj="observabilityNoResultsCallout"
-            />
+            {explorerSearchMeta?.datasources[0]?.type === DATA_SOURCE_TYPES.S3Glue ? (
+              <EuiCallOut
+                title={
+                  <FormattedMessage
+                    id="observability.noResults.noResultsMatchSearchCriteriaTitle"
+                    defaultMessage="Explore S3 data source"
+                  />
+                }
+                color="warning"
+                iconType="help"
+                data-test-subj="observabilityNoResultsCallout"
+              >
+                {languageInUse === QUERY_LANGUAGE.SQL ? (
+                  <EuiFlexGroup direction="column">
+                    <EuiFlexItem grow={false}>
+                      <h4>Explore Databases</h4>
+                      <EuiCodeBlock isCopyable={true} paddingSize="none" fontSize="s">
+                        {`SHOW SCHEMAS IN ${datasourceName}`}
+                      </EuiCodeBlock>
+                    </EuiFlexItem>
+                    <EuiFlexItem>
+                      <h4>Explore Tables</h4>
+                      <EuiCodeBlock isCopyable={true} paddingSize="none" fontSize="s">
+                        {`SHOW TABLES EXTENDED IN ${datasourceName}.<database> LIKE '*'`}
+                      </EuiCodeBlock>
+                    </EuiFlexItem>
+                    <EuiFlexItem>
+                      <h4>Sample Query</h4>
+                      <EuiCodeBlock isCopyable={true} paddingSize="none" fontSize="s">
+                        {`SELECT * FROM ${datasourceName}.<database>.<table> LIMIT 10`}
+                      </EuiCodeBlock>
+                    </EuiFlexItem>
+                  </EuiFlexGroup>
+                ) : (
+                  <>
+                    <h4>Sample Query</h4>
+                    <EuiCodeBlock isCopyable={true} paddingSize="none" fontSize="s">
+                      {`source = ${datasourceName}.<database>.<table> | head 10`}
+                    </EuiCodeBlock>
+                  </>
+                )}
+              </EuiCallOut>
+            ) : (
+              <EuiCallOut
+                title={
+                  <FormattedMessage
+                    id="observability.noResults.noResultsMatchSearchCriteriaTitle"
+                    defaultMessage="No results match your search criteria"
+                  />
+                }
+                color="warning"
+                iconType="help"
+                data-test-subj="observabilityNoResultsCallout"
+              />
+            )}
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiSpacer size="s" />