From 4b5e972b8e76712ff4a389bc26c78392bfe0685e Mon Sep 17 00:00:00 2001 From: Adam Tackett Date: Wed, 30 Oct 2024 14:11:04 -0700 Subject: [PATCH 1/4] added callout for no data sources pathway in workspaces Signed-off-by: Adam Tackett --- common/constants/shared.ts | 1 + .../add_datasource_callout.test.tsx.snap | 179 ++++++++++++++++++ .../__tests__/add_datasource_callout.test.tsx | 19 ++ .../__tests__/dashboard_controls.test.tsx | 5 + .../components/add_datasource_callout.tsx | 51 +++++ .../components/dashboard_controls.tsx | 35 +++- 6 files changed, 289 insertions(+), 1 deletion(-) create mode 100644 public/components/overview/components/__tests__/__snapshots__/add_datasource_callout.test.tsx.snap create mode 100644 public/components/overview/components/__tests__/add_datasource_callout.test.tsx create mode 100644 public/components/overview/components/add_datasource_callout.tsx diff --git a/common/constants/shared.ts b/common/constants/shared.ts index f4b7f59e4e..2e0e52b4f3 100644 --- a/common/constants/shared.ts +++ b/common/constants/shared.ts @@ -34,6 +34,7 @@ export const JOBS_ENDPOINT_BASE = '/_plugins/_async_query'; export const JOB_RESULT_ENDPOINT = '/result'; export const tutorialSampleDataPluginId = 'import_sample_data'; +export const dataSourcesId = 'dataSources'; export const observabilityID = 'observability-logs'; export const observabilityTitle = 'Observability'; diff --git a/public/components/overview/components/__tests__/__snapshots__/add_datasource_callout.test.tsx.snap b/public/components/overview/components/__tests__/__snapshots__/add_datasource_callout.test.tsx.snap new file mode 100644 index 0000000000..db049b7140 --- /dev/null +++ b/public/components/overview/components/__tests__/__snapshots__/add_datasource_callout.test.tsx.snap @@ -0,0 +1,179 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Add dashboard callout renders add datasource callout 1`] = ` + + +
+ +
+ +
+ + + + + + + +
+ + +
+ +

+ No connected data sources +

+ +
+ + +
+ +
+ +
+

+ There are no data sources associated to the workspace. Associate data sources or request your administrator to associate data sources for you to get started. +

