Mm2 1304 eslint prettier

.eslintrc.json

@@ -48,6 +48,14 @@
     "import/namespace": 0,
     "import/default": 0,
     "import/export": 0,
+    "@typescript-eslint/no-unused-vars": [
+      "error",
+      {
+        "argsIgnorePattern": "^_",
+        "varsIgnorePattern": "^_",
+        "caughtErrorsIgnorePattern": "^_"
+      }
+    ],
     "no-restricted-imports": [
       "error",
       {

package.json

@@ -87,6 +87,7 @@
     "@medusajs/types": "2.10.3",
     "@medusajs/ui-preset": "2.10.3",
     "@trivago/prettier-plugin-sort-imports": "^5.2.2",
+    "@types/lodash": "^4.17.20",
     "@types/node": "^20.11.15",
     "@types/react": "^18.2.79",
     "@types/react-dom": "^18.2.25",

src/app.tsx

@@ -1,32 +1,31 @@
-import { DashboardApp } from "./dashboard-app"
-import { DashboardPlugin } from "./dashboard-app/types"
+import displayModule from "virtual:medusa/displays";
+import formModule from "virtual:medusa/forms";
+import menuItemModule from "virtual:medusa/menu-items";
+import routeModule from "virtual:medusa/routes";
+import widgetModule from "virtual:medusa/widgets";
 
-import displayModule from "virtual:medusa/displays"
-import formModule from "virtual:medusa/forms"
-import menuItemModule from "virtual:medusa/menu-items"
-import routeModule from "virtual:medusa/routes"
-import widgetModule from "virtual:medusa/widgets"
-
-import "./index.css"
+import { DashboardApp } from "./dashboard-app";
+import type { DashboardPlugin } from "./dashboard-app/types";
+import "./index.css";
 
 const localPlugin = {
   widgetModule,
   routeModule,
   displayModule,
   formModule,
   menuItemModule,
-}
+};
 
 interface AppProps {
-  plugins?: DashboardPlugin[]
+  plugins?: DashboardPlugin[];
 }
 
 function App({ plugins = [] }: AppProps) {
   const app = new DashboardApp({
     plugins: [localPlugin, ...plugins],
-  })
+  });
 
-  return <div>{app.render()}</div>
+  return <div>{app.render()}</div>;
 }
 
-export default App
+export default App;

src/components/authentication/protected-route/index.ts

@@ -1 +1 @@
-export * from "./protected-route"
+export * from "./protected-route";

src/components/authentication/protected-route/protected-route.tsx

@@ -1,23 +1,26 @@
-import { Spinner } from "@medusajs/icons"
-import { Navigate, Outlet, useLocation } from "react-router-dom"
-import { useMe } from "../../../hooks/api/users"
-import { SearchProvider } from "../../../providers/search-provider"
-import { SidebarProvider } from "../../../providers/sidebar-provider"
+import { Spinner } from "@medusajs/icons";
+
+import { Navigate, Outlet, useLocation } from "react-router-dom";
+
+import { useMe } from "@hooks/api";
+
+import { SearchProvider } from "@providers/search-provider";
+import { SidebarProvider } from "@providers/sidebar-provider";
 
 export const ProtectedRoute = () => {
-  const { user, isLoading } = useMe()
-  const location = useLocation()
+  const { user, isLoading } = useMe();
+  const location = useLocation();
 
   if (isLoading) {
     return (
       <div className="flex min-h-screen items-center justify-center">
-        <Spinner className="text-ui-fg-interactive animate-spin" />
+        <Spinner className="animate-spin text-ui-fg-interactive" />
       </div>
-    )
+    );
   }
 
   if (!user) {
-    return <Navigate to="/login" state={{ from: location }} replace />
+    return <Navigate to="/login" state={{ from: location }} replace />;
   }
 
   return (
@@ -26,5 +29,5 @@ export const ProtectedRoute = () => {
         <Outlet />
       </SearchProvider>
     </SidebarProvider>
-  )
-}
+  );
+};

src/components/common/action-menu/index.ts

@@ -1 +1 @@
-export * from "./action-menu"
+export * from "./action-menu";

src/components/common/actions-button/actions-button.tsx

