GUI: increase prettier print width (#26)

lucasavila00 · Mar 21, 2024 · 63ed3e3 · 63ed3e3
1 parent 4f91a7f
commit 63ed3e3
Show file tree

Hide file tree

Showing 49 changed files with 149 additions and 507 deletions.
diff --git a/gui/.eslintrc.cjs b/gui/.eslintrc.cjs
@@ -11,10 +11,7 @@ module.exports = {
   parser: "@typescript-eslint/parser",
   plugins: ["react-refresh"],
   rules: {
-    "react-refresh/only-export-components": [
-      "warn",
-      { allowConstantExport: true },
-    ],
+    "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
     "@typescript-eslint/no-unused-vars": "off",
     "no-console": "error",
   },

diff --git a/gui/.prettierrc.json b/gui/.prettierrc.json
@@ -1,3 +1,4 @@
 {
-  "trailingComma": "all"
+  "trailingComma": "all",
+  "printWidth": 100
 }
diff --git a/gui/src/components/ui/Dropdown/Dropdown.tsx b/gui/src/components/ui/Dropdown/Dropdown.tsx
@@ -1,10 +1,6 @@
 import { cn } from "../../../lib/utils";
 
-export const DropdownCategoryTitle = ({
-  children,
-}: {
-  children: React.ReactNode;
-}) => {
+export const DropdownCategoryTitle = ({ children }: { children: React.ReactNode }) => {
   return (
     <div className="text-[.65rem] font-semibold mb-1 uppercase text-neutral-500 dark:text-neutral-400 px-1.5">
       {children}

diff --git a/gui/src/components/ui/Icon.tsx b/gui/src/components/ui/Icon.tsx
@@ -15,12 +15,7 @@ export const Icon = memo(({ name, className, strokeWidth }: IconProps) => {
     return null;
   }
 
-  return (
-    <IconComponent
-      className={cn("w-4 h-4", className)}
-      strokeWidth={strokeWidth || 2.5}
-    />
-  );
+  return <IconComponent className={cn("w-4 h-4", className)} strokeWidth={strokeWidth || 2.5} />;
 });
 
 Icon.displayName = "Icon";
diff --git a/gui/src/components/ui/Surface.tsx b/gui/src/components/ui/Surface.tsx
@@ -7,10 +7,7 @@ export type SurfaceProps = HTMLProps<HTMLDivElement> & {
 };
 
 export const Surface = forwardRef<HTMLDivElement, SurfaceProps>(
-  (
-    { children, className, withShadow = true, withBorder = true, ...props },
-    ref,
-  ) => {
+  ({ children, className, withShadow = true, withBorder = true, ...props }, ref) => {
     const surfaceClass = cn(
       className,
       "bg-white rounded-lg dark:bg-black",

diff --git a/gui/src/components/ui/Toolbar.tsx b/gui/src/components/ui/Toolbar.tsx
@@ -10,16 +10,7 @@ export type ToolbarWrapperProps = {
 } & HTMLProps<HTMLDivElement>;
 
 export const ToolbarWrapper = forwardRef<HTMLDivElement, ToolbarWrapperProps>(
-  (
-    {
-      shouldShowContent = true,
-      children,
-      isVertical = false,
-      className,
-      ...rest
-    },
-    ref,
-  ) => {
+  ({ shouldShowContent = true, children, isVertical = false, className, ...rest }, ref) => {
     const toolbarClassName = cn(
       "text-black inline-flex h-full leading-none gap-0.5",
       isVertical ? "flex-col p-2" : "flex-row p-1 items-center",
@@ -56,12 +47,7 @@ export const ToolbarDivider = forwardRef<HTMLDivElement, ToolbarDividerProps>(
   },
 );
 
-type ButtonVariant =
-  | "primary"
-  | "secondary"
-  | "tertiary"
-  | "quaternary"
-  | "ghost";
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "quaternary" | "ghost";
 type ButtonSize = "medium" | "small" | "icon" | "iconSmall";
 
 type ButtonProps = {
@@ -137,12 +123,7 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
     );
 
     return (
-      <button
-        ref={ref}
-        disabled={disabled}
-        className={buttonClassName}
-        {...rest}
-      >
+      <button ref={ref} disabled={disabled} className={buttonClassName} {...rest}>
         {children}
       </button>
     );

diff --git a/gui/src/components/ui/Tooltip/index.tsx b/gui/src/components/ui/Tooltip/index.tsx
@@ -4,9 +4,7 @@ import { useCallback } from "react";
 import { TippyProps, TooltipProps } from "./types";
 
 const isMac =
-  typeof window !== "undefined"
-    ? navigator.platform.toUpperCase().indexOf("MAC") >= 0
-    : false;
+  typeof window !== "undefined" ? navigator.platform.toUpperCase().indexOf("MAC") >= 0 : false;
 
 const ShortcutKey = ({ children }: { children: string }): JSX.Element => {
   const className =
@@ -43,9 +41,7 @@ export const Tooltip = ({
         data-reference-hidden={attrs["data-reference-hidden"]}
         data-escaped={attrs["data-escaped"]}
       >
-        {title && (
-          <span className="text-xs font-medium text-neutral-500">{title}</span>
-        )}
+        {title && <span className="text-xs font-medium text-neutral-500">{title}</span>}
         {shortcut && (
           <span className="flex items-center gap-0.5">
             {shortcut.map((shortcutKey) => (

diff --git a/gui/src/components/ui/avatar.tsx b/gui/src/components/ui/avatar.tsx
@@ -9,10 +9,7 @@ const Avatar = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AvatarPrimitive.Root
     ref={ref}
-    className={cn(
-      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
-      className,
-    )}
+    className={cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className)}
     {...props}
   />
 ));

diff --git a/gui/src/components/ui/button.tsx b/gui/src/components/ui/button.tsx
@@ -9,14 +9,11 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
-        default:
-          "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-        destructive:
-          "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
         outline:
           "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-        secondary:
-          "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
       },
@@ -44,11 +41,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return (
-      <Comp
-        className={cn(buttonVariants({ variant, size, className }))}
-        ref={ref}
-        {...props}
-      />
+      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
     );
   },
 );

diff --git a/gui/src/components/ui/dialog.tsx b/gui/src/components/ui/dialog.tsx
@@ -50,29 +50,14 @@ const DialogContent = React.forwardRef<
 ));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
 
-const DialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
-      className,
-    )}
-    {...props}
-  />
+const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+  <div className={cn("flex flex-col space-y-1.5 text-center sm:text-left", className)} {...props} />
 );
 DialogHeader.displayName = "DialogHeader";
 
-const DialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
+const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className,
-    )}
+    className={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
     {...props}
   />
 );
@@ -84,10 +69,7 @@ const DialogTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Title
     ref={ref}
-    className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className,
-    )}
+    className={cn("text-lg font-semibold leading-none tracking-tight", className)}
     {...props}
   />
 ));

diff --git a/gui/src/components/ui/dropdown-menu.tsx b/gui/src/components/ui/dropdown-menu.tsx
@@ -34,8 +34,7 @@ const DropdownMenuSubTrigger = React.forwardRef<
     <ChevronRight className="ml-auto h-4 w-4" />
   </DropdownMenuPrimitive.SubTrigger>
 ));
