chore: add story

apps/studio/src/components/Searchbar.tsx

@@ -219,6 +219,7 @@ const SearchButton = (props: ButtonProps) => {
       rounded="md"
       border="1px solid"
       borderColor="base.divider.strong"
+      aria-label="search-button"
       {...props}
     >
       <Box __css={styles.icon}>

apps/studio/src/stories/Page/SitePage.stories.tsx

@@ -3,6 +3,7 @@ import { userEvent, waitFor, within } from "@storybook/test"
 import { meHandlers } from "tests/msw/handlers/me"
 import { pageHandlers } from "tests/msw/handlers/page"
 import { resourceHandlers } from "tests/msw/handlers/resource"
+import { sitesHandlers } from "tests/msw/handlers/sites"
 
 import SitePage from "~/pages/sites/[siteId]"
 import { createBannerGbParameters } from "../utils/growthbook"
@@ -21,6 +22,7 @@ const meta: Meta<typeof SitePage> = {
         pageHandlers.readPage.content(),
         pageHandlers.updateSettings.collection(),
         pageHandlers.getPermalinkTree.withParent(),
+        sitesHandlers.getSiteName.default(),
         resourceHandlers.getChildrenOf.default(),
         resourceHandlers.getRolesFor.default(),
       ],
@@ -43,6 +45,18 @@ export const Default: Story = {
   args: {},
 }
 
+export const SearchModal: Story = {
+  play: async ({ canvasElement }) => {
+    await waitFor(async () => {
+      const screen = within(canvasElement)
+      const searchButton = screen.getByRole("button", {
+        name: "search-button",
+      })
+      await userEvent.click(searchButton)
+    })
+  },
+}
+
 export const PageResourceMenu: Story = {
   play: async ({ canvasElement }) => {
     await waitFor(async () => {

apps/studio/tests/msw/handlers/sites.ts

@@ -41,6 +41,13 @@ export const sitesHandlers = {
     loading: () => siteListQuery({ wait: "infinite" }),
     empty: () => siteListQuery({ isEmpty: true }),
   },
+  getSiteName: {
+    default: () => {
+      return trpcMsw.site.getSiteName.query(async () => {
+        return { name: "Isomer" }
+      })
+    },
+  },
   getTheme: {
     default: () => {
       return trpcMsw.site.getTheme.query(() => {