umwd-components 0.1.649 → 0.1.650

package/src/components/e-commerce/opo/TextualManageOpoForm.tsx

@@ -25,8 +25,6 @@ import Box from "@mui/material/Box";
 import Paper from "@mui/material/Paper";
 import Stack from "@mui/material/Stack";
 import Divider from "@mui/material/Divider";
-import Card from "@mui/material/Card";
-import CardContent from "@mui/material/CardContent";
 import { confirmationService } from "../../../data/services/common/confirmation-service";
 import { cancellationService } from "../../../data/services/common/cancellation-service";
 // TODO this should be futher removed from client side code, reimplement via action ??
@@ -45,12 +43,15 @@ import BusinessIcon from "@mui/icons-material/Business";
 import DescriptionIcon from "@mui/icons-material/Description";
 import UpdateIcon from "@mui/icons-material/Update";
 import { OpoStatusIndicator } from "./OpoStatusIndicator";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
+import { SxProps } from "@mui/material/styles";
 
 const INITIAL_STATE = {
   zodErrors: null,
   strapiErrors: null,
   data: null,
   message: null,
+  severity: null,
 };
 
 function ConfirmFormDialog({
@@ -171,7 +172,7 @@ export default function TextualManageOPOForm({
   revalidateCallback,
   handleClose,
   role,
-}: ManageOpoFormProps) {
+}: ManageOpoFormProps & { sx?: SxProps }) {
   // TODO bind to id of IPO
   const [formState, formAction] = useFormState(updateOpoAction, INITIAL_STATE);
 
@@ -268,12 +269,7 @@ export default function TextualManageOPOForm({
   }, [opo]);
 
   return (
-    <Box
-      sx={[
-        // You cannot spread `sx` directly because `SxProps` (typeof sx) can be an array.
-        ...(Array.isArray(sx) ? sx : [sx]),
-      ]}
-    >
+    <Box sx={[{ p: 2 }, ...(Array.isArray(sx) ? sx : [sx])]} component={Paper}>
       <Grid container spacing={2}>
         <Grid item xs={12}>
           <Stack spacing={2}>

package/src/components/e-commerce/products/AddProductForm.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { useFormState } from "react-dom";
 
 import Paper from "@mui/material/Paper";
@@ -25,26 +25,58 @@ import { DimensionsFields } from "../../../components/common/Dimensions";
 import VendorSelector from "../../../components/logistics/vendor/VendorSelector";
 import { VendorName } from "../../../types/logistics/Vendor";
 import MarkdownEditor from "../../../components/common/markdown/MarkdownEditor";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
 
 const INITIAL_STATE = {
   zodErrors: null,
   strapiErrors: null,
+  severity: null,
   data: null,
   message: null,
 };
 
-export function AddProductForm({
+export const AddProductForm = ({
   vendorArr,
   categories,
+  revalidateCallback,
+  handleClose,
 }: {
   vendorArr: VendorName[];
   categories: CategoryName[];
-}) {
+  revalidateCallback?: () => void;
+  handleClose?: () => void;
+}) => {
+  const { state, dispatch } = useSnackbar();
   const [formState, formAction] = useFormState(
     createProductAction,
     INITIAL_STATE
   );
 
+  const { handleAddMessage } = useSnackbar();
+
+  useEffect(() => {
+    if (formState?.message) {
+      handleAddMessage({
+        message: formState.message,
+        severity: formState.severity || "error",
+      });
+
+      if (formState.severity === "success") {
+        revalidateCallback && revalidateCallback();
+        handleClose && handleClose();
+      }
+    }
+  }, [formState?.message]);
+
+  useEffect(() => {
+    if (formState?.strapiErrors) {
+      handleAddMessage({
+        message: formState.strapiErrors.message || "Error adding product",
+        severity: formState.severity || "error",
+      });
+    }
+  }, [formState?.strapiErrors]);
+
   const [mediaDialogOpen, setMediaDialogOpen] = useState<
     "image" | "gallery" | null
   >(null);
@@ -224,4 +256,4 @@ export function AddProductForm({
       </form>
     </Box>
   );
-}
+};

package/src/components/e-commerce/products/EditProductForm.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import Paper from "@mui/material/Paper";
 import Box from "@mui/material/Box";
 import Stack from "@mui/material/Stack";
@@ -24,10 +24,13 @@ import { ExtendedProduct } from "../../../types/e-commerce/product/types";
 import VendorSelector from "../../../components/logistics/vendor/VendorSelector";
 import { VendorName } from "../../../types/logistics/Vendor";
 import MarkdownEditor from "../../../components/common/markdown/MarkdownEditor";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
+import { SxProps } from "@mui/material/styles";
 
 const INITIAL_STATE = {
   zodErrors: null,
   strapiErrors: null,
+  severity: null,
   data: null,
   message: null,
 };
@@ -36,10 +39,14 @@ export function EditProductForm({
   data,
   vendorArr,
   categoriesArray,
+  revalidateCallback,
+  sx,
 }: {
   data: ExtendedProduct;
   vendorArr: VendorName[];
   categoriesArray: CategoryName[];
+  revalidateCallback?: () => void;
+  sx?: SxProps;
 }) {
   const {
     id,
@@ -58,11 +65,34 @@ export function EditProductForm({
   const initialGallery = gallery?.data || [];
   const initialCategories = categories?.data || [];
 
+  const { handleAddMessage } = useSnackbar();
   const [formState, formAction] = useFormState(
     updateProductAction,
     INITIAL_STATE
   );
 
+  useEffect(() => {
+    if (formState?.message) {
+      handleAddMessage({
+        message: formState.message,
+        severity: formState.severity || "error",
+      });
+
+      if (formState.severity === "success") {
+        revalidateCallback && revalidateCallback();
+      }
+    }
+  }, [formState?.message]);
+
+  useEffect(() => {
+    if (formState?.strapiErrors) {
+      handleAddMessage({
+        message: formState.strapiErrors.message || "Error updating product",
+        severity: formState.severity || "error",
+      });
+    }
+  }, [formState?.strapiErrors]);
+
   const [mediaDialogOpen, setMediaDialogOpen] = useState<
     "image" | "gallery" | null
   >(null);
@@ -97,12 +127,12 @@ export function EditProductForm({
 
   return (
     <Box
-      /* sx={[
-            // You cannot spread `sx` directly because `SxProps` (typeof sx) can be an array.
-            ...(Array.isArray(sx) ? sx : [sx]),
-          ]} */
+      sx={[
+        { p: 2 },
+        // You cannot spread `sx` directly because `SxProps` (typeof sx) can be an array.
+        ...(Array.isArray(sx) ? sx : [sx]),
+      ]}
       component={Paper}
-      sx={{ p: 2 }}
     >
       <form action={formAction}>
         {id && <input id="id" type="hidden" name="id" value={id} />}

package/src/components/e-commerce/products/EditStockForm.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import Paper from "@mui/material/Paper";
 import Box from "@mui/material/Box";
 import Stack from "@mui/material/Stack";
@@ -28,10 +28,12 @@ import {
 import AmountIndicator from "../../../components/common/AmountIndicator";
 import { IpoItem } from "../../../types/logistics/Ipo";
 import { OpoItem } from "../../../types/e-commerce/opo/types";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
 
 const INITIAL_STATE = {
   zodErrors: null,
   strapiErrors: null,
+  severity: null,
   data: null,
   message: null,
 };
@@ -51,6 +53,29 @@ export function EditStockForm({
     updateProductAction,
     INITIAL_STATE
   );
+  const { handleAddMessage } = useSnackbar();
+
+  useEffect(() => {
+    if (formState?.message) {
+      handleAddMessage({
+        message: formState.message,
+        severity: formState.severity || "error",
+      });
+
+      if (formState.severity === "success") {
+        revalidateCallback && revalidateCallback();
+      }
+    }
+  }, [formState?.message]);
+
+  useEffect(() => {
+    if (formState?.strapiErrors) {
+      handleAddMessage({
+        message: formState.strapiErrors.message || "Error updating stock",
+        severity: formState.severity || "error",
+      });
+    }
+  }, [formState?.strapiErrors]);
 
   return (
     <Box

package/src/data/actions/e-commerce/categories/createCategoryAction.tsx

@@ -26,6 +26,7 @@ export async function createCategoryAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -34,6 +35,7 @@ export async function createCategoryAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Create Category.",
     };
@@ -43,7 +45,8 @@ export async function createCategoryAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
-    message: "Category Created",
+    severity: "success",
+    message: "Category Created Successfully",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/actions/e-commerce/categories/updateCategoryAction.tsx

@@ -26,6 +26,7 @@ export async function updateCategoryAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -34,6 +35,7 @@ export async function updateCategoryAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Update Category.",
     };
@@ -43,7 +45,8 @@ export async function updateCategoryAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
-    message: "Category Updated",
+    severity: "success",
+    message: "Category Updated Successfully",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/actions/e-commerce/checkout-action.ts

@@ -1,4 +1,3 @@
-// "use client"; // this should be use server but while developing it's easier to use client to do console.log
 "use server";
 
 import { mutateData } from "../../services/mutate-data";

package/src/data/actions/e-commerce/iro/cancelIroAction.ts

@@ -13,7 +13,6 @@ export async function cancelIroAction(prevState: any, formData: FormData) {
   const rawFormData = Object.fromEntries(formData);
 
   const parsedFormData = parseFormData(formData);
-  console.log("parsedFormData", parsedFormData);
 
   const responseData = await mutateData(
     "PUT",
@@ -24,6 +23,7 @@ export async function cancelIroAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -32,6 +32,7 @@ export async function cancelIroAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Cancel Iro.",
     };

package/src/data/actions/e-commerce/iro/requestRmaAction.ts

@@ -1,5 +1,4 @@
-"use client";
-//"use server";
+"use server";
 
 import { mutateData } from "../../../services/mutate-data";
 import { flattenAttributes } from "../../../../lib/utils";
@@ -10,10 +9,8 @@ import { parseFormData } from "../../../../lib/parseFormData";
  */
 export async function requestRmaAction(prevState: any, formData: FormData) {
   const rawFormData = Object.fromEntries(formData);
-  console.log(rawFormData);
 
   const parsedFormData = parseFormData(formData);
-  console.log(parsedFormData);
 
   if (parsedFormData.data.iro_items) {
     parsedFormData.data.iro_items = JSON.parse(parsedFormData.data.iro_items);
@@ -23,8 +20,6 @@ export async function requestRmaAction(prevState: any, formData: FormData) {
     parsedFormData.data.opos = JSON.parse(parsedFormData.data.opos);
   }
 
-  console.log("parsedFormData", parsedFormData);
-
   const responseData = await mutateData("POST", `/api/iros`, parsedFormData);
 
   if (!responseData) {

package/src/data/actions/e-commerce/opo/createOpoAction.ts

@@ -22,6 +22,7 @@ export async function createOpoAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -30,6 +31,7 @@ export async function createOpoAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Create Opo.",
     };
@@ -39,6 +41,7 @@ export async function createOpoAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
+    severity: "success",
     message: "Opo Created Successfully",
     data: flattenedData,
     strapiErrors: null,

package/src/data/actions/e-commerce/opo/updateOpoAction.ts

@@ -19,6 +19,7 @@ export async function updateOpoAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -27,6 +28,7 @@ export async function updateOpoAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Update Opo.",
     };
@@ -36,7 +38,8 @@ export async function updateOpoAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
-    message: "Opo Updated",
+    severity: "success",
+    message: "Opo Updated Successfully",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/actions/e-commerce/product/createProductAction.tsx

@@ -41,6 +41,7 @@ export async function createProductAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -49,6 +50,7 @@ export async function createProductAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Create Product.",
     };
@@ -58,7 +60,8 @@ export async function createProductAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
-    message: "New Product Created",
+    severity: "success",
+    message: "Product Created Successfully",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/actions/e-commerce/product/updateProductAction.tsx

@@ -40,6 +40,7 @@ export async function updateProductAction(prevState: any, formData: FormData) {
   if (!responseData) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
     };
@@ -48,6 +49,7 @@ export async function updateProductAction(prevState: any, formData: FormData) {
   if (responseData.error) {
     return {
       ...prevState,
+      severity: "error",
       strapiErrors: responseData.error,
       message: "Failed to Update Product.",
     };
@@ -57,7 +59,8 @@ export async function updateProductAction(prevState: any, formData: FormData) {
 
   return {
     ...prevState,
-    message: "Product Updated",
+    severity: "success",
+    message: "Product Updated Successfully",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/loaders/loaders.ts

@@ -171,7 +171,7 @@ async function getPageNames(): Promise<PageNamesResponse> {
 }
 
 async function getSiteData() {
-  // noStore();
+  noStore();
 
   const url = new URL("/api/public-information", baseUrl);