From 33f3d236d628bcf8e7b1321fa39a694081b24446 Mon Sep 17 00:00:00 2001
From: Rafa Audibert <rafaeelaudibert@gmail.com>
Date: Tue, 4 Feb 2025 17:32:08 -0300
Subject: [PATCH] test: Add tests for `ToolbarLaunch` behavior

---
 .../toolbar-launch/ToolbarLaunch.stories.tsx  | 87 +++++++++++++++++++
 .../scenes/toolbar-launch/ToolbarLaunch.tsx   |  2 +-
 2 files changed, 88 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/scenes/toolbar-launch/ToolbarLaunch.stories.tsx

diff --git a/frontend/src/scenes/toolbar-launch/ToolbarLaunch.stories.tsx b/frontend/src/scenes/toolbar-launch/ToolbarLaunch.stories.tsx
new file mode 100644
index 0000000000000..8de27ce7719a4
--- /dev/null
+++ b/frontend/src/scenes/toolbar-launch/ToolbarLaunch.stories.tsx
@@ -0,0 +1,87 @@
+import { Meta, StoryFn } from '@storybook/react'
+import { useActions, useValues } from 'kea'
+import { router } from 'kea-router'
+import { useEffect } from 'react'
+import { teamLogic } from 'scenes/teamLogic'
+import { urls } from 'scenes/urls'
+
+import { mswDecorator, useStorybookMocks } from '~/mocks/browser'
+import { TeamPublicType } from '~/types'
+
+import { ToolbarLaunch } from './ToolbarLaunch'
+
+const meta: Meta = {
+    title: 'Scenes-Other/ToolbarLaunch',
+    parameters: {
+        layout: 'fullscreen',
+        testOptions: {
+            includeNavigationInSnapshot: true,
+        },
+        featureFlags: ['web-experiments', 'web-vitals', 'web-vitals-toolbar'],
+        viewMode: 'story',
+        mockDate: '2024-01-01',
+    },
+    decorators: [
+        mswDecorator({
+            post: {
+                '/api/environments/:environment_id/query/': () => [
+                    200,
+                    {
+                        results: [
+                            ['https://posthog.com', 150],
+                            ['https://app.posthog.com', 100],
+                            ['https://docs.posthog.com', 75],
+                        ],
+                    },
+                ],
+            },
+        }),
+    ],
+}
+export default meta
+
+const Template: StoryFn = () => {
+    useEffect(() => {
+        router.actions.push(urls.dashboards())
+    }, [])
+
+    return <ToolbarLaunch />
+}
+
+export const Default = Template.bind({})
+
+export const NoUrlsTemplate: StoryFn = () => {
+    const { currentTeam } = useValues(teamLogic)
+    const { loadCurrentTeamSuccess } = useActions(teamLogic)
+
+    useEffect(() => {
+        const team = { ...currentTeam, app_urls: [] }
+        loadCurrentTeamSuccess(team as TeamPublicType)
+    }, []) // eslint-disable-line react-hooks/exhaustive-deps
+
+    return <Template />
+}
+
+export const NoSuggestionsTemplate: StoryFn = () => {
+    useStorybookMocks({
+        post: { '/api/environments/:environment_id/query/': () => [200, { results: [] }] },
+    })
+
+    return <Template />
+}
+
+export const EmptyStateTemplate: StoryFn = () => {
+    const { currentTeam } = useValues(teamLogic)
+    const { loadCurrentTeamSuccess } = useActions(teamLogic)
+
+    useEffect(() => {
+        const team = { ...currentTeam, app_urls: [] }
+        loadCurrentTeamSuccess(team as TeamPublicType)
+    }, []) // eslint-disable-line react-hooks/exhaustive-deps
+
+    useStorybookMocks({
+        post: { '/api/environments/:environment_id/query/': () => [200, { results: [] }] },
+    })
+
+    return <Template />
+}
diff --git a/frontend/src/scenes/toolbar-launch/ToolbarLaunch.tsx b/frontend/src/scenes/toolbar-launch/ToolbarLaunch.tsx
index f62c2719f2437..51fcf83436886 100644
--- a/frontend/src/scenes/toolbar-launch/ToolbarLaunch.tsx
+++ b/frontend/src/scenes/toolbar-launch/ToolbarLaunch.tsx
@@ -15,7 +15,7 @@ export const scene: SceneExport = {
     component: ToolbarLaunch,
 }
 
-function ToolbarLaunch(): JSX.Element {
+export function ToolbarLaunch(): JSX.Element {
     const isExperimentsEnabled = useFeatureFlag('WEB_EXPERIMENTS')
     const isWebVitalsEnabled = useFeatureFlag('WEB_VITALS')
     const isWebVitalsToolbarEnabled = useFeatureFlag('WEB_VITALS_TOOLBAR')