From 1f550c61f09fccfc18e5f45e00043a96c84dcef7 Mon Sep 17 00:00:00 2001 From: Chris Bedwell Date: Mon, 25 Nov 2024 15:03:13 +0000 Subject: [PATCH] refactor: split uninitialisedRouter --- src/components/App.tsx | 2 +- src/contexts/SMDatasourceContext.tsx | 2 +- src/page/ChecksPage.test.tsx | 2 +- ...rs.test.tsx => InitialisedRouter.test.tsx} | 52 +--------------- .../{Routers.tsx => InitialisedRouter.tsx} | 35 ----------- src/routing/UninitialisedRouter.test.tsx | 60 +++++++++++++++++++ src/routing/UninitialisedRouter.tsx | 40 +++++++++++++ 7 files changed, 104 insertions(+), 89 deletions(-) rename src/routing/{Routers.test.tsx => InitialisedRouter.test.tsx} (62%) rename src/routing/{Routers.tsx => InitialisedRouter.tsx} (76%) create mode 100644 src/routing/UninitialisedRouter.test.tsx create mode 100644 src/routing/UninitialisedRouter.tsx diff --git a/src/components/App.tsx b/src/components/App.tsx index c3119a08d..7fee388de 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -5,7 +5,7 @@ import { AppRootProps } from '@grafana/data'; import { css, Global } from '@emotion/react'; import { ProvisioningJsonData } from 'types'; -import { InitialisedRouter } from 'routing/Routers'; +import { InitialisedRouter } from 'routing/InitialisedRouter'; import { MetaContextProvider } from 'contexts/MetaContext'; import { PermissionsContextProvider } from 'contexts/PermissionsContext'; import { SMDatasourceProvider } from 'contexts/SMDatasourceContext'; diff --git a/src/contexts/SMDatasourceContext.tsx b/src/contexts/SMDatasourceContext.tsx index ad3089bbf..0979451f4 100644 --- a/src/contexts/SMDatasourceContext.tsx +++ b/src/contexts/SMDatasourceContext.tsx @@ -1,7 +1,7 @@ import React, { createContext, PropsWithChildren, useContext } from 'react'; import { PluginPage } from '@grafana/runtime'; -import { UninitialisedRouter } from 'routing/Routers'; +import { UninitialisedRouter } from 'routing/UninitialisedRouter'; import { SMDataSource } from 'datasource/DataSource'; import { useGetSMDatasource } from 'data/useSMSetup'; import { CenteredSpinner } from 'components/CenteredSpinner'; diff --git a/src/page/ChecksPage.test.tsx b/src/page/ChecksPage.test.tsx index 4d6a39bd0..a8190ff1d 100644 --- a/src/page/ChecksPage.test.tsx +++ b/src/page/ChecksPage.test.tsx @@ -12,7 +12,7 @@ import { server } from 'test/server'; import { AlertSensitivity, Check, CheckTypeGroup, ROUTES } from 'types'; import { PLUGIN_URL_PATH } from 'routing/constants'; -import { InitialisedRouter } from 'routing/Routers'; +import { InitialisedRouter } from 'routing/InitialisedRouter'; import { generateRoutePath } from 'routing/utils'; import { FeatureFlagProvider } from '../components/FeatureFlagProvider'; diff --git a/src/routing/Routers.test.tsx b/src/routing/InitialisedRouter.test.tsx similarity index 62% rename from src/routing/Routers.test.tsx rename to src/routing/InitialisedRouter.test.tsx index 7a041e42d..83c860043 100644 --- a/src/routing/Routers.test.tsx +++ b/src/routing/InitialisedRouter.test.tsx @@ -5,17 +5,13 @@ import { type CustomRenderOptions, render } from 'test/render'; import { ROUTES } from 'types'; import { PLUGIN_URL_PATH } from 'routing/constants'; -import { InitialisedRouter, UninitialisedRouter } from 'routing/Routers'; +import { InitialisedRouter } from 'routing/InitialisedRouter'; import { getRoute } from 'routing/utils'; function renderInitialisedRouting(options?: CustomRenderOptions) { return render(, options); } -function renderUninitialisedRouting(options?: CustomRenderOptions) { - render(, options); -} - // Mocking these pages because they renders scenes, which makes jest explode jest.mock('page/DashboardPage', () => ({ DashboardPage: () =>

Dashboard page

