authorgravatar for julius0216@outlook.comJulius Marminge <julius0216@outlook.com> 2026-09-05 01:25:15-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-09-05 01:25:15-07:00
log5a4287cd63aefef93c0fd15fe79f63a2f2657211
tree0d3b082a2dda46b929fa76c8eeed33cbc4becf86
parent5e828bf3de1c86d85afdd91a02cc4ca1a38d4aef
signature Signed by PGP key B5690EEEBB952194

refactor(web): remove unused sidebar menu action (#10044)

2 files changed, 1 insertions(+), 46 deletions(-)

apps/web/src/components/ui/sidebar.test.tsx-12
......@@ -2,7 +2,6 @@ import { renderToStaticMarkup } from "react-dom/server";
22import { describe, expect, it } from "vite-plus/test";
33
44import {
5 SidebarMenuAction,
65 SidebarMenuButton,
76 SidebarMenuSubButton,
87 SidebarProvider,
......@@ -89,17 +88,6 @@ describe("sidebar interactive cursors", () => {
8988 expect(html).not.toContain("cursor-pointer");
9089 });
9190
92 it("uses a pointer cursor for menu actions", () => {
93 const html = renderToStaticMarkup(
94 <SidebarMenuAction aria-label="Create thread">
95 <span>+</span>
96 </SidebarMenuAction>,
97 );
98
99 expect(html).toContain('data-slot="sidebar-menu-action"');
100 expect(html).toContain("cursor-pointer");
101 });
102
10391 it("uses a pointer cursor for submenu buttons", () => {
10492 const html = renderToStaticMarkup(
10593 <SidebarMenuSubButton render={<button type="button" />}>Show more</SidebarMenuSubButton>,
apps/web/src/components/ui/sidebar.tsx+1-34
......@@ -800,7 +800,7 @@ function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">) {
800800}
801801
802802const sidebarMenuButtonVariants = cva(
803 "peer/menu-button flex w-full cursor-pointer items-center gap-[var(--sidebar-control-gap)] overflow-hidden text-left outline-hidden ring-ring transition-[width,height,padding] hover:bg-sidebar-row-hover hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-row-active active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pe-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-row-selected data-[active=true]:font-medium data-[active=true]:text-sidebar-foreground data-[state=open]:hover:bg-sidebar-row-hover data-[state=open]:hover:text-sidebar-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-[var(--sidebar-content-inset)]! [&>span:last-child]:truncate [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0 [&>svg]:text-[var(--sidebar-icon-color)] hover:[&>svg]:text-sidebar-foreground active:[&>svg]:text-sidebar-foreground data-[active=true]:[&>svg]:text-sidebar-foreground",
803 "peer/menu-button flex w-full cursor-pointer items-center gap-[var(--sidebar-control-gap)] overflow-hidden text-left outline-hidden ring-ring transition-[width,height,padding] hover:bg-sidebar-row-hover hover:text-sidebar-foreground focus-visible:ring-2 active:bg-sidebar-row-active active:text-sidebar-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-row-selected data-[active=true]:font-medium data-[active=true]:text-sidebar-foreground data-[state=open]:hover:bg-sidebar-row-hover data-[state=open]:hover:text-sidebar-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-[var(--sidebar-content-inset)]! [&>span:last-child]:truncate [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0 [&>svg]:text-[var(--sidebar-icon-color)] hover:[&>svg]:text-sidebar-foreground active:[&>svg]:text-sidebar-foreground data-[active=true]:[&>svg]:text-sidebar-foreground",
804804 {
805805 defaultVariants: {
806806 size: "default",
......@@ -875,38 +875,6 @@ function SidebarMenuButton({
875875 );
876876}
877877
878function SidebarMenuAction({
879 className,
880 showOnHover = false,
881 render,
882 ...props
883}: useRender.ComponentProps<"button"> & {
884 showOnHover?: boolean;
885}) {
886 const defaultProps = {
887 className: cn(
888 "absolute top-1.5 right-1 flex aspect-square w-5 cursor-pointer 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 peer-hover/menu-button:text-sidebar-foreground [&>svg:not([class*='size-'])]:size-4 [&>svg]:shrink-0",
889 // Increases the hit area of the button on mobile.
890 "after:-inset-2 after:absolute md:after:hidden",
891 "peer-data-[size=sm]/menu-button:top-1",
892 "peer-data-[size=default]/menu-button:top-1.5",
893 "peer-data-[size=lg]/menu-button:top-2.5",
894 "group-data-[collapsible=icon]:hidden",
895 showOnHover &&
896 "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-foreground md:opacity-0",
897 className,
898 ),
899 "data-sidebar": "menu-action",
900 "data-slot": "sidebar-menu-action",
901 };
902
903 return useRender({
904 defaultTagName: "button",
905 props: mergeProps<"button">(defaultProps, props),
906 render,
907 });
908}
909
910878function SidebarMenuBadge({ className, ...props }: React.ComponentProps<"div">) {
911879 return (
912880 <div
......@@ -1029,7 +997,6 @@ export {
1029997 SidebarInput,
1030998 SidebarInset,
1031999 SidebarMenu,
1032 SidebarMenuAction,
10331000 SidebarMenuBadge,
10341001 SidebarMenuButton,
10351002 SidebarMenuItem,