@froze-labs/medusa-plugin-brands 0.0.1

package/.medusa/server/src/admin/index.js

@@ -0,0 +1,482 @@
+"use strict";
+const jsxRuntime = require("react/jsx-runtime");
+const adminSdk = require("@medusajs/admin-sdk");
+const icons = require("@medusajs/icons");
+const ui = require("@medusajs/ui");
+const reactQuery = require("@tanstack/react-query");
+const react = require("react");
+const reactRouterDom = require("react-router-dom");
+const Medusa = require("@medusajs/js-sdk");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const Medusa__default = /* @__PURE__ */ _interopDefault(Medusa);
+const sdk = new Medusa__default.default({
+  baseUrl: "",
+  auth: {
+    type: "session"
+  }
+});
+const BrandsPage = () => {
+  var _a;
+  const navigate = reactRouterDom.useNavigate();
+  const [currentPage, setCurrentPage] = react.useState(0);
+  const pageSize = 20;
+  const offset = react.useMemo(() => currentPage * pageSize, [currentPage]);
+  const { data, isLoading } = reactQuery.useQuery({
+    queryKey: ["brands", pageSize, offset],
+    queryFn: () => sdk.client.fetch("/admin/brands", {
+      query: {
+        limit: pageSize,
+        offset
+      }
+    })
+  });
+  const pageCount = react.useMemo(
+    () => Math.ceil(((data == null ? void 0 : data.count) || 0) / pageSize),
+    [data == null ? void 0 : data.count]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "Brands" }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: () => navigate("/brands/create"), children: "Create Brand" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 py-4", children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: "Loading..." }) : !((_a = data == null ? void 0 : data.brands) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-ui-fg-muted", children: "No brands found" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table.Row, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Name" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Slug" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Products" }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Table.HeaderCell, { children: "Created" })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Body, { children: data.brands.map((brand) => /* @__PURE__ */ jsxRuntime.jsxs(
+          ui.Table.Row,
+          {
+            className: "cursor-pointer",
+            onClick: () => navigate(`/brands/${brand.id}`),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                brand.logo_image && /* @__PURE__ */ jsxRuntime.jsx(
+                  "img",
+                  {
+                    src: brand.logo_image,
+                    alt: brand.name,
+                    className: "h-8 w-8 rounded object-cover"
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  reactRouterDom.Link,
+                  {
+                    to: `/brands/${brand.id}`,
+                    className: "text-ui-fg-interactive hover:underline",
+                    onClick: (e) => e.stopPropagation(),
+                    children: brand.name
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: brand.slug }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: brand.product_count }),
+              /* @__PURE__ */ jsxRuntime.jsx(ui.Table.Cell, { children: new Date(brand.created_at).toLocaleDateString() })
+            ]
+          },
+          brand.id
+        )) })
+      ] }),
+      pageCount > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mt-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "text-ui-fg-muted", children: [
+          "Page ",
+          currentPage + 1,
+          " of ",
+          pageCount
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              variant: "secondary",
+              size: "small",
+              disabled: currentPage === 0,
+              onClick: () => setCurrentPage((p) => p - 1),
+              children: "Previous"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ui.Button,
+            {
+              variant: "secondary",
+              size: "small",
+              disabled: currentPage >= pageCount - 1,
+              onClick: () => setCurrentPage((p) => p + 1),
+              children: "Next"
+            }
+          )
+        ] })
+      ] })
+    ] }) })
+  ] });
+};
+const config = adminSdk.defineRouteConfig({
+  label: "Brands",
+  icon: icons.TagSolid
+});
+const BrandDetailPage = () => {
+  var _a, _b;
+  const { id } = reactRouterDom.useParams();
+  const navigate = reactRouterDom.useNavigate();
+  const queryClient = reactQuery.useQueryClient();
+  const { data, isLoading } = reactQuery.useQuery({
+    queryKey: ["brand", id],
+    queryFn: () => sdk.client.fetch(`/admin/brands/${id}`)
+  });
+  const deleteMutation = reactQuery.useMutation({
+    mutationFn: () => sdk.client.fetch(`/admin/brands/${id}`, { method: "DELETE" }),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["brands"] });
+      ui.toast.success("Success", {
+        description: "Brand deleted successfully"
+      });
+      navigate("/brands");
+    },
+    onError: () => {
+      ui.toast.error("Error", {
+        description: "Failed to delete brand"
+      });
+    }
+  });
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "p-6", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: "Loading..." }) });
+  }
+  const brand = data == null ? void 0 : data.brand;
+  if (!brand) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "p-6", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: "Brand not found" }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
+        brand.logo_image && /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            src: brand.logo_image,
+            alt: brand.name,
+            className: "h-12 w-12 rounded object-cover"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: brand.name }),
+          /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "text-ui-fg-muted", children: [
+            "/",
+            brand.slug
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: () => navigate(`/brands/${id}/edit`), children: "Edit" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Button,
+          {
+            variant: "danger",
+            onClick: () => {
+              if (confirm("Are you sure you want to delete this brand?")) {
+                deleteMutation.mutate();
+              }
+            },
+            children: "Delete"
+          }
+        )
+      ] })
+    ] }),
+    brand.description && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", className: "mb-2", children: "Description" }),
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: brand.description })
+    ] }),
+    brand.cover_image && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h2", className: "mb-2", children: "Cover Image" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          src: brand.cover_image,
+          alt: `${brand.name} cover`,
+          className: "max-h-48 rounded object-cover"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Heading, { level: "h2", className: "mb-2", children: [
+        "Products ",
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { children: ((_a = brand.products) == null ? void 0 : _a.length) || 0 })
+      ] }),
+      ((_b = brand.products) == null ? void 0 : _b.length) > 0 ? /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "list-disc pl-4", children: brand.products.map((product) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+        reactRouterDom.Link,
+        {
+          to: `/products/${product.id}`,
+          className: "text-ui-fg-interactive hover:underline",
+          children: product.title
+        }
+      ) }, product.id)) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "text-ui-fg-muted", children: "No products linked to this brand" })
+    ] })
+  ] });
+};
+const CreateBrandPage = () => {
+  const navigate = reactRouterDom.useNavigate();
+  const [loading, setLoading] = react.useState(false);
+  const [form, setForm] = react.useState({
+    name: "",
+    description: "",
+    cover_image: "",
+    logo_image: ""
+  });
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setLoading(true);
+    try {
+      await sdk.client.fetch("/admin/brands", {
+        method: "POST",
+        body: {
+          name: form.name,
+          description: form.description || void 0,
+          cover_image: form.cover_image || void 0,
+          logo_image: form.logo_image || void 0
+        }
+      });
+      ui.toast.success("Success", {
+        description: "Brand created successfully"
+      });
+      navigate("/brands");
+    } catch (error) {
+      ui.toast.error("Error", {
+        description: "Failed to create brand"
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "Create Brand" }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4 px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "name", children: "Name *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "name",
+            value: form.name,
+            onChange: (e) => setForm({ ...form, name: e.target.value }),
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "description", children: "Description" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Textarea,
+          {
+            id: "description",
+            value: form.description,
+            onChange: (e) => setForm({ ...form, description: e.target.value })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "logo_image", children: "Logo Image URL" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "logo_image",
+            type: "url",
+            value: form.logo_image,
+            onChange: (e) => setForm({ ...form, logo_image: e.target.value }),
+            placeholder: "https://example.com/logo.png"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "cover_image", children: "Cover Image URL" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "cover_image",
+            type: "url",
+            value: form.cover_image,
+            onChange: (e) => setForm({ ...form, cover_image: e.target.value }),
+            placeholder: "https://example.com/cover.jpg"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", isLoading: loading, children: "Create Brand" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: () => navigate("/brands"), children: "Cancel" })
+      ] })
+    ] })
+  ] });
+};
+const EditBrandPage = () => {
+  const { id } = reactRouterDom.useParams();
+  const navigate = reactRouterDom.useNavigate();
+  const queryClient = reactQuery.useQueryClient();
+  const [form, setForm] = react.useState({
+    name: "",
+    slug: "",
+    description: "",
+    cover_image: "",
+    logo_image: ""
+  });
+  const { data, isLoading } = reactQuery.useQuery({
+    queryKey: ["brand", id],
+    queryFn: () => sdk.client.fetch(`/admin/brands/${id}`)
+  });
+  react.useEffect(() => {
+    if (data == null ? void 0 : data.brand) {
+      setForm({
+        name: data.brand.name,
+        slug: data.brand.slug,
+        description: data.brand.description || "",
+        cover_image: data.brand.cover_image || "",
+        logo_image: data.brand.logo_image || ""
+      });
+    }
+  }, [data]);
+  const updateMutation = reactQuery.useMutation({
+    mutationFn: (formData) => sdk.client.fetch(`/admin/brands/${id}`, {
+      method: "PUT",
+      body: {
+        name: formData.name,
+        slug: formData.slug || void 0,
+        description: formData.description || null,
+        cover_image: formData.cover_image || null,
+        logo_image: formData.logo_image || null
+      }
+    }),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["brand", id] });
+      queryClient.invalidateQueries({ queryKey: ["brands"] });
+      ui.toast.success("Success", {
+        description: "Brand updated successfully"
+      });
+      navigate(`/brands/${id}`);
+    },
+    onError: () => {
+      ui.toast.error("Error", {
+        description: "Failed to update brand"
+      });
+    }
+  });
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    updateMutation.mutate(form);
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ui.Container, { className: "p-6", children: "Loading..." });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { level: "h1", children: "Edit Brand" }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4 px-6 py-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "name", children: "Name *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "name",
+            value: form.name,
+            onChange: (e) => setForm({ ...form, name: e.target.value }),
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "slug", children: "Slug" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "slug",
+            value: form.slug,
+            onChange: (e) => setForm({ ...form, slug: e.target.value })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "description", children: "Description" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Textarea,
+          {
+            id: "description",
+            value: form.description,
+            onChange: (e) => setForm({ ...form, description: e.target.value })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "logo_image", children: "Logo Image URL" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "logo_image",
+            type: "url",
+            value: form.logo_image,
+            onChange: (e) => setForm({ ...form, logo_image: e.target.value })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Label, { htmlFor: "cover_image", children: "Cover Image URL" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ui.Input,
+          {
+            id: "cover_image",
+            type: "url",
+            value: form.cover_image,
+            onChange: (e) => setForm({ ...form, cover_image: e.target.value })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { type: "submit", isLoading: updateMutation.isPending, children: "Save Changes" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "secondary", onClick: () => navigate(`/brands/${id}`), children: "Cancel" })
+      ] })
+    ] })
+  ] });
+};
+const widgetModule = { widgets: [] };
+const routeModule = {
+  routes: [
+    {
+      Component: BrandsPage,
+      path: "/brands"
+    },
+    {
+      Component: BrandDetailPage,
+      path: "/brands/:id"
+    },
+    {
+      Component: CreateBrandPage,
+      path: "/brands/create"
+    },
+    {
+      Component: EditBrandPage,
+      path: "/brands/:id/edit"
+    }
+  ]
+};
+const menuItemModule = {
+  menuItems: [
+    {
+      label: config.label,
+      icon: config.icon,
+      path: "/brands",
+      nested: void 0,
+      rank: void 0,
+      translationNs: void 0
+    }
+  ]
+};
+const formModule = { customFields: {} };
+const displayModule = {
+  displays: {}
+};
+const i18nModule = { resources: {} };
+const plugin = {
+  widgetModule,
+  routeModule,
+  menuItemModule,
+  formModule,
+  displayModule,
+  i18nModule
+};
+module.exports = plugin;