, @@ -27,52 +23,6 @@ jest.mock('page/SceneHomepage', () => ({ const notaRoute = `${PLUGIN_URL_PATH}/404`; -describe('Renders specific welcome pages when app is not initializd', () => { - test(`Route Home`, async () => { - renderUninitialisedRouting({ path: getRoute(ROUTES.Home) }); - const text = await screen.findByText('Up and running in seconds, no instrumentation required'); - expect(text).toBeInTheDocument(); - }); - - test(`Route Probes`, async () => { - renderUninitialisedRouting({ path: getRoute(ROUTES.Probes) }); - const text = await screen.findByText( - 'Click the See Probes button to initialize the plugin and see a list of public probes', - { exact: false } - ); - expect(text).toBeInTheDocument(); - }); - - test(`Route Alerts`, async () => { - renderUninitialisedRouting({ path: getRoute(ROUTES.Alerts) }); - const text = await screen.findByText( - 'Click the See Alerting button to initialize the plugin and see a list of default alerts', - { exact: false } - ); - expect(text).toBeInTheDocument(); - }); - test(`Route Checks`, async () => { - renderUninitialisedRouting({ path: getRoute(ROUTES.Checks) }); - const text = await screen.findByText('Click the Create a Check button to initialize the plugin and create checks', { - exact: false, - }); - expect(text).toBeInTheDocument(); - }); - - test(`Route Config`, async () => { - renderUninitialisedRouting({ path: getRoute(ROUTES.Config) }); - - const text = await screen.findByText('Synthetic Monitoring is not yet initialized'); - expect(text).toBeInTheDocument(); - }); - - test('Non-existent route (404)', async () => { - renderUninitialisedRouting({ path: notaRoute }); - const text = await screen.findByText('Up and running in seconds, no instrumentation required'); - expect(text).toBeInTheDocument(); - }); -}); - // Would like to have asserted on the h1s but rendering the Grafana pluginpage is tricky describe('Routes to pages correctly', () => { test('Home page renders', async () => { diff --git a/src/routing/Routers.tsx b/src/routing/InitialisedRouter.tsx similarity index 76% rename from src/routing/Routers.tsx rename to src/routing/InitialisedRouter.tsx index c74473f5c..8e4023ebd 100644 --- a/src/routing/Routers.tsx +++ b/src/routing/InitialisedRouter.tsx @@ -7,17 +7,13 @@ import { LegacyEditRedirect } from 'routing/LegacyEditRedirect'; import { getNewCheckTypeRedirects, getRoute } from 'routing/utils'; import { useCanWriteSM } from 'hooks/useDSPermission'; import { useLimits } from 'hooks/useLimits'; -import { useMeta } from 'hooks/useMeta'; import { QueryParamMap, useNavigation } from 'hooks/useNavigation'; import { useQuery } from 'hooks/useQuery'; import { AlertingPage } from 'page/AlertingPage'; -import { AlertingWelcomePage } from 'page/AlertingWelcomePage'; -import { ChecksWelcomePage } from 'page/ChecksWelcomePage'; import { ConfigPageLayout } from 'page/ConfigPageLayout'; import { AccessTokensTab } from 'page/ConfigPageLayout/tabs/AccessTokensTab'; import { GeneralTab } from 'page/ConfigPageLayout/tabs/GeneralTab'; import { TerraformTab } from 'page/ConfigPageLayout/tabs/TerraformTab'; -import { UninitializedTab } from 'page/ConfigPageLayout/tabs/UninitializedTab'; import { DashboardPage } from 'page/DashboardPage'; import { EditCheck } from 'page/EditCheck'; import { EditProbe } from 'page/EditProbe'; @@ -26,10 +22,7 @@ import { NewProbe } from 'page/NewProbe'; import { CheckNotFound } from 'page/NotFound/CheckNotFound'; import { PluginPageNotFound } from 'page/NotFound/NotFound'; import { Probes } from 'page/Probes'; -import { ProbesWelcomePage } from 'page/ProbesWelcomePage'; import { SceneHomepage } from 'page/SceneHomepage'; -import { UnprovisionedSetup } from 'page/UnprovisionedSetup'; -import { WelcomePage } from 'page/WelcomePage'; import { CheckList } from '../components/CheckList'; import { ChooseCheckGroup } from '../components/ChooseCheckGroup'; @@ -126,31 +119,3 @@ export const InitialisedRouter = () => { ); }; - -export const UninitialisedRouter = () => { - const meta = useMeta(); - const provisioned = Boolean(meta.jsonData?.metrics?.grafanaName); - - // todo: is this the correct check for provisioning? - // todo: is this state even possible in Grafana v11? - if (!provisioned) { - return ; - } - - return ( - - } /> - } /> - } /> - } /> - } /> - - } /> - } /> - - - {/* TODO: Create 404 instead of navigating to home(?) */} - } /> - - ); -}; diff --git a/src/routing/UninitialisedRouter.test.tsx b/src/routing/UninitialisedRouter.test.tsx new file mode 100644 index 000000000..2bb480246 --- /dev/null +++ b/src/routing/UninitialisedRouter.test.tsx @@ -0,0 +1,60 @@ +import React from 'react'; +import { screen } from '@testing-library/react'; +import { type CustomRenderOptions, render } from 'test/render'; + +import { ROUTES } from 'types'; +import { PLUGIN_URL_PATH } from 'routing/constants'; +import { UninitialisedRouter } from 'routing/UninitialisedRouter'; +import { getRoute } from 'routing/utils'; + +function renderUninitialisedRouting(options?: CustomRenderOptions) { + render(, options); +} + +const notaRoute = `${PLUGIN_URL_PATH}/404`; + +describe('Renders specific welcome pages when app is not initializd', () => { + test(`Route Home`, async () => { + renderUninitialisedRouting({ path: getRoute(ROUTES.Home) }); + const text = await screen.findByText('Up and running in seconds, no instrumentation required'); + expect(text).toBeInTheDocument(); + }); + + test(`Route Probes`, async () => { + renderUninitialisedRouting({ path: getRoute(ROUTES.Probes) }); + const text = await screen.findByText( + 'Click the See Probes button to initialize the plugin and see a list of public probes', + { exact: false } + ); + expect(text).toBeInTheDocument(); + }); + + test(`Route Alerts`, async () => { + renderUninitialisedRouting({ path: getRoute(ROUTES.Alerts) }); + const text = await screen.findByText( + 'Click the See Alerting button to initialize the plugin and see a list of default alerts', + { exact: false } + ); + expect(text).toBeInTheDocument(); + }); + test(`Route Checks`, async () => { + renderUninitialisedRouting({ path: getRoute(ROUTES.Checks) }); + const text = await screen.findByText('Click the Create a Check button to initialize the plugin and create checks', { + exact: false, + }); + expect(text).toBeInTheDocument(); + }); + + test(`Route Config`, async () => { + renderUninitialisedRouting({ path: getRoute(ROUTES.Config) }); + + const text = await screen.findByText('Synthetic Monitoring is not yet initialized'); + expect(text).toBeInTheDocument(); + }); + + test('Non-existent route (404)', async () => { + renderUninitialisedRouting({ path: notaRoute }); + const text = await screen.findByText('Up and running in seconds, no instrumentation required'); + expect(text).toBeInTheDocument(); + }); +}); diff --git a/src/routing/UninitialisedRouter.tsx b/src/routing/UninitialisedRouter.tsx new file mode 100644 index 000000000..aba753730 --- /dev/null +++ b/src/routing/UninitialisedRouter.tsx @@ -0,0 +1,40 @@ +import React from 'react'; +import { Navigate, Route, Routes } from 'react-router-dom-v5-compat'; + +import { ROUTES } from 'types'; +import { useMeta } from 'hooks/useMeta'; +import { AlertingWelcomePage } from 'page/AlertingWelcomePage'; +import { ChecksWelcomePage } from 'page/ChecksWelcomePage'; +import { ConfigPageLayout } from 'page/ConfigPageLayout'; +import { UninitializedTab } from 'page/ConfigPageLayout/tabs/UninitializedTab'; +import { ProbesWelcomePage } from 'page/ProbesWelcomePage'; +import { UnprovisionedSetup } from 'page/UnprovisionedSetup'; +import { WelcomePage } from 'page/WelcomePage'; + +export const UninitialisedRouter = () => { + const meta = useMeta(); + const provisioned = Boolean(meta.jsonData?.metrics?.grafanaName); + + // todo: is this the correct check for provisioning? + // todo: is this state even possible in Grafana v11? + if (!provisioned) { + return ; + } + + return ( + + } /> + } /> + } /> + } /> + } /> + + } /> + } /> + + + {/* TODO: Create 404 instead of navigating to home(?) */} + } /> + + ); +};