@lodashventure/medusa-parcel-shipping 0.2.8 → 0.2.13

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

@@ -1,31 +1,383 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { defineRouteConfig } from "@medusajs/admin-sdk";
-import { Directions } from "@medusajs/icons";
+import { FlyingBox, Directions } from "@medusajs/icons";
 import { useState, useCallback, useEffect, useMemo } from "react";
-import { Container, Heading, Text, Button, toast, Table, Badge, Switch, Label, Input } from "@medusajs/ui";
-const requestJson = async (url, method = "GET", body) => {
-  const response = await fetch(url, {
-    method,
-    headers: {
-      "Content-Type": "application/json"
-    },
-    body: body ? JSON.stringify(body) : void 0,
-    credentials: "include"
+import Medusa from "@medusajs/js-sdk";
+import { toast, Table, Text, Badge, Switch, Button, Container, Heading, Label, Input } from "@medusajs/ui";
+const sdk$1 = new Medusa({
+  baseUrl: typeof window !== "undefined" ? window.location.origin : "/",
+  auth: {
+    type: "session"
+  }
+});
+const toNumber$1 = (value) => {
+  if (value.trim().length === 0) {
+    return null;
+  }
+  const parsed = Number(value);
+  return Number.isFinite(parsed) ? parsed : null;
+};
+function ParcelBoxesPage() {
+  const [boxes, setBoxes] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [formState, setFormState] = useState({
+    id: null,
+    name: "",
+    width_cm: "",
+    length_cm: "",
+    height_cm: "",
+    max_weight_kg: "",
+    price_thb: "",
+    active: true
   });
-  if (!response.ok) {
-    let message = response.statusText;
+  const [saving, setSaving] = useState(false);
+  const [deletingId, setDeletingId] = useState(null);
+  const refresh = useCallback(async () => {
+    setLoading(true);
     try {
-      const payload = await response.json();
-      message = (payload == null ? void 0 : payload.code) ?? (payload == null ? void 0 : payload.error) ?? message;
-    } catch (_) {
+      const response = await sdk$1.client.fetch("/admin/parcel-boxes", {
+        method: "GET"
+      });
+      const data = await response.json();
+      setBoxes(data.boxes ?? []);
+    } catch (error) {
+      toast.error(error.message ?? "Failed to load boxes", {
+        dismissable: true
+      });
+    } finally {
+      setLoading(false);
     }
-    throw new Error(message);
-  }
-  if (response.status === 204) {
-    return void 0;
-  }
-  return await response.json();
+  }, []);
+  useEffect(() => {
+    refresh();
+  }, [refresh]);
+  const resetForm = () => setFormState({
+    id: null,
+    name: "",
+    width_cm: "",
+    length_cm: "",
+    height_cm: "",
+    max_weight_kg: "",
+    price_thb: "",
+    active: true
+  });
+  const handleSubmit = async () => {
+    const width = toNumber$1(formState.width_cm);
+    const length = toNumber$1(formState.length_cm);
+    const height = toNumber$1(formState.height_cm);
+    const maxWeight = toNumber$1(formState.max_weight_kg);
+    const price = toNumber$1(formState.price_thb);
+    if (!formState.name.trim() || width === null || length === null || height === null || maxWeight === null || price === null) {
+      toast.error("Fill all fields with valid numeric values", {
+        dismissable: true
+      });
+      return;
+    }
+    const payload = {
+      name: formState.name.trim(),
+      width_cm: width,
+      length_cm: length,
+      height_cm: height,
+      max_weight_kg: maxWeight,
+      price_thb: price,
+      active: formState.active
+    };
+    setSaving(true);
+    try {
+      if (formState.id) {
+        await sdk$1.client.fetch(`/admin/parcel-boxes/${formState.id}`, {
+          method: "PUT",
+          body: payload
+        });
+        toast.success("Box updated", { dismissable: true });
+      } else {
+        await sdk$1.client.fetch("/admin/parcel-boxes", {
+          method: "POST",
+          body: payload
+        });
+        toast.success("Box created", { dismissable: true });
+      }
+      await refresh();
+      resetForm();
+    } catch (error) {
+      toast.error(error.message ?? "Failed to save box", {
+        dismissable: true
+      });
+    } finally {
+      setSaving(false);
+    }
+  };
+  const handleDelete = async (id) => {
+    setDeletingId(id);
+    try {
+      await sdk$1.client.fetch(`/admin/parcel-boxes/${id}`, {
+        method: "DELETE"
+      });
+      toast.success("Box removed", { dismissable: true });
+      await refresh();
+    } catch (error) {
+      toast.error(error.message ?? "Failed to delete box", {
+        dismissable: true
+      });
+    } finally {
+      setDeletingId(null);
+    }
+  };
+  const handleToggle = async (box) => {
+    try {
+      await sdk$1.client.fetch(`/admin/parcel-boxes/${box.id}`, {
+        method: "PUT",
+        body: { active: !box.active }
+      });
+      await refresh();
+    } catch (error) {
+      toast.error(error.message ?? "Failed to update box status", {
+        dismissable: true
+      });
+    }
+  };
+  const tableRows = useMemo(() => {
+    if (loading) {
+      return /* @__PURE__ */ jsx(Table.Row, { children: /* @__PURE__ */ jsx(Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsx(Text, { className: "text-center text-ui-fg-subtle", children: "Loading boxes..." }) }) });
+    }
+    if (boxes.length === 0) {
+      return /* @__PURE__ */ jsx(Table.Row, { children: /* @__PURE__ */ jsx(Table.Cell, { colSpan: 6, children: /* @__PURE__ */ jsx(Text, { className: "text-center text-ui-fg-subtle", children: "No boxes configured yet." }) }) });
+    }
+    return boxes.map((box) => /* @__PURE__ */ jsxs(Table.Row, { children: [
+      /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(Text, { className: "font-medium", children: box.name }) }),
+      /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsxs(Text, { className: "text-sm text-ui-fg-subtle", children: [
+        box.width_cm,
+        " × ",
+        box.length_cm,
+        " × ",
+        box.height_cm
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Cell, { children: box.max_weight_kg }),
+      /* @__PURE__ */ jsx(Table.Cell, { children: box.price_thb }),
+      /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsx(Badge, { color: box.active ? "green" : "grey", children: box.active ? "Active" : "Inactive" }) }),
+      /* @__PURE__ */ jsx(Table.Cell, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Switch,
+          {
+            checked: box.active,
+            onCheckedChange: () => handleToggle(box)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "secondary",
+            size: "small",
+            onClick: () => setFormState({
+              id: box.id,
+              name: box.name,
+              width_cm: String(box.width_cm),
+              length_cm: String(box.length_cm),
+              height_cm: String(box.height_cm),
+              max_weight_kg: String(box.max_weight_kg),
+              price_thb: String(box.price_thb),
+              active: box.active
+            }),
+            children: "Edit"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "danger",
+            size: "small",
+            onClick: () => handleDelete(box.id),
+            disabled: deletingId === box.id,
+            children: "Delete"
+          }
+        )
+      ] }) })
+    ] }, box.id));
+  }, [boxes, deletingId, loading]);
+  return /* @__PURE__ */ jsxs(Container, { className: "space-y-6 p-6", children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(Heading, { level: "h1", children: "Parcel Boxes" }),
+      /* @__PURE__ */ jsx(Text, { className: "text-ui-fg-subtle", children: "Configure and manage parcel box sizes and pricing." })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-4 rounded-md border p-4", children: [
+      /* @__PURE__ */ jsx(Heading, { level: "h2", children: formState.id ? "Edit Box" : "Create Box" }),
+      /* @__PURE__ */ jsxs("div", { className: "grid gap-4 md:grid-cols-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-name",
+              children: "Name"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-name",
+              placeholder: "Enter box name",
+              value: formState.name,
+              onChange: (event) => setFormState((prev) => ({ ...prev, name: event.target.value }))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-width",
+              children: "Width (cm)"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-width",
+              placeholder: "e.g. 20",
+              type: "number",
+              value: formState.width_cm,
+              onChange: (event) => setFormState((prev) => ({
+                ...prev,
+                width_cm: event.target.value
+              }))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-length",
+              children: "Length (cm)"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-length",
+              placeholder: "e.g. 30",
+              type: "number",
+              value: formState.length_cm,
+              onChange: (event) => setFormState((prev) => ({
+                ...prev,
+                length_cm: event.target.value
+              }))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-height",
+              children: "Height (cm)"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-height",
+              placeholder: "e.g. 15",
+              type: "number",
+              value: formState.height_cm,
+              onChange: (event) => setFormState((prev) => ({
+                ...prev,
+                height_cm: event.target.value
+              }))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-max-weight",
+              children: "Max Weight (kg)"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-max-weight",
+              placeholder: "e.g. 0.5",
+              type: "number",
+              value: formState.max_weight_kg,
+              onChange: (event) => setFormState((prev) => ({
+                ...prev,
+                max_weight_kg: event.target.value
+              }))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx(
+            Label,
+            {
+              className: "text-sm font-medium text-ui-fg-base",
+              htmlFor: "parcel-box-price",
+              children: "Box Price (THB)"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: "parcel-box-price",
+              placeholder: "e.g. 10",
+              type: "number",
+              value: formState.price_thb,
+              onChange: (event) => setFormState((prev) => ({
+                ...prev,
+                price_thb: event.target.value
+              }))
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx(
+          Switch,
+          {
+            checked: formState.active,
+            onCheckedChange: (active) => setFormState((prev) => ({ ...prev, active }))
+          }
+        ),
+        /* @__PURE__ */ jsx(Text, { className: "text-sm text-ui-fg-subtle", children: "Active" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
+        /* @__PURE__ */ jsx(Button, { onClick: handleSubmit, disabled: saving, children: formState.id ? "Update" : "Create" }),
+        formState.id && /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: resetForm, children: "Cancel" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-md border", children: /* @__PURE__ */ jsxs(Table, { children: [
+      /* @__PURE__ */ jsx(Table.Header, { children: /* @__PURE__ */ jsxs(Table.Row, { children: [
+        /* @__PURE__ */ jsx(Table.HeaderCell, { children: "Name" }),
+        /* @__PURE__ */ jsx(Table.HeaderCell, { children: "Dimensions (cm)" }),
+        /* @__PURE__ */ jsx(Table.HeaderCell, { children: "Max Weight (kg)" }),
+        /* @__PURE__ */ jsx(Table.HeaderCell, { children: "Price" }),
+        /* @__PURE__ */ jsx(Table.HeaderCell, { children: "Status" }),
+        /* @__PURE__ */ jsx(Table.HeaderCell, { className: "text-right", children: "Actions" })
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Body, { children: tableRows })
+    ] }) })
+  ] });
+}
+const ParcelBoxesRoute = () => {
+  return /* @__PURE__ */ jsx(ParcelBoxesPage, {});
 };
+const config$1 = defineRouteConfig({
+  label: "Parcel Boxes",
+  icon: FlyingBox
+});
+const sdk = new Medusa({
+  baseUrl: typeof window !== "undefined" ? window.location.origin : "/",
+  auth: {
+    type: "session"
+  }
+});
 const toNumber = (value) => {
   if (value.trim().length === 0) {
     return null;
@@ -34,7 +386,7 @@ const toNumber = (value) => {
   return Number.isFinite(parsed) ? parsed : null;
 };
 const getThaiAddressComponents = () => null;
-const ParcelShippingPage = () => {
+function ParcelShippingPage() {
   const [tab, setTab] = useState("boxes");
   return /* @__PURE__ */ jsxs(Container, { className: "space-y-6 p-6", children: [
     /* @__PURE__ */ jsxs("div", { children: [
@@ -76,7 +428,7 @@ const ParcelShippingPage = () => {
       tab === "areas" && /* @__PURE__ */ jsx(AreasSection, {})
     ] })
   ] });
-};
+}
 const BoxesSection = () => {
   const [boxes, setBoxes] = useState([]);
   const [loading, setLoading] = useState(true);
@@ -95,9 +447,10 @@ const BoxesSection = () => {
   const refresh = useCallback(async () => {
     setLoading(true);
     try {
-      const data = await requestJson(
-        "/admin/parcel-boxes"
-      );
+      const response = await sdk.client.fetch("/admin/parcel-boxes", {
+        method: "GET"
+      });
+      const data = await response.json();
       setBoxes(data.boxes ?? []);
     } catch (error) {
       toast.error(error.message ?? "Failed to load boxes", {
@@ -144,14 +497,16 @@ const BoxesSection = () => {
     setSaving(true);
     try {
       if (formState.id) {
-        await requestJson(
-          `/admin/parcel-boxes/${formState.id}`,
-          "PUT",
-          payload
-        );
+        await sdk.client.fetch(`/admin/parcel-boxes/${formState.id}`, {
+          method: "PUT",
+          body: payload
+        });
         toast.success("Box updated", { dismissable: true });
       } else {
-        await requestJson("/admin/parcel-boxes", "POST", payload);
+        await sdk.client.fetch("/admin/parcel-boxes", {
+          method: "POST",
+          body: payload
+        });
         toast.success("Box created", { dismissable: true });
       }
       await refresh();
@@ -167,7 +522,9 @@ const BoxesSection = () => {
   const handleDelete = async (id) => {
     setDeletingId(id);
     try {
-      await requestJson(`/admin/parcel-boxes/${id}`, "DELETE");
+      await sdk.client.fetch(`/admin/parcel-boxes/${id}`, {
+        method: "DELETE"
+      });
       toast.success("Box removed", { dismissable: true });
       await refresh();
     } catch (error) {
@@ -180,8 +537,9 @@ const BoxesSection = () => {
   };
   const handleToggle = async (box) => {
     try {
-      await requestJson(`/admin/parcel-boxes/${box.id}`, "PUT", {
-        active: !box.active
+      await sdk.client.fetch(`/admin/parcel-boxes/${box.id}`, {
+        method: "PUT",
+        body: { active: !box.active }
       });
       await refresh();
     } catch (error) {
@@ -435,9 +793,10 @@ const RatesSection = () => {
   const refresh = useCallback(async () => {
     setLoading(true);
     try {
-      const data = await requestJson(
-        "/admin/shipping-config/rates"
-      );
+      const response = await sdk.client.fetch("/admin/shipping-config/rates", {
+        method: "GET"
+      });
+      const data = await response.json();
       setRates(
         (data.rates ?? []).map((rate) => ({
           ...rate,
@@ -456,7 +815,10 @@ const RatesSection = () => {
     var _a, _b, _c;
     setCurrenciesLoading(true);
     try {
-      const data = await requestJson("/admin/currencies");
+      const response = await sdk.client.fetch("/admin/currencies", {
+        method: "GET"
+      });
+      const data = await response.json();
       const supported = ((_b = (_a = data.store) == null ? void 0 : _a.supported_currencies) == null ? void 0 : _b.map(
         (item) => item.code.toUpperCase()
       )) ?? [];
@@ -535,14 +897,16 @@ const RatesSection = () => {
     setSaving(true);
     try {
       if (formState.id) {
-        await requestJson(
-          `/admin/shipping-config/rates/${formState.id}`,
-          "PUT",
-          payload
-        );
+        await sdk.client.fetch(`/admin/shipping-config/rates/${formState.id}`, {
+          method: "PUT",
+          body: payload
+        });
         toast.success("Rate updated", { dismissable: true });
       } else {
-        await requestJson("/admin/shipping-config/rates", "POST", payload);
+        await sdk.client.fetch("/admin/shipping-config/rates", {
+          method: "POST",
+          body: payload
+        });
         toast.success("Rate created", { dismissable: true });
       }
       await refresh();
@@ -558,7 +922,9 @@ const RatesSection = () => {
   const handleDelete = async (id) => {
     setDeletingId(id);
     try {
-      await requestJson(`/admin/shipping-config/rates/${id}`, "DELETE");
+      await sdk.client.fetch(`/admin/shipping-config/rates/${id}`, {
+        method: "DELETE"
+      });
       toast.success("Rate removed", { dismissable: true });
       await refresh();
     } catch (error) {
@@ -571,8 +937,9 @@ const RatesSection = () => {
   };
   const handleToggle = async (rate) => {
     try {
-      await requestJson(`/admin/shipping-config/rates/${rate.id}`, "PUT", {
-        active: !rate.active
+      await sdk.client.fetch(`/admin/shipping-config/rates/${rate.id}`, {
+        method: "PUT",
+        body: { active: !rate.active }
       });
       await refresh();
     } catch (error) {
@@ -815,9 +1182,10 @@ const AreasSection = () => {
   const refresh = useCallback(async () => {
     setLoading(true);
     try {
-      const data = await requestJson(
-        "/admin/shipping-config/areas"
-      );
+      const response = await sdk.client.fetch("/admin/shipping-config/areas", {
+        method: "GET"
+      });
+      const data = await response.json();
       setAreas(data.areas ?? []);
     } catch (error) {
       toast.error(error.message ?? "Failed to load service areas", {
@@ -857,14 +1225,16 @@ const AreasSection = () => {
     setSaving(true);
     try {
       if (formState.id) {
-        await requestJson(
-          `/admin/shipping-config/areas/${formState.id}`,
-          "PUT",
-          payload
-        );
+        await sdk.client.fetch(`/admin/shipping-config/areas/${formState.id}`, {
+          method: "PUT",
+          body: payload
+        });
         toast.success("Service area updated", { dismissable: true });
       } else {
-        await requestJson("/admin/shipping-config/areas", "POST", payload);
+        await sdk.client.fetch("/admin/shipping-config/areas", {
+          method: "POST",
+          body: payload
+        });
         toast.success("Service area created", { dismissable: true });
       }
       await refresh();
@@ -880,7 +1250,9 @@ const AreasSection = () => {
   const handleDelete = async (id) => {
     setDeletingId(id);
     try {
-      await requestJson(`/admin/shipping-config/areas/${id}`, "DELETE");
+      await sdk.client.fetch(`/admin/shipping-config/areas/${id}`, {
+        method: "DELETE"
+      });
       toast.success("Service area removed", { dismissable: true });
       await refresh();
     } catch (error) {
@@ -893,8 +1265,9 @@ const AreasSection = () => {
   };
   const handleToggle = async (area) => {
     try {
-      await requestJson(`/admin/shipping-config/areas/${area.id}`, "PUT", {
-        active: !area.active
+      await sdk.client.fetch(`/admin/shipping-config/areas/${area.id}`, {
+        method: "PUT",
+        body: { active: !area.active }
       });
       await refresh();
     } catch (error) {
@@ -1135,6 +1508,10 @@ const config = defineRouteConfig({
 const widgetModule = { widgets: [] };
 const routeModule = {
   routes: [
+    {
+      Component: ParcelBoxesRoute,
+      path: "/parcel-boxes"
+    },
     {
       Component: ParcelShippingRoute,
       path: "/parcel-shipping"
@@ -1143,6 +1520,12 @@ const routeModule = {
 };
 const menuItemModule = {
   menuItems: [
+    {
+      label: config$1.label,
+      icon: config$1.icon,
+      path: "/parcel-boxes",
+      nested: void 0
+    },
     {
       label: config.label,
       icon: config.icon,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lodashventure/medusa-parcel-shipping",
-  "version": "0.2.8",
+  "version": "0.2.13",
   "description": "Parcel box selection and Thailand shipping quotes for Medusa.",
   "author": "LodashVenture",
   "license": "MIT",
@@ -64,9 +64,10 @@
     "node": ">=20"
   },
   "dependencies": {
-    "thai-address-autocomplete-react": "^1.2.2",
-    "zod": "^4.1.5",
+    "@types/pdfkit": "^0.13.5",
+    "i18next": "^23.11.0",
     "pdfkit": "0.15.0",
-    "@types/pdfkit": "^0.13.5"
+    "thai-address-autocomplete-react": "^1.2.2",
+    "zod": "^4.1.5"
   }
 }