@@ -1,19 +1,38 @@
-import { Button, DropdownMenu } from "@medusajs/ui"
-import { EllipsisHorizontal } from "@medusajs/icons"
 import { useState } from "react";
 
-export const ActionsButton = ({actions}: {actions: {label: string, onClick: () => void, icon?: JSX.Element}[]}) => {
+import { EllipsisHorizontal } from "@medusajs/icons";
+import { Button, DropdownMenu } from "@medusajs/ui";
+
+export const ActionsButton = ({
+  actions,
+}: {
+  actions: { label: string; onClick: () => void; icon?: JSX.Element }[];
+}) => {
   const [open, setOpen] = useState(false);
+
   return (
     <DropdownMenu open={open} onOpenChange={setOpen}>
-      <DropdownMenu.Trigger asChild><Button variant="transparent" className="h-8 w-12 p-0" onClick={() => setOpen(true)}><EllipsisHorizontal /></Button></DropdownMenu.Trigger>
+      <DropdownMenu.Trigger asChild>
+        <Button
+          variant="transparent"
+          className="h-8 w-12 p-0"
+          onClick={() => setOpen(true)}
+        >
+          <EllipsisHorizontal />
+        </Button>
+      </DropdownMenu.Trigger>
       <DropdownMenu.Content>
-        {actions.map(({ label, onClick, icon}) => (
-          <DropdownMenu.Item key={label} onClick={onClick} className="flex items-center gap-2">
-            {icon}{label}
+        {actions.map(({ label, onClick, icon }) => (
+          <DropdownMenu.Item
+            key={label}
+            onClick={onClick}
+            className="flex items-center gap-2"
+          >
+            {icon}
+            {label}
           </DropdownMenu.Item>
         ))}
       </DropdownMenu.Content>
     </DropdownMenu>
-  )
-}
+  );
+};

src/components/common/badge-list-summary/badge-list-summary.tsx

@@ -1,27 +1,28 @@
-import { Badge, Tooltip, clx } from "@medusajs/ui"
-import { useTranslation } from "react-i18next"
+import { Badge, Tooltip, clx } from "@medusajs/ui";
+
+import { useTranslation } from "react-i18next";
 
 type BadgeListSummaryProps = {
   /**
    * Number of initial items to display
    * @default 2
    */
-  n?: number
+  n?: number;
   /**
    * List of strings to display as abbreviated list
    */
-  list: string[]
+  list: string[];
   /**
    * Is the summary displayed inline.
    * Determines whether the center text is truncated if there is no space in the container
    */
-  inline?: boolean
+  inline?: boolean;
   /**
    * Whether the badges should be rounded
    */
-  rounded?: boolean
-  className?: string
-}
+  rounded?: boolean;
+  className?: string;
+};
 
 export const BadgeListSummary = ({
   list,
@@ -30,29 +31,29 @@ export const BadgeListSummary = ({
   rounded = false,
   n = 2,
 }: BadgeListSummaryProps) => {
-  const { t } = useTranslation()
+  const { t } = useTranslation();
 
   const title = t("general.plusCount", {
     count: list.length - n,
-  })
+  });
 
   return (
     <div
       className={clx(
-        "text-ui-fg-subtle txt-compact-small gap-x-2 overflow-hidden",
+        "txt-compact-small gap-x-2 overflow-hidden text-ui-fg-subtle",
         {
           "inline-flex": inline,
           flex: !inline,
         },
-        className
+        className,
       )}
     >
       {list.slice(0, n).map((item) => {
         return (
           <Badge rounded={rounded ? "full" : "base"} key={item} size="2xsmall">
             {item}
           </Badge>
-        )
+        );
       })}
 
       {list.length > n && (
@@ -77,5 +78,5 @@ export const BadgeListSummary = ({
         </div>
       )}
     </div>
-  )
-}
+  );
+};

src/components/common/badge-list-summary/index.ts

@@ -1 +1 @@
-export * from "./badge-list-summary"
+export * from "./badge-list-summary";

src/components/common/chip-group/chip-group.tsx