-DropdownMenuSubTrigger.displayName =
-  DropdownMenuPrimitive.SubTrigger.displayName;
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
 
 const DropdownMenuSubContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
@@ -50,8 +49,7 @@ const DropdownMenuSubContent = React.forwardRef<
     {...props}
   />
 ));
-DropdownMenuSubContent.displayName =
-  DropdownMenuPrimitive.SubContent.displayName;
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
 
 const DropdownMenuContent = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
@@ -110,8 +108,7 @@ const DropdownMenuCheckboxItem = React.forwardRef<
     {children}
   </DropdownMenuPrimitive.CheckboxItem>
 ));
-DropdownMenuCheckboxItem.displayName =
-  DropdownMenuPrimitive.CheckboxItem.displayName;
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
 
 const DropdownMenuRadioItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
@@ -143,11 +140,7 @@ const DropdownMenuLabel = React.forwardRef<
 >(({ className, inset, ...props }, ref) => (
   <DropdownMenuPrimitive.Label
     ref={ref}
-    className={cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className,
-    )}
+    className={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
     {...props}
   />
 ));
@@ -165,15 +158,9 @@ const DropdownMenuSeparator = React.forwardRef<
 ));
 DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
 
-const DropdownMenuShortcut = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLSpanElement>) => {
+const DropdownMenuShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {
   return (
-    <span
-      className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
-      {...props}
-    />
+    <span className={cn("ml-auto text-xs tracking-widest opacity-60", className)} {...props} />
   );
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";

diff --git a/gui/src/components/ui/form.tsx b/gui/src/components/ui/form.tsx
@@ -22,9 +22,7 @@ type FormFieldContextValue<
   name: TName;
 };
 
-const FormFieldContext = React.createContext<FormFieldContextValue>(
-  {} as FormFieldContextValue,
-);
+const FormFieldContext = React.createContext<FormFieldContextValue>({} as FormFieldContextValue);
 
 const FormField = <
   TFieldValues extends FieldValues = FieldValues,
@@ -66,22 +64,19 @@ type FormItemContextValue = {
   id: string;
 };
 
-const FormItemContext = React.createContext<FormItemContextValue>(
-  {} as FormItemContextValue,
-);
+const FormItemContext = React.createContext<FormItemContextValue>({} as FormItemContextValue);
 
-const FormItem = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement>
->(({ className, ...props }, ref) => {
-  const id = React.useId();
+const FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => {
+    const id = React.useId();
 
-  return (
-    <FormItemContext.Provider value={{ id }}>
-      <div ref={ref} className={cn("space-y-2", className)} {...props} />
-    </FormItemContext.Provider>
-  );
-});
+    return (
+      <FormItemContext.Provider value={{ id }}>
+        <div ref={ref} className={cn("space-y-2", className)} {...props} />
+      </FormItemContext.Provider>
+    );
+  },
+);
 FormItem.displayName = "FormItem";
 
 const FormLabel = React.forwardRef<
