History

refactor(web): remove unused layout and menu components

Julius Marminge committed 2 months ago

Commit 00330cd1 parent 9d12bd78 files · +4 −238Browse files

Unified · Split

8 files
  1. apps/web/src/components/ui/autocomplete.tsx +0 −11
  2. apps/web/src/components/ui/badge.tsx +1 −1
  3. apps/web/src/components/ui/command.tsx +0 −30
  4. apps/web/src/components/ui/group.tsx +1 −26
  5. apps/web/src/components/ui/menu.tsx +0 −15
  6. apps/web/src/components/ui/scroll-area.tsx +1 −1
  7. apps/web/src/components/ui/sidebar.tsx +0 −133
  8. apps/web/src/components/ui/table.tsx +1 −21
apps/web/src/components/ui/autocomplete.tsx+0−11
@@ -136,16 +136,6 @@ function AutocompleteItem({ className, children, ...props }: AutocompletePrimiti · 135 unmodified lines
136136 );
137137 }
138138
139−function AutocompleteSeparator({ className, ...props }: AutocompletePrimitive.Separator.Props) {
140− return (
141− <AutocompletePrimitive.Separator
142− className={cn("mx-2 my-1 h-px bg-border last:hidden", className)}
143− data-slot="autocomplete-separator"
144− {...props}
145− />
146− );
147−}
148−
149139 function AutocompleteGroup({ className, ...props }: AutocompletePrimitive.Group.Props) {
150140 return (
151141 <AutocompletePrimitive.Group
@@ -231,7 +221,6 @@ export { · 79 unmodified lines
231221 AutocompleteInput,
232222 AutocompletePopup,
233223 AutocompleteItem,
234− AutocompleteSeparator,
235224 AutocompleteGroup,
236225 AutocompleteGroupLabel,
237226 AutocompleteEmpty,
apps/web/src/components/ui/badge.tsx+1−1
@@ -57,4 +57,4 @@ function Badge({ className, variant, size, render, ...props }: BadgeProps) { · 56 unmodified lines
5757 });
5858 }
5959
60−export { Badge, badgeVariants };
60+export { Badge };
apps/web/src/components/ui/command.tsx+0−30
@@ -7,13 +7,11 @@ import { cn } from "~/lib/utils"; · 6 unmodified lines
77 import {
88 Autocomplete,
99 AutocompleteCollection,
10− AutocompleteEmpty,
1110 AutocompleteGroup,
1211 AutocompleteGroupLabel,
1312 AutocompleteInput,
1413 AutocompleteItem,
1514 AutocompleteList,
16− AutocompleteSeparator,
1715 } from "~/components/ui/autocomplete";
1816 import { DIALOG_BACKDROP_CLASS, DIALOG_POPUP_CLASS } from "~/components/ui/dialog-styles";
1917 import { Button } from "~/components/ui/button";
@@ -22,8 +20,6 @@ const CommandDialog = CommandDialogPrimitive.Root; · 2 unmodified lines
2220
2321 const CommandDialogPortal = CommandDialogPrimitive.Portal;
2422
25−const CommandCreateHandle = CommandDialogPrimitive.createHandle;
26−
2723 function CommandDialogTrigger(props: CommandDialogPrimitive.Trigger.Props) {
2824 return <CommandDialogPrimitive.Trigger data-slot="command-dialog-trigger" {...props} />;
2925 }
@@ -135,16 +131,6 @@ function CommandList({ className, ...props }: React.ComponentProps<typeof Autoco · 105 unmodified lines
135131 );
136132 }
137133
138−function CommandEmpty({ className, ...props }: React.ComponentProps<typeof AutocompleteEmpty>) {
139− return (
140− <AutocompleteEmpty
141− className={cn("not-empty:py-6", className)}
142− data-slot="command-empty"
143− {...props}
144− />
145− );
146−}
147−
148134 function CommandPanel({ className, ...props }: React.ComponentProps<"div">) {
149135 return (
150136 <div
@@ -187,19 +173,6 @@ function CommandItem({ className, ...props }: React.ComponentProps<typeof Autoco · 36 unmodified lines
187173 );
188174 }
189175
190−function CommandSeparator({
191− className,
192− ...props
193−}: React.ComponentProps<typeof AutocompleteSeparator>) {
194− return (
195− <AutocompleteSeparator
196− className={cn("my-2", className)}
197− data-slot="command-separator"
198− {...props}
199− />
200− );
201−}
202−
203176 function CommandShortcut({ className, ...props }: React.ComponentProps<"kbd">) {
204177 return (
205178 <kbd
@@ -241,13 +214,11 @@ function CommandFooterAction({ · 35 unmodified lines
241214 }
242215
243216 export {
244− CommandCreateHandle,
245217 Command,
246218 CommandCollection,
247219 CommandDialog,
248220 CommandDialogPopup,
249221 CommandDialogTrigger,
250− CommandEmpty,
251222 CommandFooter,
252223 CommandFooterAction,
253224 CommandGroup,
@@ -256,6 +227,5 @@ export { · 2 unmodified lines
256227 CommandItem,
257228 CommandList,
258229 CommandPanel,
259− CommandSeparator,
260230 CommandShortcut,
261231 };
apps/web/src/components/ui/group.tsx+1−26
@@ -1,7 +1,5 @@
11 "use client";
22
3−import { mergeProps } from "@base-ui/react/merge-props";
4−import { useRender } from "@base-ui/react/use-render";
53 import { cva, type VariantProps } from "class-variance-authority";
64 import type * as React from "react";
75
@@ -48,21 +46,6 @@ function Group({ · 40 unmodified lines
4846 );
4947 }
5048
51−function GroupText({ className, render, ...props }: useRender.ComponentProps<"div">) {
52− const defaultProps = {
53− className: cn(
54− "relative inline-flex items-center whitespace-nowrap gap-2 rounded-lg border border-input bg-muted not-dark:bg-clip-padding px-[calc(--spacing(3)-1px)] text-muted-foreground text-base sm:text-sm shadow-xs/5 outline-none transition-shadow before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] before:shadow-[0_1px_--theme(--color-black/6%)] dark:bg-input/64 dark:before:shadow-[0_-1px_--theme(--color-white/6%)] [&_svg:not([class*='size-'])]:size-4.5 sm:[&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 [&_svg]:-mx-0.5",
55− className,
56− ),
57− "data-slot": "group-text",
58− };
59− return useRender({
60− defaultTagName: "div",
61− props: mergeProps(defaultProps, props),
62− render,
63− });
64−}
65−
6649 function GroupSeparator({
6750 className,
6851 orientation = "vertical",
@@ -82,12 +65,4 @@ function GroupSeparator({ · 13 unmodified lines
8265 );
8366 }
8467
85−export {
86− Group,
87− Group as ButtonGroup,
88− GroupText,
89− GroupText as ButtonGroupText,
90− GroupSeparator,
91− GroupSeparator as ButtonGroupSeparator,
92− groupVariants,
93−};
68+export { Group, GroupSeparator };
apps/web/src/components/ui/menu.tsx+0−15
@@ -6,12 +6,8 @@ import type * as React from "react"; · 5 unmodified lines
66
77 import { cn } from "~/lib/utils";
88
9−const MenuCreateHandle = MenuPrimitive.createHandle;
10−
119 const Menu = MenuPrimitive.Root;
1210
13−const MenuPortal = MenuPrimitive.Portal;
14−
1511 function MenuTrigger({ className, children, ...props }: MenuPrimitive.Trigger.Props) {
1612 return (
1713 <MenuPrimitive.Trigger className={className} data-slot="menu-trigger" {...props}>
@@ -297,33 +293,22 @@ function MenuSubPopup({ · 279 unmodified lines
297293 }
298294
299295 export {
300− MenuCreateHandle,
301− MenuCreateHandle as DropdownMenuCreateHandle,
302296 Menu,
303297 Menu as DropdownMenu,
304− MenuPortal,
305− MenuPortal as DropdownMenuPortal,
306298 MenuTrigger,
307299 MenuTrigger as DropdownMenuTrigger,
308300 MenuPopup,
309301 MenuPopup as DropdownMenuContent,
310302 MenuGroup,
311− MenuGroup as DropdownMenuGroup,
312303 MenuItem,
313304 MenuItem as DropdownMenuItem,
314305 MenuCheckboxItem,
315− MenuCheckboxItem as DropdownMenuCheckboxItem,
316306 MenuRadioGroup,
317− MenuRadioGroup as DropdownMenuRadioGroup,
318307 MenuRadioItem,
319− MenuRadioItem as DropdownMenuRadioItem,
320308 MenuRadioItemIndicator,
321309 MenuGroupLabel,
322− MenuGroupLabel as DropdownMenuLabel,
323310 MenuSeparator,
324− MenuSeparator as DropdownMenuSeparator,
325311 MenuShortcut,
326− MenuShortcut as DropdownMenuShortcut,
327312 MenuSub,
328313 MenuSub as DropdownMenuSub,
329314 MenuSubTrigger,
apps/web/src/components/ui/scroll-area.tsx+1−1
@@ -88,4 +88,4 @@ function ScrollBar({ · 87 unmodified lines
8888 );
8989 }
9090
91−export { getVirtualizedScrollFadeClassName, ScrollArea, ScrollBar };
91+export { getVirtualizedScrollFadeClassName, ScrollArea };
apps/web/src/components/ui/sidebar.tsx+0−133
@@ -5,9 +5,7 @@ import { PanelLeftCloseIcon, PanelLeftIcon } from "lucide-react"; · 4 unmodified lines
55 import * as React from "react";
66 import { cn } from "~/lib/utils";
77 import { Button } from "~/components/ui/button";
8−import { Input } from "~/components/ui/input";
98 import { ScrollArea } from "~/components/ui/scroll-area";
10−import { Separator } from "~/components/ui/separator";
119 import {
1210 Sheet,
1311 SheetDescription,
@@ -15,7 +13,6 @@ import { · 1 unmodified line
1513 SheetPopup,
1614 SheetTitle,
1715 } from "~/components/ui/sheet";
18−import { Skeleton } from "~/components/ui/skeleton";
1916 import { Tooltip, TooltipPopup, TooltipTrigger } from "~/components/ui/tooltip";
2017 import { useIsMobile } from "~/hooks/useMediaQuery";
2118 import { getLocalStorageItem, setLocalStorageItem } from "~/hooks/useLocalStorage";
@@ -645,17 +642,6 @@ function SidebarInset({ className, ...props }: React.ComponentProps<"main">) { · 623 unmodified lines
645642 );
646643 }
647644
648−function SidebarInput({ className, ...props }: React.ComponentProps<typeof Input>) {
649− return (
650− <Input
651− className={cn("h-8 w-full bg-background shadow-none", className)}
652− data-sidebar="input"
653− data-slot="sidebar-input"
654− {...props}
655− />
656− );
657−}
658−
659645 function SidebarHeader({ className, ...props }: React.ComponentProps<"div">) {
660646 return (
661647 <div
@@ -678,17 +664,6 @@ function SidebarFooter({ className, ...props }: React.ComponentProps<"div">) { · 16 unmodified lines
678664 );
679665 }
680666
681−function SidebarSeparator({ className, ...props }: React.ComponentProps<typeof Separator>) {
682− return (
683− <Separator
684− className={cn("mx-2 w-auto! bg-sidebar-border", className)}
685− data-sidebar="separator"
686− data-slot="sidebar-separator"
687− {...props}
688− />
689− );
690−}
691−
692667 function SidebarContent({
693668 className,
694669 fixedHeader,
@@ -728,55 +703,6 @@ function SidebarGroup({ className, ...props }: React.ComponentProps<"div">) { · 33 unmodified lines
728703 );
729704 }
730705
731−function SidebarGroupLabel({ className, render, ...props }: useRender.ComponentProps<"div">) {
732− const defaultProps = {
733− className: cn(
734− "flex h-8 shrink-0 items-center rounded-lg px-2 font-medium text-sidebar-foreground text-xs outline-hidden ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
735− "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
736− className,
737− ),
738− "data-sidebar": "group-label",
739− "data-slot": "sidebar-group-label",
740− };
741−
742− return useRender({
743− defaultTagName: "div",
744− props: mergeProps(defaultProps, props),
745− render,
746− });
747−}
748−
749−function SidebarGroupAction({ className, render, ...props }: useRender.ComponentProps<"button">) {
750− const defaultProps = {
751− className: cn(
752− "absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-lg p-0 text-sidebar-foreground outline-hidden ring-ring transition-transform hover:bg-sidebar-row-hover hover:text-sidebar-foreground focus-visible:ring-2 [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0",
753− // Increases the hit area of the button on mobile.
754− "after:-inset-2 after:absolute md:after:hidden",
755− "group-data-[collapsible=icon]:hidden",
756− className,
757− ),
758− "data-sidebar": "group-action",
759− "data-slot": "sidebar-group-action",
760− };
761−
762− return useRender({
763− defaultTagName: "button",
764− props: mergeProps(defaultProps, props),
765− render,
766− });
767−}
768−
769−function SidebarGroupContent({ className, ...props }: React.ComponentProps<"div">) {
770− return (
771− <div
772− className={cn("w-full text-sm", className)}
773− data-sidebar="group-content"
774− data-slot="sidebar-group-content"
775− {...props}
776− />
777− );
778−}
779−
780706 function SidebarMenu({ className, ...props }: React.ComponentProps<"ul">) {
781707 return (
782708 <ul
@@ -875,58 +801,6 @@ function SidebarMenuButton({ · 92 unmodified lines
875801 );
876802 }
877803
878−function SidebarMenuBadge({ className, ...props }: React.ComponentProps<"div">) {
879− return (
880− <div
881− className={cn(
882− "pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-lg px-1 font-medium text-sidebar-foreground text-xs tabular-nums",
883− "peer-hover/menu-button:text-sidebar-foreground peer-data-[active=true]/menu-button:text-sidebar-foreground",
884− "peer-data-[size=sm]/menu-button:top-1",
885− "peer-data-[size=default]/menu-button:top-1.5",
886− "peer-data-[size=lg]/menu-button:top-2.5",
887− "group-data-[collapsible=icon]:hidden",
888− className,
889− )}
890− data-sidebar="menu-badge"
891− data-slot="sidebar-menu-badge"
892− {...props}
893− />
894− );
895−}
896−
897−function SidebarMenuSkeleton({
898− className,
899− showIcon = false,
900− ...props
901−}: React.ComponentProps<"div"> & {
902− showIcon?: boolean;
903−}) {
904− // Random width between 50 to 90%. Intentionally wrapped in useMemo to avoid changing width on every render.
905− const width = React.useMemo(() => {
906− return `${Math.floor(Math.random() * 40) + 50}%`;
907− }, []);
908−
909− return (
910− <div
911− className={cn("flex h-8 items-center gap-2 rounded-lg px-2", className)}
912− data-sidebar="menu-skeleton"
913− data-slot="sidebar-menu-skeleton"
914− {...props}
915− >
916− {showIcon && <Skeleton className="size-4 rounded-lg" data-sidebar="menu-skeleton-icon" />}
917− <Skeleton
918− className="h-4 max-w-(--skeleton-width) flex-1"
919− data-sidebar="menu-skeleton-text"
920− style={
921− {
922− "--skeleton-width": width,
923− } as React.CSSProperties
924− }
925− />
926− </div>
927− );
928−}
929−
930804 function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">) {
931805 return (
932806 <ul
@@ -990,23 +864,16 @@ export { · 57 unmodified lines
990864 SidebarContent,
991865 SidebarFooter,
992866 SidebarGroup,
993− SidebarGroupAction,
994− SidebarGroupContent,
995− SidebarGroupLabel,
996867 SidebarHeader,
997− SidebarInput,
998868 SidebarInset,
999869 SidebarMenu,
1000− SidebarMenuBadge,
1001870 SidebarMenuButton,
1002871 SidebarMenuItem,
1003− SidebarMenuSkeleton,
1004872 SidebarMenuSub,
1005873 SidebarMenuSubButton,
1006874 SidebarMenuSubItem,
1007875 SidebarProvider,
1008876 SidebarRail,
1009− SidebarSeparator,
1010877 SidebarTrigger,
1011878 useSidebar,
1012879 useSidebarVisibility,
apps/web/src/components/ui/table.tsx+1−21
@@ -28,16 +28,6 @@ function TableBody({ className, ...props }: React.ComponentProps<"tbody">) { · 27 unmodified lines
2828 );
2929 }
3030
31−function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
32− return (
33− <tfoot
34− data-slot="table-footer"
35− className={cn("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", className)}
36− {...props}
37− />
38− );
39−}
40−
4131 function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
4232 return (
4333 <tr
@@ -74,14 +64,4 @@ function TableCell({ className, ...props }: React.ComponentProps<"td">) { · 30 unmodified lines
7464 );
7565 }
7666
77−function TableCaption({ className, ...props }: React.ComponentProps<"caption">) {
78− return (
79− <caption
80− data-slot="table-caption"
81− className={cn("mt-4 text-xs text-muted-foreground", className)}
82− {...props}
83− />
84− );
85−}
86−
87−export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };
67+export { Table, TableHeader, TableBody, TableHead, TableRow, TableCell };