From 03e1bc240abf7196074518a2a20ec2561c485726 Mon Sep 17 00:00:00 2001
From: Adam Howard <91115+codeincontext@users.noreply.github.com>
Date: Tue, 10 Dec 2024 12:27:03 +0100
Subject: [PATCH] test: remove legacy chromatic mode and use desktop as default

---
 apps/nextjs/.storybook/chromatic.ts                  | 12 +-----------
 apps/nextjs/.storybook/preview.tsx                   |  2 ++
 .../Chat/export-buttons/index.stories.tsx            |  4 ----
 .../components/AppComponents/Chat/header.stories.tsx |  3 +--
 4 files changed, 4 insertions(+), 17 deletions(-)

diff --git a/apps/nextjs/.storybook/chromatic.ts b/apps/nextjs/.storybook/chromatic.ts
index ab39986ca..b2321b0f5 100644
--- a/apps/nextjs/.storybook/chromatic.ts
+++ b/apps/nextjs/.storybook/chromatic.ts
@@ -1,11 +1,6 @@
 import "@storybook/csf";
 
-type ChromaticModes =
-  | "legacy"
-  | "mobile"
-  | "mobile-wide"
-  | "desktop"
-  | "desktop-wide";
+type ChromaticModes = "mobile" | "mobile-wide" | "desktop" | "desktop-wide";
 
 export function chromaticParams(modes: ChromaticModes[]) {
   return {
@@ -23,11 +18,6 @@ export function chromaticParams(modes: ChromaticModes[]) {
         ...(modes.includes("desktop-wide") && {
           "desktop-wide": { viewport: "desktopWide" },
         }),
-        // NOTE: Before we used modes, all snapshots were by default in the 1200px mode.
-        //       This option allows us to reuse the existing desktop snapshot until we're ready to migrate
-        ...(modes.includes("legacy") && {
-          "1200px": { viewport: 1200 as const },
-        }),
       },
     },
   };
diff --git a/apps/nextjs/.storybook/preview.tsx b/apps/nextjs/.storybook/preview.tsx
index c0bed2ea2..55f606d81 100644
--- a/apps/nextjs/.storybook/preview.tsx
+++ b/apps/nextjs/.storybook/preview.tsx
@@ -15,6 +15,7 @@ import { DialogProvider } from "../src/components/AppComponents/DialogContext";
 import { AnalyticsProvider } from "../src/mocks/analytics/provider";
 import { ClerkDecorator } from "../src/mocks/clerk/ClerkDecorator";
 import { TRPCReactProvider } from "../src/utils/trpc";
+import { chromaticParams } from "./chromatic";
 import { RadixThemeDecorator } from "./decorators/RadixThemeDecorator";
 import "./preview.css";
 
@@ -48,6 +49,7 @@ const preview: Preview = {
         },
       },
     },
+    ...chromaticParams(["desktop"]),
   },
   loaders: [mswLoader],
 };
diff --git a/apps/nextjs/src/components/AppComponents/Chat/export-buttons/index.stories.tsx b/apps/nextjs/src/components/AppComponents/Chat/export-buttons/index.stories.tsx
index 8c0ce1c85..10df1a045 100644
--- a/apps/nextjs/src/components/AppComponents/Chat/export-buttons/index.stories.tsx
+++ b/apps/nextjs/src/components/AppComponents/Chat/export-buttons/index.stories.tsx
@@ -4,7 +4,6 @@ import type { ChatContextProps } from "@/components/ContextProviders/ChatProvide
 import { ChatContext } from "@/components/ContextProviders/ChatProvider";
 import { DemoContext } from "@/components/ContextProviders/Demo";
 
-import { chromaticParams } from "../../../../../.storybook/chromatic";
 import ExportButtons from "./";
 
 const ChatDecorator: Story["decorators"] = (Story, { parameters }) => (
@@ -43,9 +42,6 @@ const meta: Meta<typeof ExportButtons> = {
     sectionRefs: {},
     documentContainerRef: { current: null },
   },
-  parameters: {
-    ...chromaticParams(["legacy"]),
-  },
 };
 
 export default meta;
diff --git a/apps/nextjs/src/components/AppComponents/Chat/header.stories.tsx b/apps/nextjs/src/components/AppComponents/Chat/header.stories.tsx
index 5e416bb56..d563f73cc 100644
--- a/apps/nextjs/src/components/AppComponents/Chat/header.stories.tsx
+++ b/apps/nextjs/src/components/AppComponents/Chat/header.stories.tsx
@@ -24,7 +24,6 @@ const meta: Meta<typeof Header> = {
   decorators: [DemoDecorator],
   parameters: {
     layout: "fullscreen",
-    ...chromaticParams(["legacy"]),
     docs: {
       story: {
         height: "150px",
@@ -48,7 +47,7 @@ export const DemoUser: Story = {
       appSessionsPerMonth: 3,
       appSessionsRemaining: 2,
     },
-    ...chromaticParams(["legacy", "desktop-wide"]),
+    ...chromaticParams(["desktop", "desktop-wide"]),
   },
 };