fix: add showClose prop to SheetContent and SheetBetter components for conditional close button rendering

components/list/ListUI.tsx

@@ -51,11 +51,15 @@ export const ListUI: React.FC<any> = ({
     <div className="flex flex-col flex-grow  rounded-lg border border-gray-200 py-2 overflow-hidden">
       <div className="flex flex-col flex-grow">
         <div className="flex flex-col  flex-grow">
-          <div className="flex flex-col w-full px-4 pt-2">
+          {title ? (
-            {typeof title === "function"
+            <div className="flex flex-col w-full px-4 pt-2">
-              ? title({ ui: local, count: local.count })
+              {typeof title === "function"
-              : title}
+                ? title({ ui: local, count: local.count })
-          </div>
+                : title}
+            </div>
+          ) : (
+            <></>
+          )}
 
           <div className="w-full flex flex-row flex-grow  overflow-hidden ">
             <ListBetter

components/ui/sheet.tsx

@@ -51,27 +51,36 @@ const sheetVariants = cva(
 
 interface SheetContentProps
   extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
-    VariantProps<typeof sheetVariants> {}
+    VariantProps<typeof sheetVariants> {
+  showClose?: boolean;
+}
 
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
   SheetContentProps
->(({ side = "right", className, children, ...props }, ref) => (
+>(
-  <SheetPortal>
+  (
-    <SheetOverlay />
+    { side = "right", showClose = true, className, children, ...props },
-    <SheetPrimitive.Content
+    ref
-      ref={ref}
+  ) => (
-      className={cn(sheetVariants({ side }), className)}
+    <SheetPortal>
-      {...props}
+      <SheetOverlay />
-    >
+      <SheetPrimitive.Content
-      <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
+        ref={ref}
-        <X className="h-4 w-4" />
+        className={cn(sheetVariants({ side }), className)}
-        <span className="sr-only">Close</span>
+        {...props}
-      </SheetPrimitive.Close>
+      >
-      {children}
+        {showClose && ( // Hanya render tombol close jika showClose true
-    </SheetPrimitive.Content>
+          <SheetPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
-  </SheetPortal>
+            <X className="h-4 w-4" />
-));
+            <span className="sr-only">Close</span>
+          </SheetPrimitive.Close>
+        )}
+        {children}
+      </SheetPrimitive.Content>
+    </SheetPortal>
+  )
+);
 SheetContent.displayName = SheetPrimitive.Content.displayName;
 
 const SheetHeader = ({
@@ -126,23 +135,47 @@ const SheetDescription = React.forwardRef<
 ));
 export interface SheetBetterProps {
   open?: boolean;
+  contentOpen?: any;
+  onOpenChange?: (open: boolean) => void;
+  showClose?: boolean;
+  side?: "top" | "bottom" | "left" | "right";
 }
 
 const SheetBetter = ({
   className,
+  open,
+  contentOpen,
+  showClose = true,
+  side = "right",
+  onOpenChange,
+  children,
   ...props
 }: SheetBetterProps & React.HTMLAttributes<HTMLDivElement>) => {
+  const [isOpen, setOpen] = React.useState(false as boolean);
   return (
-    <Sheet>
+    <Sheet
-      <SheetTrigger>Open</SheetTrigger>
+      open={typeof open === "boolean" ? open : isOpen}
-      <SheetContent className="w-screen md:w-auto">
+      onOpenChange={(event) => {
-        <SheetHeader>
+        setOpen(event);
+        if (typeof onOpenChange === "function") {
+          onOpenChange(event);
+        }
+      }}
+    >
+      <SheetTrigger onClick={() => setOpen(true)}>{contentOpen}</SheetTrigger>
+      <SheetContent
+        className={cn("w-screen md:w-auto", className)}
+        showClose={showClose}
+        side={side}
+      >
+        <SheetHeader className="hidden">
           <SheetTitle>Are you absolutely sure?</SheetTitle>
           <SheetDescription>
             This action cannot be undone. This will permanently delete your
             account and remove your data from our servers.
           </SheetDescription>
         </SheetHeader>
+        {children}
       </SheetContent>
     </Sheet>
   );