@@ -1,33 +1,38 @@
-import { XMarkMini } from "@medusajs/icons"
-import { Button, clx } from "@medusajs/ui"
-import { Children, PropsWithChildren, createContext, useContext } from "react"
-import { useTranslation } from "react-i18next"
+import type { PropsWithChildren } from "react";
+import { Children, createContext, useContext } from "react";
 
-type ChipGroupVariant = "base" | "component"
+import { XMarkMini } from "@medusajs/icons";
+import { Button, clx } from "@medusajs/ui";
+
+import { useTranslation } from "react-i18next";
+
+type ChipGroupVariant = "base" | "component";
 
 type ChipGroupProps = PropsWithChildren<{
-  onClearAll?: () => void
-  onRemove?: (index: number) => void
-  variant?: ChipGroupVariant
-  className?: string
-}>
+  onClearAll?: () => void;
+  onRemove?: (index: number) => void;
+  variant?: ChipGroupVariant;
+  className?: string;
+}>;
 
 type GroupContextValue = {
-  onRemove?: (index: number) => void
-  variant: ChipGroupVariant
-}
+  onRemove?: (index: number) => void;
+  variant: ChipGroupVariant;
+};
 
-const GroupContext = createContext<GroupContextValue | null>(null)
+const GroupContext = createContext<GroupContextValue | null>(null);
 
 const useGroupContext = () => {
-  const context = useContext(GroupContext)
+  const context = useContext(GroupContext);
 
   if (!context) {
-    throw new Error("useGroupContext must be used within a ChipGroup component")
+    throw new Error(
+      "useGroupContext must be used within a ChipGroup component",
+    );
   }
 
-  return context
-}
+  return context;
+};
 
 const Group = ({
   onClearAll,
@@ -36,9 +41,9 @@ const Group = ({
   className,
   children,
 }: ChipGroupProps) => {
-  const { t } = useTranslation()
+  const { t } = useTranslation();
 
-  const showClearAll = !!onClearAll && Children.count(children) > 0
+  const showClearAll = !!onClearAll && Children.count(children) > 0;
 
   return (
     <GroupContext.Provider value={{ onRemove, variant }}>
@@ -62,50 +67,50 @@ const Group = ({
         )}
       </ul>
     </GroupContext.Provider>
-  )
-}
+  );
+};
 
 type ChipProps = PropsWithChildren<{
-  index: number
-  className?: string
-}>
+  index: number;
+  className?: string;
+}>;
 
 const Chip = ({ index, className, children }: ChipProps) => {
-  const { onRemove, variant } = useGroupContext()
+  const { onRemove, variant } = useGroupContext();
 
   return (
     <li
       className={clx(
-        "bg-ui-bg-component shadow-borders-base flex items-stretch divide-x overflow-hidden rounded-md",
+        "flex items-stretch divide-x overflow-hidden rounded-md bg-ui-bg-component shadow-borders-base",
         {
           "bg-ui-bg-component": variant === "component",
           "bg-ui-bg-base-": variant === "base",
         },
-        className
+        className,
       )}
     >
-      <span className="txt-compact-small-plus text-ui-fg-subtle flex items-center justify-center px-2 py-1">
+      <span className="txt-compact-small-plus flex items-center justify-center px-2 py-1 text-ui-fg-subtle">
         {children}
       </span>
       {!!onRemove && (
         <button
           onClick={() => onRemove(index)}
           type="button"
           className={clx(
-            "text-ui-fg-muted active:text-ui-fg-subtle transition-fg flex items-center justify-center p-1",
+            "flex items-center justify-center p-1 text-ui-fg-muted transition-fg active:text-ui-fg-subtle",
             {
               "hover:bg-ui-bg-component-hover active:bg-ui-bg-component-pressed":
                 variant === "component",
               "hover:bg-ui-bg-base-hover active:bg-ui-bg-base-pressed":
                 variant === "base",
-            }
+            },
           )}
         >
           <XMarkMini />
         </button>
       )}
     </li>
-  )
-}
+  );
+};
 
-export const ChipGroup = Object.assign(Group, { Chip })
+export const ChipGroup = Object.assign(Group, { Chip });

src/components/common/chip-group/index.ts

@@ -1 +1 @@
-export * from "./chip-group"
+export * from "./chip-group";