Add clean sample for Notification component

hoodieshq · Mar 28, 2024 · ff8b815 · ff8b815
1 parent 0de86bd
commit ff8b815
Showing 1 changed file with 36 additions and 13 deletions.
diff --git a/packages/ui/src/__stories__/features/notification.stories.tsx b/packages/ui/src/__stories__/features/notification.stories.tsx
@@ -39,23 +39,46 @@ const notificationStory = {
 export default notificationStory
 
 export const Default: StoryObj<React.ComponentProps<typeof Notification>> = {
-  args: {},
+  parameters: {
+    docs: {
+      source: {
+        type: "code",
+        code: `
+<NotificationProvider
+  onInspect={({ link }) => {}}
+  swipeDirection="right"
+>
+  <Inner />
+</NotificationProvider>
+
+function Inner() {
+  const { setNotification } = useNotificationContext()
+  return (
+    <button
+      onClick={() => setNotification({ message: "text", link: "https://example.com" })}
+    >
+      Show toast
+    </button>
+  )
+}
+`,
+      },
+    },
+  },
   render: () => {
     const { setNotification } = useNotificationContext()
 
     return (
-      <>
-        <button
-          type="button"
-          role="button"
-          className="ml-3 rounded-md bg-white text-sm font-medium"
-          onClick={() => {
-            setNotification({ message: "Notification text" })
-          }}
-        >
-          Show Notification
-        </button>
-      </>
+      <button
+        type="button"
+        role="button"
+        className="ml-3 rounded-md bg-white text-sm font-medium"
+        onClick={() => {
+          setNotification({ message: "Notification text" })
+        }}
+      >
+        Show Notification
+      </button>
     )
   },
   async play({ canvasElement, step }: any) {