docs: remove unnecessary step (#731)

* docs: remove unnecessary step * small fixes
assistant-ui · Sep 5, 2024 · 8ec5acc · 8ec5acc
1 parent e22e098
commit 8ec5acc
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 16 deletions.
diff --git a/apps/docs/content/docs/ui/shadcn-ui/Scrollbar.mdx b/apps/docs/content/docs/ui/shadcn-ui/Scrollbar.mdx
@@ -32,29 +32,28 @@ Add the following CSS to your `globals.css`:
 
 ## Integration
 
-- Decompose `Thread` into `MyThread` (see [Decomposition](/docs/ui/styled/Decomposition))
 - Wrap `Thread.Root` with `<ScrollAreaPrimitive.Root asChild>`
 - Wrap `Thread.Viewport` with `<ScrollAreaPrimitive.Viewport className="thread-viewport" asChild>`
 - Add shadcn's `<ScrollBar />` to `Thread.Root`
 
 The resulting MyThread component should look like this:
 
 ```tsx
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { ScrollBar } from "@/components/ui/scroll-area";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"; // [!code highlight]
+import { ScrollBar } from "@/components/ui/scroll-area"; // [!code highlight]
 
-const MyThread: FC<ThreadConfig> = (config) => {
+const MyThread: FC = () => {
   return (
-    <ScrollAreaPrimitive.Root asChild> // [!code highlight]
+    <ScrollAreaPrimitive.Root asChild> /* [!code highlight] */
       <ThreadPrimitive.Root className="...">
-        <ScrollAreaPrimitive.Viewport className="thread-viewport" asChild>  // [!code highlight]
+        <ScrollAreaPrimitive.Viewport className="thread-viewport" asChild>  /* [!code highlight] */
           <ThreadPrimitive.Viewport className="...">
             ...
           </ThreadPrimitive.Viewport>
-        </ScrollAreaPrimitive.Viewport>  // [!code highlight]
-        <ScrollBar /> // [!code highlight]
+        </ScrollAreaPrimitive.Viewport> /* [!code highlight] */
+        <ScrollBar /> /* [!code highlight] */
       </ThreadPrimitive.Root>
-    </ScrollAreaPrimitive.Root>  // [!code highlight]
+    </ScrollAreaPrimitive.Root>  /* [!code highlight] */
   );
 };
 ```
diff --git a/apps/docs/content/docs/ui/styled/Scrollbar.mdx b/apps/docs/content/docs/ui/styled/Scrollbar.mdx
@@ -46,14 +46,14 @@ import {
   Composer,
   type ThreadConfig,
 } from "@assistant-ui/react";
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { ScrollBar } from "@/components/ui/scroll-area";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"; // [!code highlight]
+import { ScrollBar } from "@/components/ui/scroll-area"; // [!code highlight]
 
 const MyThread: FC<ThreadConfig> = (config) => {
   return (
-    <ScrollAreaPrimitive.Root asChild> // [!code highlight]
+    <ScrollAreaPrimitive.Root asChild> /* [!code highlight] */
       <Thread.Root config={config}>
-        <ScrollAreaPrimitive.Viewport asChild> // [!code highlight]
+        <ScrollAreaPrimitive.Viewport asChild> /* [!code highlight] */
           <Thread.Viewport>
             <ThreadWelcome />
             <Thread.Messages />
@@ -62,10 +62,10 @@ const MyThread: FC<ThreadConfig> = (config) => {
               <Composer />
             </Thread.ViewportFooter>
           </Thread.Viewport>
-        </ScrollAreaPrimitive.Viewport> // [!code highlight]
-        <ScrollBar /> // [!code highlight]
+        </ScrollAreaPrimitive.Viewport> /* [!code highlight] */
+        <ScrollBar /> /* [!code highlight] */
       </Thread.Root>
-    </ScrollAreaPrimitive.Root> // [!code highlight]
+    </ScrollAreaPrimitive.Root> /* [!code highlight] */
   );
 };
 ```