0.5.33

netzo · May 19, 2024 · c077cd7 · c077cd7
1 parent 8a7b66f
commit c077cd7
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 50 deletions.
diff --git a/lib/cli/src/version.ts b/lib/cli/src/version.ts
@@ -1,5 +1,5 @@
 // latest version of netzo/cli (see https://github.com/netzo/netzo/releases)
-export const VERSION = "0.5.32";
+export const VERSION = "0.5.33";
 
 // minimum version of Deno required to run this CLI
 // (see https://github.com/denoland/deployctl/blob/main/src/version.ts)

diff --git a/lib/components/blocks/nav.tsx b/lib/components/blocks/nav.tsx
@@ -201,7 +201,9 @@ export function NavItem({ className, ...props }: NavItemProps) {
   );
 }
 
-export function NavItemUser(props: { state: NetzoState; showToggleDarkMode?: boolean }) {
+export function NavItemUser(
+  props: { state: NetzoState; showToggleDarkMode?: boolean },
+) {
   const { showToggleDarkMode = false } = props;
   const { auth } = props.state ?? {};
 
@@ -276,14 +278,14 @@ export function NavItemUser(props: { state: NetzoState; showToggleDarkMode?: boo
         )}
         {showToggleDarkMode && (
           <DropdownMenuItem>
-          <div className="flex gap-4 w-full items-center justify-between">
-            Dark mode
-            <Switch
-              checked={darkMode.value}
-              onCheckedChange={(value) => darkMode.value = value}
-            />
-          </div>
-        </DropdownMenuItem>
+            <div className="flex gap-4 w-full items-center justify-between">
+              Dark mode
+              <Switch
+                checked={darkMode.value}
+                onCheckedChange={(value) => darkMode.value = value}
+              />
+            </div>
+          </DropdownMenuItem>
         )}
         {auth?.sessionUser?.name && (
           <>

diff --git a/lib/components/blocks/table/table-pagination.tsx b/lib/components/blocks/table/table-pagination.tsx
@@ -19,7 +19,11 @@ export function TablePagination<TData>({
   const { pageIndex, pageSize, from, to, total } = useTablePagination(table);
   return (
     <div className="flex flex-wrap w-full gap-y-2 gap-x-8 items-center justify-between">
-      <TablePaginationPageRange table={table} locale={locale} className="flex-1" />
+      <TablePaginationPageRange
+        table={table}
+        locale={locale}
+        className="flex-1"
+      />
       <TablePaginationPageSize table={table} locale={locale} />
       <TablePaginationPageCurrent table={table} locale={locale} />
       <TablePaginationButtons table={table} locale={locale} />
@@ -91,7 +95,7 @@ export function TablePaginationPageCurrent<TData>({
 }: JSX.IntrinsicElements["div"] & Props<TData>) {
   const { pageIndex, pageSize, from, to, total } = useTablePagination(table);
   const text = locale === "en"
-   ? `Page ${pageIndex + 1} of ${table.getPageCount()}`
+    ? `Page ${pageIndex + 1} of ${table.getPageCount()}`
     : `Página ${pageIndex + 1} de ${table.getPageCount()}`;
   return (
     <div className={cn("contents h-[48px] min-w-fit !my-auto", className)}>
@@ -108,10 +112,18 @@ export function TablePaginationButtons<TData>({
   locale = "es",
 }: JSX.IntrinsicElements["div"] & Props<TData>) {
   const { pageIndex, pageSize, from, to, total } = useTablePagination(table);
-  const textFirst = locale === "en" ? "Go to first page" : "Ir a la primera página";
-  const textPrevious = locale === "en" ? "Go to previous page" : "Ir a la página anterior";
-  const textNext = locale === "en" ? "Go to next page" : "Ir a la página siguiente";
-  const textLast = locale === "en" ? "Go to last page" : "Ir a la última página";
+  const textFirst = locale === "en"
+    ? "Go to first page"
+    : "Ir a la primera página";
+  const textPrevious = locale === "en"
+    ? "Go to previous page"
+    : "Ir a la página anterior";
+  const textNext = locale === "en"
+    ? "Go to next page"
+    : "Ir a la página siguiente";
+  const textLast = locale === "en"
+    ? "Go to last page"
+    : "Ir a la última página";
   return (
     <div
       className={cn(

diff --git a/lib/components/blocks/table/table-view-options.tsx b/lib/components/blocks/table/table-view-options.tsx
@@ -3,7 +3,7 @@ import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
   DropdownMenuContent,
-  DropdownMenuTrigger
+  DropdownMenuTrigger,
 } from "../../dropdown-menu.tsx";
 import { cn } from "../../utils.ts";
 import type { Table } from "./table.tsx";
@@ -24,10 +24,12 @@ export function TableViewOptions<TData>({
         </Button>
       </DropdownMenuTrigger>
       <DropdownMenuContent align="end">
-        {/* <DropdownMenuLabel>
+        {
+          /* <DropdownMenuLabel>
           Toggle columns
         </DropdownMenuLabel>
-        <DropdownMenuSeparator /> */}
+        <DropdownMenuSeparator /> */
+        }
         {table
           .getAllColumns()
           .filter((column) => column.getCanHide())

diff --git a/lib/components/dialog.tsx b/lib/components/dialog.tsx
@@ -52,36 +52,6 @@ const DialogContent = React.forwardRef<
 ));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 
-// NOTE: this is a controlled variant of DialogContent to circumvent an open issue where
-// using Select, Combobox, etc. components will cause the Dialog to close on selection.
-// To work around this, this controlled vairnt expects an onClickClose event handler and
-// uses that instead of the default DialogPrimitive.Close component (by using it with asChild)
-const DialogContentControlled = React.forwardRef<
-  React.ElementRef<typeof DialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & { onClickClose: () => void }
->(({ className, onClickClose, children, ...props }, ref) => (
-  <DialogPortal>
-    <DialogOverlay />
-    <DialogPrimitive.Content
-      ref={ref}
-      className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-        className,
-      )}
-      {...props}
-    >
-      {children}
-      <DialogPrimitive.Close asChild 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 bg-transparent data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
-        <Button variant="ghost" size="icon" onClick={onClickClose}>
-          <i className="mdi-close h-4 w-4" />
-          <span className="sr-only">Close</span>
-        </Button>
-      </DialogPrimitive.Close>
-    </DialogPrimitive.Content>
-  </DialogPortal>
-));
-DialogContentControlled.displayName = DialogPrimitive.Content.displayName;
-
 const DialogHeader = ({
   className,
   ...props
@@ -141,7 +111,6 @@ export {
   Dialog,
   DialogClose,
   DialogContent,
-  DialogContentControlled,
   DialogDescription,
   DialogFooter,
   DialogHeader,
@@ -151,3 +120,42 @@ export {
   DialogTrigger
 };
 
+////////////////////////////////////////////////////////////////////////////////
+
+// NOTE: DialogControlled and DialogContentControlled are controlled variants
+// of DialogContent to circumvent an open issue where using Select, Combobox, etc.
+// components will cause the Dialog to close on selection. To work around this,
+// this controlled variant expects an open (Signal<boolean>) variable and uses that
+// instead of the default DialogPrimitive.Close component (by using it with asChild)
+
+const DialogContentControlled = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
+    onClickClosed: () => void;
+  }
+>(({ className, onClickClosed, children, ...props }, ref) => (
+  <DialogPortal>
+    <DialogOverlay />
+    <DialogPrimitive.Content
+      ref={ref}
+      className={cn(
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
+        className,
+      )}
+      {...props}
+    >
+      {children}
+      <DialogPrimitive.Close
+        asChild
+        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 bg-transparent data-[state=open]:bg-accent data-[state=open]:text-muted-foreground"
+      >
+        <Button variant="ghost" size="icon" onClick={onClickClosed}>
+          <i className="mdi-close h-4 w-4" />
+          <span className="sr-only">Close</span>
+        </Button>
+      </DialogPrimitive.Close>
+    </DialogPrimitive.Content>
+  </DialogPortal>
+));
+
+export { DialogContentControlled };