+
+ +
+ +
+ + +
+ + + + + +
+ +
+ +
+ + +`; diff --git a/public/components/overview/components/__tests__/add_datasource_callout.test.tsx b/public/components/overview/components/__tests__/add_datasource_callout.test.tsx new file mode 100644 index 0000000000..960ae1708d --- /dev/null +++ b/public/components/overview/components/__tests__/add_datasource_callout.test.tsx @@ -0,0 +1,19 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import { configure, mount } from 'enzyme'; +import Adapter from 'enzyme-adapter-react-16'; +import React from 'react'; +import { AddDataSourceCallout } from '../add_datasource_callout'; + +describe('Add dashboard callout', () => { + configure({ adapter: new Adapter() }); + + const wrapper = mount(); + + it('renders add datasource callout', async () => { + expect(wrapper).toMatchSnapshot(); + }); +}); diff --git a/public/components/overview/components/__tests__/dashboard_controls.test.tsx b/public/components/overview/components/__tests__/dashboard_controls.test.tsx index f51d8c7b79..b93d3fafaa 100644 --- a/public/components/overview/components/__tests__/dashboard_controls.test.tsx +++ b/public/components/overview/components/__tests__/dashboard_controls.test.tsx @@ -23,6 +23,11 @@ jest.mock('../../../../framework/core_refs', () => ({ contentManagement: { updatePageSection: jest.fn(), }, + http: { + basePath: { + getBasePath: jest.fn(() => '/basePath'), + }, + }, }, })); diff --git a/public/components/overview/components/add_datasource_callout.tsx b/public/components/overview/components/add_datasource_callout.tsx new file mode 100644 index 0000000000..91ac2138cf --- /dev/null +++ b/public/components/overview/components/add_datasource_callout.tsx @@ -0,0 +1,51 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { + EuiFlexGroup, + EuiFlexItem, + EuiPanel, + EuiIcon, + EuiTitle, + EuiText, + EuiButton, +} from '@elastic/eui'; +import { coreRefs } from '../../../framework/core_refs'; +import { dataSourcesId } from '../../../../common/constants/shared'; + +export function AddDataSourceCallout() { + return ( + + + + + + + +

No connected data sources

+ + + + +

+ There are no data sources associated to the workspace. Associate data sources or + request your administrator to associate data sources for you to get started. +

+ + + + coreRefs.application?.navigateToApp(dataSourcesId, { path: '#/' })} + > + Manage data sources + + + + + ); +} diff --git a/public/components/overview/components/dashboard_controls.tsx b/public/components/overview/components/dashboard_controls.tsx index 110afb2a60..a436c04cdd 100644 --- a/public/components/overview/components/dashboard_controls.tsx +++ b/public/components/overview/components/dashboard_controls.tsx @@ -3,6 +3,7 @@ * SPDX-License-Identifier: Apache-2.0 */ +import React, { useEffect, useState } from 'react'; import { EuiFlexGroup, EuiFlexItem, @@ -13,19 +14,49 @@ import { EuiToolTip, } from '@elastic/eui'; import { OnTimeChangeProps } from '@opensearch-project/oui/src/eui_components/date_picker/super_date_picker/super_date_picker'; -import React from 'react'; import { useObservable } from 'react-use'; import { FormattedMessage } from '@osd/i18n/react'; import { coreRefs } from '../../../framework/core_refs'; import { HOME_CONTENT_AREAS } from '../../../plugin_helpers/plugin_overview'; import { redirectToDashboards } from '../../getting_started/components/utils'; import { AddDashboardCallout } from './add_dashboard_callout'; +import { AddDataSourceCallout } from './add_datasource_callout'; import { ObsDashboardStateManager } from './obs_dashboard_state_manager'; +import { SavedObjectsClientCommonFindArgs } from '../../../../../../src/plugins/data/common'; +import { getWorkspaceIdFromUrl } from '../../../../../../src/core/public/utils'; + +const getDatasourceAttributes = async () => { + const findOptions: SavedObjectsClientCommonFindArgs = { + type: 'data-source', + perPage: 1000, + }; + + const allDataSources = await coreRefs?.savedObjectsClient?.find(findOptions); + return allDataSources?.savedObjects ?? []; +}; export function DashboardControls() { + const [isDataSourceEmpty, setIsDataSourceEmpty] = useState(null); const isDashboardSelected = useObservable(ObsDashboardStateManager.isDashboardSelected$); const dashboardState = useObservable(ObsDashboardStateManager.dashboardState$); + useEffect(() => { + const checkDataSource = async () => { + const currentUrl = window.location.href; + const workspaceId = getWorkspaceIdFromUrl(currentUrl, coreRefs?.http!.basePath.getBasePath()); + + // If in a workspace, perform the data source check + if (workspaceId) { + const savedObjectsArray = await getDatasourceAttributes(); + setIsDataSourceEmpty(savedObjectsArray.length === 0); + } else { + // If not in a workspace, set to false to always show AddDashboardCallout + setIsDataSourceEmpty(false); + } + }; + checkDataSource(); + }, []); + const onTimeChange = (onTimeChangeProps: OnTimeChangeProps) => { ObsDashboardStateManager.dashboardState$.next({ ...dashboardState!, @@ -88,6 +119,8 @@ export function DashboardControls() { + ) : isDataSourceEmpty ? ( + ) : ( ); From 5190f1d341e51053c03e323213a3ee31a387a6d2 Mon Sep 17 00:00:00 2001 From: Adam Tackett Date: Wed, 30 Oct 2024 16:30:32 -0700 Subject: [PATCH 2/4] reset dashboard if datasource is deleted Signed-off-by: Adam Tackett --- .../components/dashboard_controls.tsx | 22 ++++++++++++++----- 1 file changed, 16 insertions(+), 6 deletions(-) diff --git a/public/components/overview/components/dashboard_controls.tsx b/public/components/overview/components/dashboard_controls.tsx index a436c04cdd..4a6b42a1e2 100644 --- a/public/components/overview/components/dashboard_controls.tsx +++ b/public/components/overview/components/dashboard_controls.tsx @@ -24,6 +24,7 @@ import { AddDataSourceCallout } from './add_datasource_callout'; import { ObsDashboardStateManager } from './obs_dashboard_state_manager'; import { SavedObjectsClientCommonFindArgs } from '../../../../../../src/plugins/data/common'; import { getWorkspaceIdFromUrl } from '../../../../../../src/core/public/utils'; +import { setObservabilityDashboardsId } from './utils'; const getDatasourceAttributes = async () => { const findOptions: SavedObjectsClientCommonFindArgs = { @@ -37,21 +38,27 @@ const getDatasourceAttributes = async () => { export function DashboardControls() { const [isDataSourceEmpty, setIsDataSourceEmpty] = useState(null); + const [isInWorkspace, setIsInWorkspace] = useState(false); // Track if user is in a workspace const isDashboardSelected = useObservable(ObsDashboardStateManager.isDashboardSelected$); const dashboardState = useObservable(ObsDashboardStateManager.dashboardState$); useEffect(() => { const checkDataSource = async () => { const currentUrl = window.location.href; - const workspaceId = getWorkspaceIdFromUrl(currentUrl, coreRefs?.http!.basePath.getBasePath()); + const workspaceId = getWorkspaceIdFromUrl(currentUrl, coreRefs?.http?.basePath.getBasePath()); - // If in a workspace, perform the data source check if (workspaceId) { + setIsInWorkspace(true); const savedObjectsArray = await getDatasourceAttributes(); setIsDataSourceEmpty(savedObjectsArray.length === 0); + + // Set to null if there are no data sources associated [Handle if dashboard was set, then datasource deleted] + if (savedObjectsArray.length === 0) { + await setObservabilityDashboardsId(null); + } } else { - // If not in a workspace, set to false to always show AddDashboardCallout - setIsDataSourceEmpty(false); + setIsInWorkspace(false); + setIsDataSourceEmpty(false); // Not in workspace } }; checkDataSource(); @@ -78,6 +85,11 @@ export function DashboardControls() { }); }; + // Directly show AddDataSourceCallout if in workspace and no data source is associated + if (isInWorkspace && isDataSourceEmpty) { + return ; + } + return isDashboardSelected ? ( @@ -119,8 +131,6 @@ export function DashboardControls() { - ) : isDataSourceEmpty ? ( - ) : ( ); From 42b6c6bffac2408a56dbcc2b8e47c95e54813db4 Mon Sep 17 00:00:00 2001 From: Adam Tackett Date: Mon, 11 Nov 2024 15:09:21 -0800 Subject: [PATCH 3/4] handle refresh, adjust naming, unit test Signed-off-by: Adam Tackett --- common/constants/shared.ts | 2 +- .../dashboard_controls.test.tsx.snap | 2 +- .../__tests__/dashboard_controls.test.tsx | 71 ++++++++++++++++--- .../components/add_dashboard_callout.tsx | 2 +- .../components/add_datasource_callout.tsx | 6 +- .../components/dashboard_controls.tsx | 4 +- .../components/select_dashboard_flyout.tsx | 3 + public/components/overview/home.tsx | 25 ++++++- public/plugin_helpers/plugin_overview.tsx | 29 ++++---- 9 files changed, 114 insertions(+), 30 deletions(-) diff --git a/common/constants/shared.ts b/common/constants/shared.ts index 9157864b40..6469c0f3d0 100644 --- a/common/constants/shared.ts +++ b/common/constants/shared.ts @@ -35,7 +35,7 @@ export const JOBS_ENDPOINT_BASE = '/_plugins/_async_query'; export const JOB_RESULT_ENDPOINT = '/result'; export const tutorialSampleDataPluginId = 'import_sample_data'; -export const dataSourcesId = 'dataSources'; +export const dataSourceManagementPluginId = 'dataSources'; export const observabilityID = 'observability-logs'; export const observabilityTitle = 'Observability'; diff --git a/public/components/overview/components/__tests__/__snapshots__/dashboard_controls.test.tsx.snap b/public/components/overview/components/__tests__/__snapshots__/dashboard_controls.test.tsx.snap index ca777e4441..41fe8c20ef 100644 --- a/public/components/overview/components/__tests__/__snapshots__/dashboard_controls.test.tsx.snap +++ b/public/components/overview/components/__tests__/__snapshots__/dashboard_controls.test.tsx.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`Dashboard controls should render 1`] = ` +exports[`Dashboard controls - checkDataSource useEffect simplified should render 1`] = ` { - return mount(); -}; - jest.mock('../../../getting_started/components/utils', () => ({ redirectToDashboards: jest.fn(), })); jest.mock('../../../../framework/core_refs', () => ({ coreRefs: { - contentManagement: { - updatePageSection: jest.fn(), + savedObjectsClient: { + find: jest.fn(), }, http: { basePath: { @@ -31,13 +31,68 @@ jest.mock('../../../../framework/core_refs', () => ({ }, })); -describe('Dashboard controls', () => { +jest.mock('../utils', () => ({ + setObservabilityDashboardsId: jest.fn(), +})); + +jest.mock('../../../../../common/utils', () => ({ + getOverviewPage: jest.fn(() => ({ + removeSection: jest.fn(), + })), +})); + +jest.mock('../../../../../../../src/core/public/utils', () => ({ + getWorkspaceIdFromUrl: jest.fn(), +})); + +describe('Dashboard controls - checkDataSource useEffect simplified', () => { beforeEach(() => { jest.clearAllMocks(); }); it('should render', () => { - const wrapper = mountDashboardControls(); + const wrapper = mount(); expect(wrapper).toMatchSnapshot(); }); + + it('should handle no data sources in a workspace', async () => { + getWorkspaceIdFromUrl.mockReturnValue('workspace123'); + coreRefs.savedObjectsClient.find.mockResolvedValue({ savedObjects: [] }); + + const mockSetObservabilityDashboardsId = setObservabilityDashboardsId; + + await act(async () => { + mount(); + await new Promise((resolve) => setImmediate(resolve)); + }); + + expect(mockSetObservabilityDashboardsId).toHaveBeenCalledWith(null); + }); + + it('should handle existing data sources in a workspace', async () => { + getWorkspaceIdFromUrl.mockReturnValue('workspace123'); + coreRefs.savedObjectsClient.find.mockResolvedValue({ savedObjects: [{ id: 'ds1' }] }); + + const mockSetObservabilityDashboardsId = setObservabilityDashboardsId; + + await act(async () => { + mount(); + await new Promise((resolve) => setImmediate(resolve)); + }); + + expect(mockSetObservabilityDashboardsId).not.toHaveBeenCalled(); + }); + + it('should handle non-workspace scenario', async () => { + getWorkspaceIdFromUrl.mockReturnValue(null); + + const mockSetObservabilityDashboardsId = setObservabilityDashboardsId; + + await act(async () => { + mount(); + await new Promise((resolve) => setImmediate(resolve)); + }); + + expect(mockSetObservabilityDashboardsId).not.toHaveBeenCalled(); + }); }); diff --git a/public/components/overview/components/add_dashboard_callout.tsx b/public/components/overview/components/add_dashboard_callout.tsx index d8600da491..bab90c4b24 100644 --- a/public/components/overview/components/add_dashboard_callout.tsx +++ b/public/components/overview/components/add_dashboard_callout.tsx @@ -26,7 +26,7 @@ import SampleDataLightPNG from './assets/SampleDataLight.png'; export function AddDashboardCallout() { const showFlyout = useObservable(ObsDashboardStateManager.showFlyout$); - const isDarkMode = uiSettingsService.get('theme:darkMode'); + const isDarkMode = uiSettingsService?.get('theme:darkMode') ?? false; return ( diff --git a/public/components/overview/components/add_datasource_callout.tsx b/public/components/overview/components/add_datasource_callout.tsx index 91ac2138cf..02d5c94b6d 100644 --- a/public/components/overview/components/add_datasource_callout.tsx +++ b/public/components/overview/components/add_datasource_callout.tsx @@ -14,7 +14,7 @@ import { EuiButton, } from '@elastic/eui'; import { coreRefs } from '../../../framework/core_refs'; -import { dataSourcesId } from '../../../../common/constants/shared'; +import { dataSourceManagementPluginId } from '../../../../common/constants/shared'; export function AddDataSourceCallout() { return ( @@ -40,7 +40,9 @@ export function AddDataSourceCallout() { coreRefs.application?.navigateToApp(dataSourcesId, { path: '#/' })} + onClick={() => + coreRefs.application?.navigateToApp(dataSourceManagementPluginId, { path: '#/' }) + } > Manage data sources diff --git a/public/components/overview/components/dashboard_controls.tsx b/public/components/overview/components/dashboard_controls.tsx index 4a6b42a1e2..dded0d7711 100644 --- a/public/components/overview/components/dashboard_controls.tsx +++ b/public/components/overview/components/dashboard_controls.tsx @@ -17,7 +17,7 @@ import { OnTimeChangeProps } from '@opensearch-project/oui/src/eui_components/da import { useObservable } from 'react-use'; import { FormattedMessage } from '@osd/i18n/react'; import { coreRefs } from '../../../framework/core_refs'; -import { HOME_CONTENT_AREAS } from '../../../plugin_helpers/plugin_overview'; +import { HOME_CONTENT_AREAS, SECTIONS } from '../../../plugin_helpers/plugin_overview'; import { redirectToDashboards } from '../../getting_started/components/utils'; import { AddDashboardCallout } from './add_dashboard_callout'; import { AddDataSourceCallout } from './add_datasource_callout'; @@ -25,6 +25,7 @@ import { ObsDashboardStateManager } from './obs_dashboard_state_manager'; import { SavedObjectsClientCommonFindArgs } from '../../../../../../src/plugins/data/common'; import { getWorkspaceIdFromUrl } from '../../../../../../src/core/public/utils'; import { setObservabilityDashboardsId } from './utils'; +import { getOverviewPage } from '../../../../common/utils'; const getDatasourceAttributes = async () => { const findOptions: SavedObjectsClientCommonFindArgs = { @@ -55,6 +56,7 @@ export function DashboardControls() { // Set to null if there are no data sources associated [Handle if dashboard was set, then datasource deleted] if (savedObjectsArray.length === 0) { await setObservabilityDashboardsId(null); + getOverviewPage().removeSection(SECTIONS.DASHBOARD); // Clear the present dashboard } } else { setIsInWorkspace(false); diff --git a/public/components/overview/components/select_dashboard_flyout.tsx b/public/components/overview/components/select_dashboard_flyout.tsx index eb914aaedd..1d01b90130 100644 --- a/public/components/overview/components/select_dashboard_flyout.tsx +++ b/public/components/overview/components/select_dashboard_flyout.tsx @@ -26,6 +26,8 @@ import { ObsDashboardStateManager } from './obs_dashboard_state_manager'; import { getObservabilityDashboardsId, setObservabilityDashboardsId } from './utils'; import { coreRefs } from '../../../framework/core_refs'; import { tutorialSampleDataPluginId } from '../../../../common/constants/shared'; +import { getOverviewPage } from '../../../../common/utils'; +import { DASHBOARD_SECTION } from '../../../../public/plugin_helpers/plugin_overview'; export interface Props { closeFlyout: () => void; @@ -61,6 +63,7 @@ export function SelectDashboardFlyout({ closeFlyout, dashboardsSavedObjects, rel const onClickAdd = async () => { const selectedOption = options.find((option) => option.checked === 'on'); if (selectedOption && selectedOption.key) { + getOverviewPage().createSection(DASHBOARD_SECTION); setIsLoading(true); ObsDashboardStateManager.isDashboardSelected$.next(true); await setObservabilityDashboardsId(selectedOption.key); diff --git a/public/components/overview/home.tsx b/public/components/overview/home.tsx index 66256500ae..e06898f46a 100644 --- a/public/components/overview/home.tsx +++ b/public/components/overview/home.tsx @@ -10,6 +10,9 @@ import { EuiIcon, EuiButtonEmpty, EuiToolTip, + EuiFlexGroup, + EuiFlexItem, + EuiLoadingSpinner, } from '@elastic/eui'; import React, { ReactNode, useEffect, useMemo, useState } from 'react'; import { HashRouter, Route, Switch } from 'react-router-dom'; @@ -51,6 +54,7 @@ export const Home = () => { const [isFlyoutVisible, setIsFlyoutVisible] = useState(false); const [isPopoverOpen, setIsPopoverOpen] = useState(false); const [showGetStarted, setShowGetStarted] = useState(null); // Initial null state + const [isDashboardLoaded, setIsDashboardLoaded] = useState(false); const canUpdateUiSetting = useMemo(() => { const capabilities = coreRefs.application?.capabilities; @@ -74,6 +78,7 @@ export const Home = () => { const closePopover = () => setIsPopoverOpen(false); const loadDashboardState = () => { + setIsDashboardLoaded(false); coreRefs.savedObjectsClient ?.find({ type: 'dashboard', @@ -92,6 +97,7 @@ export const Home = () => { startDate: dashboardAttributes.timeFrom, endDate: dashboardAttributes.timeTo, }; + setIsDashboardLoaded(true); return acc; }, {} as DashboardSavedObjectsType); @@ -121,6 +127,7 @@ export const Home = () => { }) .catch((error) => { console.error('Error fetching dashboards:', error); + setIsDashboardLoaded(true); }); }; @@ -382,8 +389,22 @@ export const Home = () => {
- {homePage} - {flyout} + {isDashboardLoaded ? ( + <> + {homePage} + {flyout} + + ) : ( + + + + + + )}
diff --git a/public/plugin_helpers/plugin_overview.tsx b/public/plugin_helpers/plugin_overview.tsx index cb9571babc..a184826250 100644 --- a/public/plugin_helpers/plugin_overview.tsx +++ b/public/plugin_helpers/plugin_overview.tsx @@ -32,23 +32,24 @@ export const GET_STARTED_SECTION: Section = { columns: 5, }; +export const SELECTOR_SECTION: Section = { + id: SECTIONS.SELECTOR, + order: 2000, + title: 'Dashboards controls', + kind: 'custom', + render: (contents) =>
{contents[0].render()}
, +}; + +export const DASHBOARD_SECTION: Section = { + id: SECTIONS.DASHBOARD, + order: 3000, + kind: 'dashboard', +}; + export const setupOverviewPage = (contentManagement: ContentManagementPluginSetup) => { return contentManagement.registerPage({ id: HOME_PAGE_ID, title: 'Home', - sections: [ - { - id: SECTIONS.SELECTOR, - order: 2000, - title: 'Dashboards controls', - kind: 'custom', - render: (contents) =>
{contents[0].render()}
, - }, - { - id: SECTIONS.DASHBOARD, - order: 3000, - kind: 'dashboard', - }, - ], + sections: [SELECTOR_SECTION, DASHBOARD_SECTION], }); }; From b06e832f220d30690ed7f8babc8cf63e539b7761 Mon Sep 17 00:00:00 2001 From: Adam Tackett Date: Mon, 11 Nov 2024 17:13:15 -0800 Subject: [PATCH 4/4] add i18n, finally block, move function Signed-off-by: Adam Tackett --- .../components/add_datasource_callout.tsx | 7 ++-- .../components/dashboard_controls.tsx | 35 ++++++++++--------- public/components/overview/home.tsx | 4 +-- 3 files changed, 25 insertions(+), 21 deletions(-) diff --git a/public/components/overview/components/add_datasource_callout.tsx b/public/components/overview/components/add_datasource_callout.tsx index 02d5c94b6d..fa7b47a772 100644 --- a/public/components/overview/components/add_datasource_callout.tsx +++ b/public/components/overview/components/add_datasource_callout.tsx @@ -13,6 +13,7 @@ import { EuiText, EuiButton, } from '@elastic/eui'; +import { i18n } from '@osd/i18n'; import { coreRefs } from '../../../framework/core_refs'; import { dataSourceManagementPluginId } from '../../../../common/constants/shared'; @@ -31,8 +32,10 @@ export function AddDataSourceCallout() {

- There are no data sources associated to the workspace. Associate data sources or - request your administrator to associate data sources for you to get started. + {i18n.translate('traceAnalytics.noDataSourcesMessage', { + defaultMessage: + 'There are no data sources associated to the workspace. Associate data sources or request your administrator to associate data sources for you to get started.', + })}

diff --git a/public/components/overview/components/dashboard_controls.tsx b/public/components/overview/components/dashboard_controls.tsx index dded0d7711..c513b92d36 100644 --- a/public/components/overview/components/dashboard_controls.tsx +++ b/public/components/overview/components/dashboard_controls.tsx @@ -43,26 +43,27 @@ export function DashboardControls() { const isDashboardSelected = useObservable(ObsDashboardStateManager.isDashboardSelected$); const dashboardState = useObservable(ObsDashboardStateManager.dashboardState$); - useEffect(() => { - const checkDataSource = async () => { - const currentUrl = window.location.href; - const workspaceId = getWorkspaceIdFromUrl(currentUrl, coreRefs?.http?.basePath.getBasePath()); + const checkDataSource = async () => { + const currentUrl = window.location.href; + const workspaceId = getWorkspaceIdFromUrl(currentUrl, coreRefs?.http?.basePath.getBasePath()); - if (workspaceId) { - setIsInWorkspace(true); - const savedObjectsArray = await getDatasourceAttributes(); - setIsDataSourceEmpty(savedObjectsArray.length === 0); + if (workspaceId) { + setIsInWorkspace(true); + const savedObjectsArray = await getDatasourceAttributes(); + setIsDataSourceEmpty(savedObjectsArray.length === 0); - // Set to null if there are no data sources associated [Handle if dashboard was set, then datasource deleted] - if (savedObjectsArray.length === 0) { - await setObservabilityDashboardsId(null); - getOverviewPage().removeSection(SECTIONS.DASHBOARD); // Clear the present dashboard - } - } else { - setIsInWorkspace(false); - setIsDataSourceEmpty(false); // Not in workspace + // Set to null if there are no data sources associated [Handle if dashboard was set, then datasource deleted] + if (savedObjectsArray.length === 0) { + await setObservabilityDashboardsId(null); + getOverviewPage().removeSection(SECTIONS.DASHBOARD); // Clear the present dashboard } - }; + } else { + setIsInWorkspace(false); + setIsDataSourceEmpty(false); // Not in workspace + } + }; + + useEffect(() => { checkDataSource(); }, []); diff --git a/public/components/overview/home.tsx b/public/components/overview/home.tsx index e06898f46a..b21aa3d424 100644 --- a/public/components/overview/home.tsx +++ b/public/components/overview/home.tsx @@ -97,7 +97,6 @@ export const Home = () => { startDate: dashboardAttributes.timeFrom, endDate: dashboardAttributes.timeTo, }; - setIsDashboardLoaded(true); return acc; }, {} as DashboardSavedObjectsType); @@ -127,6 +126,8 @@ export const Home = () => { }) .catch((error) => { console.error('Error fetching dashboards:', error); + }) + .finally(() => { setIsDashboardLoaded(true); }); }; @@ -182,7 +183,6 @@ export const Home = () => { closePopover(); if (updatedShowCards) { - console.log('Called createSection'); getOverviewPage().createSection(GET_STARTED_SECTION); } else { getOverviewPage().removeSection(SECTIONS.GET_STARTED);