From 793366d4e1a7f2891c3d9aea616013d50a449743 Mon Sep 17 00:00:00 2001 From: sumukhswamy Date: Thu, 26 Oct 2023 17:18:29 -0700 Subject: [PATCH 1/4] added fix for loading spinner issue Signed-off-by: sumukhswamy --- public/components/SQLPage/table_view.tsx | 196 ++++++++++------------- 1 file changed, 81 insertions(+), 115 deletions(-) diff --git a/public/components/SQLPage/table_view.tsx b/public/components/SQLPage/table_view.tsx index 24377a6b..266d2fc4 100644 --- a/public/components/SQLPage/table_view.tsx +++ b/public/components/SQLPage/table_view.tsx @@ -150,25 +150,28 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }); setToast(errorMessage, 'danger'); } - pollQueryStatus(id, http, (data) => { - setIsLoading({ flag: true, status: data.status }); - if (data.status === 'SUCCESS') { - const fetchedDatanases = [].concat(...data.results); - setTreeData(loadTreeItem(fetchedDatanases, TREE_ITEM_DATABASE_NAME_DEFAULT_NAME)); - setIsLoading({ flag: false, status: data.status }); - } else if (data.status === 'FAILED') { - setIsLoading({ - flag: false, - status: data.error, - }); - setToast(`ERROR ${data.error}`, 'danger'); - } - }); + else{ + pollQueryStatus(id, http, (data) => { + setIsLoading({ flag: true, status: data.status }); + if (data.status === 'SUCCESS') { + const fetchedDatanases = [].concat(...data.results); + setTreeData(loadTreeItem(fetchedDatanases, TREE_ITEM_DATABASE_NAME_DEFAULT_NAME)); + setIsLoading({ flag: false, status: data.status }); + } else if (data.status === 'FAILED') { + setIsLoading({ + flag: false, + status: data.error, + }); + setToast(`ERROR ${data.error}`, 'danger'); + } + }); + } }); } }; useEffect(() => { + setTreeData([]) setIsLoading({ flag: true, status: 'Query Not Run', @@ -176,6 +179,17 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } getSidebarContent(); }, [selectedItems, refreshTree]); + const setTreeDataDatabaseError = (databaseName: string) => { + setTreeData((prevTreeData) => { + return prevTreeData.map((database) => { + if (database.name === databaseName) { + return { ...database, isLoading: false }; + } + return database; + }); + }); + } + const handleDatabaseClick = (databaseName: string) => { setTreeData((prevTreeData) => { return prevTreeData.map((database) => { @@ -198,14 +212,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeData((prevTreeData) => { - return prevTreeData.map((database) => { - if (database.name === databaseName) { - return { ...database, isExpanded: true, isLoading: false }; - } - return database; - }); - }); + setTreeDataDatabaseError(databaseName) setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -230,17 +237,40 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); + setTreeDataDatabaseError(databaseName) setToast(`ERROR ${data.error}`, 'danger'); } }); } }); }; + const setTreeDataTableError = (databaseName: string, tableName: string) => { + setTreeData((prevTreeData) => { + return prevTreeData.map((database) => { + if (database.name === databaseName) { + return { + ...database, + values: database.values?.map((table) => { + if (table.name === tableName) { + return { + ...table, + isLoading: false, + isExpanded: false, + }; + } + return table; + }), + }; + } + return database; + }); + }); + } - const loadCoveringIndex = (tableName: string) => { + const loadCoveringIndex = (tableName: string,databaseName:string) => { const coverQuery = { lang: 'sql', - query: `SHOW INDEX ON ${selectedItems[0]['label']}.${selectedDatabase}.${tableName}`, + query: `SHOW INDEX ON ${selectedItems[0]['label']}.${databaseName}.${tableName}`, datasource: selectedItems[0]['label'], }; getJobId(coverQuery, http, (id) => { @@ -250,26 +280,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeData((prevTreeData) => { - return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { - return { - ...database, - values: database.values?.map((table) => { - if (table.name === tableName) { - return { - ...table, - isLoading: false, - isExpanded: false, - }; - } - return table; - }), - }; - } - return database; - }); - }); + setTreeDataTableError(databaseName,tableName) setToast(errorMessage, 'danger'); } pollQueryStatus(id, http, (data) => { @@ -278,7 +289,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } let coverIndexObj = loadTreeItem(res, TREE_ITEM_COVERING_INDEX_DEFAULT_NAME); setTreeData((prevTreeData) => { return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { + if (database.name === databaseName) { return { ...database, values: database.values?.map((table) => { @@ -308,19 +319,17 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); + setTreeDataTableError(databaseName,tableName) setToast(`ERROR ${data.error}`, 'danger'); } }); }); }; - const handleButtonClick = (e: MouseEvent, tableName: string) => { - e.stopPropagation(); - tableName = TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME; - setSelectedTable(tableName); + const setLoadingForTableElements = (databaseName: string,tableName: string) =>{ setTreeData((prevTreeData) => { return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { + if (database.name === databaseName) { return { ...database, values: database.values?.map((table) => { @@ -337,9 +346,15 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } return database; }); }); + } + + const handleButtonClick = (tableName: string, databaseName: string) => { + tableName = TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME; + setSelectedTable(tableName); + setLoadingForTableElements(databaseName,tableName) const materializedViewQuery = { lang: 'sql', - query: `SHOW MATERIALIZED VIEW IN ${selectedItems[0]['label']}.${selectedDatabase}`, + query: `SHOW MATERIALIZED VIEW IN ${selectedItems[0]['label']}.${databaseName}`, datasource: selectedItems[0]['label'], }; getJobId(materializedViewQuery, http, (id) => { @@ -349,25 +364,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeData((prevTreeData) => { - return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { - return { - ...database, - values: database.values?.map((table) => { - if (table.name === tableName) { - return { - ...table, - isLoading: false, - }; - } - return table; - }), - }; - } - return database; - }); - }); + setTreeDataTableError(tableName,databaseName) setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -389,7 +386,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } } setTreeData((prevTreeData) => { return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { + if (database.name === databaseName) { const updatedValues = database.values?.filter( (item) => item.type !== TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME ); @@ -408,6 +405,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); + setTreeDataTableError(databaseName,tableName) setToast(`ERROR ${data.error}`, 'danger'); } }); @@ -415,30 +413,12 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }); }; - const handleTableClick = (tableName: string) => { + const handleTableClick = (tableName: string, databaseName:string) => { setSelectedTable(tableName); - setTreeData((prevTreeData) => { - return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { - return { - ...database, - values: database.values?.map((table) => { - if (table.name === tableName) { - return { - ...table, - isLoading: true, - }; - } - return table; - }), - }; - } - return database; - }); - }); + setLoadingForTableElements(databaseName,tableName) const skipQuery = { lang: 'sql', - query: `DESC SKIPPING INDEX ON ${selectedItems[0]['label']}.${selectedDatabase}.${tableName}`, + query: `DESC SKIPPING INDEX ON ${selectedItems[0]['label']}.${databaseName}.${tableName}`, datasource: selectedItems[0]['label'], }; getJobId(skipQuery, http, (id) => { @@ -448,25 +428,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: 'error', }); - setTreeData((prevTreeData) => { - return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { - return { - ...database, - values: database.values?.map((table) => { - if (table.name === tableName) { - return { - ...table, - isLoading: false, - }; - } - return table; - }), - }; - } - return database; - }); - }); + setTreeDataTableError(databaseName,tableName) setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -474,7 +436,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } if (data.results.length > 0) { setTreeData((prevTreeData) => { return prevTreeData.map((database) => { - if (database.name === selectedDatabase) { + if (database.name === databaseName) { return { ...database, values: database.values?.map((table) => { @@ -495,12 +457,13 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }); }); } - loadCoveringIndex(tableName); + loadCoveringIndex(tableName,databaseName); } else if (data.status === 'FAILED') { setIsLoading({ flag: false, status: data.error, }); + setTreeDataTableError(databaseName,tableName) setToast(`ERROR ${data.error}`, 'danger'); } }); @@ -544,7 +507,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree }
- + Load Materialized View @@ -602,8 +565,11 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } id: `${database.name}_${table.name}`, icon: iconCreation(table), callback: () => { + if(table.type === TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME){ + handleButtonClick(table.name,database.name) + } if (table.type !== TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME && table.type !== TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME && table.values?.length === 0) { - handleTableClick(table.name); + handleTableClick(table.name,database.name); } if (table.type === TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME) { handleAccelerationIndexClick( From 1fa6076ea7b7d034716d129f248fb8ce0d536484 Mon Sep 17 00:00:00 2001 From: Shenoy Pratik Date: Fri, 27 Oct 2023 18:17:19 -0700 Subject: [PATCH 2/4] fix oui scroll issue Signed-off-by: Shenoy Pratik --- public/components/SQLPage/table_view.scss | 10 ++++ public/components/SQLPage/table_view.tsx | 66 ++++++++++++----------- 2 files changed, 46 insertions(+), 30 deletions(-) create mode 100644 public/components/SQLPage/table_view.scss diff --git a/public/components/SQLPage/table_view.scss b/public/components/SQLPage/table_view.scss new file mode 100644 index 00000000..51b405c6 --- /dev/null +++ b/public/components/SQLPage/table_view.scss @@ -0,0 +1,10 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +.workbench-tree { + .euiTreeView__node--expanded { + max-height: none !important; // Fixes OUI issue: https://github.com/opensearch-project/oui/issues/1118 + } +} diff --git a/public/components/SQLPage/table_view.tsx b/public/components/SQLPage/table_view.tsx index 266d2fc4..5c864ed1 100644 --- a/public/components/SQLPage/table_view.tsx +++ b/public/components/SQLPage/table_view.tsx @@ -15,7 +15,7 @@ import { EuiSpacer, EuiText, EuiToolTip, - EuiTreeView + EuiTreeView, } from '@elastic/eui'; import { AccelerationIndexType, DatasourceTreeLoading, TreeItem, TreeItemType } from 'common/types'; import _ from 'lodash'; @@ -35,6 +35,7 @@ import { import { useToast } from '../../../common/toast'; import { getJobId, pollQueryStatus } from '../../../common/utils/async_query_helpers'; import { AccelerationIndexFlyout } from './acceleration_index_flyout'; +import './table_view.scss'; interface CustomView { http: CoreStart['http']; @@ -149,8 +150,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } status: errorMessage, }); setToast(errorMessage, 'danger'); - } - else{ + } else { pollQueryStatus(id, http, (data) => { setIsLoading({ flag: true, status: data.status }); if (data.status === 'SUCCESS') { @@ -171,7 +171,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }; useEffect(() => { - setTreeData([]) + setTreeData([]); setIsLoading({ flag: true, status: 'Query Not Run', @@ -188,7 +188,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } return database; }); }); - } + }; const handleDatabaseClick = (databaseName: string) => { setTreeData((prevTreeData) => { @@ -212,7 +212,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeDataDatabaseError(databaseName) + setTreeDataDatabaseError(databaseName); setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -237,7 +237,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); - setTreeDataDatabaseError(databaseName) + setTreeDataDatabaseError(databaseName); setToast(`ERROR ${data.error}`, 'danger'); } }); @@ -265,9 +265,9 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } return database; }); }); - } + }; - const loadCoveringIndex = (tableName: string,databaseName:string) => { + const loadCoveringIndex = (tableName: string, databaseName: string) => { const coverQuery = { lang: 'sql', query: `SHOW INDEX ON ${selectedItems[0]['label']}.${databaseName}.${tableName}`, @@ -280,7 +280,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeDataTableError(databaseName,tableName) + setTreeDataTableError(databaseName, tableName); setToast(errorMessage, 'danger'); } pollQueryStatus(id, http, (data) => { @@ -319,14 +319,14 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); - setTreeDataTableError(databaseName,tableName) + setTreeDataTableError(databaseName, tableName); setToast(`ERROR ${data.error}`, 'danger'); } }); }); }; - const setLoadingForTableElements = (databaseName: string,tableName: string) =>{ + const setLoadingForTableElements = (databaseName: string, tableName: string) => { setTreeData((prevTreeData) => { return prevTreeData.map((database) => { if (database.name === databaseName) { @@ -346,12 +346,12 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } return database; }); }); - } + }; const handleButtonClick = (tableName: string, databaseName: string) => { tableName = TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME; setSelectedTable(tableName); - setLoadingForTableElements(databaseName,tableName) + setLoadingForTableElements(databaseName, tableName); const materializedViewQuery = { lang: 'sql', query: `SHOW MATERIALIZED VIEW IN ${selectedItems[0]['label']}.${databaseName}`, @@ -364,7 +364,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: errorMessage, }); - setTreeDataTableError(tableName,databaseName) + setTreeDataTableError(tableName, databaseName); setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -405,7 +405,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: data.error, }); - setTreeDataTableError(databaseName,tableName) + setTreeDataTableError(databaseName, tableName); setToast(`ERROR ${data.error}`, 'danger'); } }); @@ -413,9 +413,9 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }); }; - const handleTableClick = (tableName: string, databaseName:string) => { + const handleTableClick = (tableName: string, databaseName: string) => { setSelectedTable(tableName); - setLoadingForTableElements(databaseName,tableName) + setLoadingForTableElements(databaseName, tableName); const skipQuery = { lang: 'sql', query: `DESC SKIPPING INDEX ON ${selectedItems[0]['label']}.${databaseName}.${tableName}`, @@ -428,7 +428,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } flag: false, status: 'error', }); - setTreeDataTableError(databaseName,tableName) + setTreeDataTableError(databaseName, tableName); setToast(errorMessage, 'danger'); } else { pollQueryStatus(id, http, (data) => { @@ -457,13 +457,13 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } }); }); } - loadCoveringIndex(tableName,databaseName); + loadCoveringIndex(tableName, databaseName); } else if (data.status === 'FAILED') { setIsLoading({ flag: false, status: data.error, }); - setTreeDataTableError(databaseName,tableName) + setTreeDataTableError(databaseName, tableName); setToast(`ERROR ${data.error}`, 'danger'); } }); @@ -473,7 +473,11 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } const iconCreation = (node: TreeItem) => { if (node.type === TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME) { - return MV; + return ( + + MV + + ); } else if ( node.type === TREE_ITEM_BADGE_NAME || node.type === TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME @@ -507,9 +511,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree }
- - Load Materialized View - + Load Materialized View {node.isLoading && } @@ -565,11 +567,15 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } id: `${database.name}_${table.name}`, icon: iconCreation(table), callback: () => { - if(table.type === TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME){ - handleButtonClick(table.name,database.name) + if (table.type === TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME) { + handleButtonClick(table.name, database.name); } - if (table.type !== TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME && table.type !== TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME && table.values?.length === 0) { - handleTableClick(table.name,database.name); + if ( + table.type !== TREE_ITEM_LOAD_MATERIALIZED_BADGE_NAME && + table.type !== TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME && + table.values?.length === 0 + ) { + handleTableClick(table.name, database.name); } if (table.type === TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME) { handleAccelerationIndexClick( @@ -626,7 +632,7 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } ) : OpenSearchIndicesTree.length > 0 || treeDataDatabases.length > 0 ? ( - + {selectedItems[0].label === 'OpenSearch' ? ( ) : ( From d799af70a19567ba5c8ba17fc51d33e15b394078 Mon Sep 17 00:00:00 2001 From: sumukhswamy Date: Mon, 30 Oct 2023 13:28:42 -0700 Subject: [PATCH 3/4] added button next to the table for query to be added Signed-off-by: sumukhswamy --- .../Main/__snapshots__/main.test.tsx.snap | 26 ++++----- .../__snapshots__/table_view.test.tsx.snap | 2 +- public/components/SQLPage/table_view.tsx | 16 ++++-- .../selectors/index_type_selector.tsx | 41 +++++++------- .../selectors/source_selector.tsx | 54 ++++++++++--------- 5 files changed, 76 insertions(+), 63 deletions(-) diff --git a/public/components/Main/__snapshots__/main.test.tsx.snap b/public/components/Main/__snapshots__/main.test.tsx.snap index c90809bc..893ded01 100644 --- a/public/components/Main/__snapshots__/main.test.tsx.snap +++ b/public/components/Main/__snapshots__/main.test.tsx.snap @@ -193,7 +193,7 @@ exports[`
spec click clear button 1`] = ` >
spec click clear button 1`] = ` class="euiFlexItem euiFlexItem--flexGrowZero" >
spec click run button, and response causes an error 1`] = ` >
spec click run button, and response is not ok 1`] = ` >
spec click run button, and response is not ok 1`] = ` class="euiFlexItem euiFlexItem--flexGrowZero" >
spec click run button, and response is ok 1`] = ` >
spec click run button, and response is ok 1`] = ` class="euiFlexItem euiFlexItem--flexGrowZero" >
spec click run button, response fills null and missing values >
spec click run button, response fills null and missing values class="euiFlexItem euiFlexItem--flexGrowZero" >
spec click translation button, and response is ok 1`] = ` >
spec click translation button, and response is ok 1`] = ` class="euiFlexItem euiFlexItem--flexGrowZero" >
spec renders the component 1`] = ` >
spec renders the component 1`] = ` class="euiFlexItem euiFlexItem--flexGrowZero" >
{ + e.stopPropagation(); + updateSQLQueries(`select * from ${selectedItems[0].label}.${parentName}.${tableName} limit 10`); + }; const iconCreation = (node: TreeItem) => { if (node.type === TREE_ITEM_MATERIALIZED_VIEW_DEFAULT_NAME) { @@ -510,10 +514,10 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree } return (
- + Load Materialized View - + {node.isLoading && } @@ -525,10 +529,16 @@ export const TableView = ({ http, selectedItems, updateSQLQueries, refreshTree }
- + {_.truncate(node.name, { length: 50 })}{' '} {node.isLoading && } + {node.type === TREE_ITEM_TABLE_NAME_DEFAULT_NAME && !node.isLoading && ( + handleQuery(e,parentName,node.name)} + > + )} diff --git a/public/components/acceleration/selectors/index_type_selector.tsx b/public/components/acceleration/selectors/index_type_selector.tsx index 00e1e92d..1ea4bffd 100644 --- a/public/components/acceleration/selectors/index_type_selector.tsx +++ b/public/components/acceleration/selectors/index_type_selector.tsx @@ -56,27 +56,28 @@ export const IndexTypeSelector = ({ getJobId(query, http, (id: string) => { if (id === undefined) { setToast(errorMessage, 'danger'); + } else { + pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { + if (data.status === 'SUCCESS') { + const dataTableFields: DataTableFieldsType[] = data.results + .filter((row) => !row[0].startsWith('#')) + .map((row, index) => ({ + id: `${idPrefix}${index + 1}`, + fieldName: row[0], + dataType: row[1], + })); + setAccelerationFormData({ + ...accelerationFormData, + dataTableFields: dataTableFields, + }); + setLoading(false); + } + if (data.status === 'FAILED') { + setLoading(false); + setToast(errorMessage, 'danger'); + } + }); } - pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { - if (data.status === 'SUCCESS') { - const dataTableFields: DataTableFieldsType[] = data.results - .filter((row) => !row[0].startsWith('#')) - .map((row, index) => ({ - id: `${idPrefix}${index + 1}`, - fieldName: row[0], - dataType: row[1], - })); - setAccelerationFormData({ - ...accelerationFormData, - dataTableFields: dataTableFields, - }); - setLoading(false); - } - if (data.status === 'FAILED') { - setLoading(false); - setToast(errorMessage, 'danger'); - } - }); }); } }, [accelerationFormData.dataTable]); diff --git a/public/components/acceleration/selectors/source_selector.tsx b/public/components/acceleration/selectors/source_selector.tsx index 0c488127..d23b1230 100644 --- a/public/components/acceleration/selectors/source_selector.tsx +++ b/public/components/acceleration/selectors/source_selector.tsx @@ -70,20 +70,21 @@ export const AccelerationDataSourceSelector = ({ getJobId(query, http, (id: string) => { if (id === undefined) { setToast(errorMessage, 'danger'); + } else { + pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { + if (data.status === 'SUCCESS') { + let databaseOptions: EuiComboBoxOptionOption[] = []; + if (data.results.length > 0) + databaseOptions = data.results.map((subArray: any[]) => ({ label: subArray[0] })); + setDatabases(databaseOptions); + setLoadingComboBoxes({ ...loadingComboBoxes, database: false }); + } + if (data.status === 'FAILED') { + setLoadingComboBoxes({ ...loadingComboBoxes, database: false }); + setToast(errorMessage, 'danger'); + } + }); } - pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { - if (data.status === 'SUCCESS') { - let databaseOptions: EuiComboBoxOptionOption[] = []; - if (data.results.length > 0) - databaseOptions = data.results.map((subArray: any[]) => ({ label: subArray[0] })); - setDatabases(databaseOptions); - setLoadingComboBoxes({ ...loadingComboBoxes, database: false }); - } - if (data.status === 'FAILED') { - setLoadingComboBoxes({ ...loadingComboBoxes, database: false }); - setToast(errorMessage, 'danger'); - } - }); }); }; @@ -98,20 +99,21 @@ export const AccelerationDataSourceSelector = ({ getJobId(query, http, (id: string) => { if (id === undefined) { setToast(errorMessage, 'danger'); + } else { + pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { + if (data.status === 'SUCCESS') { + let dataTableOptions: EuiComboBoxOptionOption[] = []; + if (data.results.length > 0) + dataTableOptions = data.results.map((subArray) => ({ label: subArray[1] })); + setTables(dataTableOptions); + setLoadingComboBoxes({ ...loadingComboBoxes, dataTable: false }); + } + if (data.status === 'FAILED') { + setLoadingComboBoxes({ ...loadingComboBoxes, dataTable: false }); + setToast(errorMessage, 'danger'); + } + }); } - pollQueryStatus(id, http, (data: { status: string; results: any[] }) => { - if (data.status === 'SUCCESS') { - let dataTableOptions: EuiComboBoxOptionOption[] = []; - if (data.results.length > 0) - dataTableOptions = data.results.map((subArray) => ({ label: subArray[1] })); - setTables(dataTableOptions); - setLoadingComboBoxes({ ...loadingComboBoxes, dataTable: false }); - } - if (data.status === 'FAILED') { - setLoadingComboBoxes({ ...loadingComboBoxes, dataTable: false }); - setToast(errorMessage, 'danger'); - } - }); }); }; From f4b6c560b19479aecd14a92ce60b6b1ed190ec65 Mon Sep 17 00:00:00 2001 From: sumukhswamy Date: Mon, 30 Oct 2023 13:33:43 -0700 Subject: [PATCH 4/4] icon changed for wuery loader Signed-off-by: sumukhswamy --- .../Main/__snapshots__/main.test.tsx.snap | 14 +++++++------- public/components/SQLPage/table_view.tsx | 2 +- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/public/components/Main/__snapshots__/main.test.tsx.snap b/public/components/Main/__snapshots__/main.test.tsx.snap index 893ded01..1735ccb1 100644 --- a/public/components/Main/__snapshots__/main.test.tsx.snap +++ b/public/components/Main/__snapshots__/main.test.tsx.snap @@ -193,7 +193,7 @@ exports[`
spec click clear button 1`] = ` >
spec click run button, and response causes an error 1`] = ` >
spec click run button, and response is not ok 1`] = ` >
spec click run button, and response is ok 1`] = ` >
spec click run button, response fills null and missing values >
spec click translation button, and response is ok 1`] = ` >
spec renders the component 1`] = ` >
} {node.type === TREE_ITEM_TABLE_NAME_DEFAULT_NAME && !node.isLoading && ( handleQuery(e,parentName,node.name)} > )}