@@ -105,18 +100,13 @@ const FormControl = React.forwardRef<
   React.ElementRef<typeof Slot>,
   React.ComponentPropsWithoutRef<typeof Slot>
 >(({ ...props }, ref) => {
-  const { error, formItemId, formDescriptionId, formMessageId } =
-    useFormField();
+  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
 
   return (
     <Slot
       ref={ref}
       id={formItemId}
-      aria-describedby={
-        !error
-          ? `${formDescriptionId}`
-          : `${formDescriptionId} ${formMessageId}`
-      }
+      aria-describedby={!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`}
       aria-invalid={!!error}
       {...props}
     />
@@ -129,11 +119,7 @@ const UnconnectedFormDescription = React.forwardRef<
   React.HTMLAttributes<HTMLParagraphElement>
 >(({ className, ...props }, ref) => {
   return (
-    <p
-      ref={ref}
-      className={cn("text-[0.8rem] text-muted-foreground", className)}
-      {...props}
-    />
+    <p ref={ref} className={cn("text-[0.8rem] text-muted-foreground", className)} {...props} />
   );
 });
 
@@ -143,9 +129,7 @@ const FormDescription = React.forwardRef<
 >(({ className, ...props }, ref) => {
   const { formDescriptionId } = useFormField();
 
-  return (
-    <UnconnectedFormDescription ref={ref} id={formDescriptionId} {...props} />
-  );
+  return <UnconnectedFormDescription ref={ref} id={formDescriptionId} {...props} />;
 });
 FormDescription.displayName = "FormDescription";
 

diff --git a/gui/src/components/ui/input.tsx b/gui/src/components/ui/input.tsx
@@ -2,8 +2,7 @@ import * as React from "react";
 
 import { cn } from "../../lib/utils";
 
-export interface InputProps
-  extends React.InputHTMLAttributes<HTMLInputElement> {}
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
 
 const Input = React.forwardRef<HTMLInputElement, InputProps>(
   ({ className, type, ...props }, ref) => {

diff --git a/gui/src/components/ui/label.tsx b/gui/src/components/ui/label.tsx
@@ -10,14 +10,9 @@ const labelVariants = cva(
 
 const Label = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
-    VariantProps<typeof labelVariants>
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
 >(({ className, ...props }, ref) => (
-  <LabelPrimitive.Root
-    ref={ref}
-    className={cn(labelVariants(), className)}
-    {...props}
-  />
+  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
 ));
 Label.displayName = LabelPrimitive.Root.displayName;