Revert "Unify workspace dropdowns; Update layouts (#458)"

This reverts commit 4bc8448a1d.

packages/ui/src/shadcn/scroll-area.tsx

@@ -2,54 +2,44 @@
 
 import * as React from 'react';
 
-import { cn } from '#lib/utils';
-import { ScrollArea as ScrollAreaPrimitive } from '@base-ui/react/scroll-area';
+import { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';
 
-function ScrollArea({
-  className,
-  children,
-  ...props
-}: ScrollAreaPrimitive.Root.Props) {
-  return (
-    <ScrollAreaPrimitive.Root
-      data-slot="scroll-area"
-      className={cn('relative', className)}
-      {...props}
-    >
-      <ScrollAreaPrimitive.Viewport
-        data-slot="scroll-area-viewport"
-        className="focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1"
-      >
-        {children}
-      </ScrollAreaPrimitive.Viewport>
-      <ScrollBar />
-      <ScrollAreaPrimitive.Corner />
-    </ScrollAreaPrimitive.Root>
-  );
-}
+import { cn } from '../lib/utils';
 
-function ScrollBar({
-  className,
-  orientation = 'vertical',
-  ...props
-}: ScrollAreaPrimitive.Scrollbar.Props) {
-  return (
-    <ScrollAreaPrimitive.Scrollbar
-      data-slot="scroll-area-scrollbar"
-      data-orientation={orientation}
-      orientation={orientation}
-      className={cn(
-        'flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent',
-        className,
-      )}
-      {...props}
-    >
-      <ScrollAreaPrimitive.Thumb
-        data-slot="scroll-area-thumb"
-        className="bg-border relative flex-1 rounded-full"
-      />
-    </ScrollAreaPrimitive.Scrollbar>
-  );
-}
+const ScrollArea: React.FC<
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
+> = ({ className, children, ...props }) => (
+  <ScrollAreaPrimitive.Root
+    className={cn('relative overflow-hidden', className)}
+    {...props}
+  >
+    <ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
+      {children}
+    </ScrollAreaPrimitive.Viewport>
+    <ScrollBar />
+    <ScrollAreaPrimitive.Corner />
+  </ScrollAreaPrimitive.Root>
+);
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+
+const ScrollBar: React.FC<
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
+> = ({ className, orientation = 'vertical', ...props }) => (
+  <ScrollAreaPrimitive.ScrollAreaScrollbar
+    orientation={orientation}
+    className={cn(
+      'flex touch-none transition-colors select-none',
+      orientation === 'vertical' &&
+        'h-full w-2.5 border-l border-l-transparent p-[1px]',
+      orientation === 'horizontal' &&
+        'h-2.5 border-t border-t-transparent p-[1px]',
+      className,
+    )}
+    {...props}
+  >
+    <ScrollAreaPrimitive.ScrollAreaThumb className="bg-border relative flex-1 rounded-full" />
+  </ScrollAreaPrimitive.ScrollAreaScrollbar>
+);
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 export { ScrollArea, ScrollBar };