umwd-components 0.1.686 → 0.1.688

package/dist/types/components/logistics/report/ReportMakingComponent.d.ts

@@ -2,4 +2,4 @@ import React from "react";
 import { ReportMakingComponentProps } from "../../../types/logistics/Report";
 /** INFO Reports can only be created with entities that already excist,
  * this is because the report has to be saved with a relation to the parent entity */
-export default function ReportMakingComponent({ content, related, type, minValue, maxValue, revalidateCallback, }: ReportMakingComponentProps): React.JSX.Element;
+export default function ReportMakingComponent({ content, related, type, minValue, maxValue, revalidateCallback, biggerButton, }: ReportMakingComponentProps): React.JSX.Element;

package/dist/types/data/actions/logistics/report/createReportAction.d.ts

@@ -1 +1 @@
-export declare function createReportAction(related: any, prevState: any, formData: FormData): Promise<any>;
+export declare function createReportAction(related: any, type: string, prevState: any, formData: FormData): Promise<any>;

package/dist/types/data/loaders/e-commerce/getAllOpos.d.ts

@@ -1,2 +1,2 @@
-declare function getAllOpos(currentPage: number, rowsPerPage: number, order: "asc" | "desc", orderBy: string, is_archive: boolean[]): Promise<any>;
+declare function getAllOpos(currentPage: number, rowsPerPage: number, order: "asc" | "desc", orderBy: string, is_archive?: boolean[]): Promise<any>;
 export { getAllOpos };

package/dist/types/data/loaders/e-commerce/getPaginatedCategories.d.ts

@@ -1 +1 @@
-export declare function getPaginatedCategories(currentPage?: number, rowsPerPage?: number, order?: "asc" | "desc", orderBy?: string): Promise<any>;
+export declare function getPaginatedCategories(currentPage?: number, rowsPerPage?: number, order?: "asc" | "desc", orderBy?: string, is_archive?: boolean[]): Promise<any>;

package/dist/types/data/loaders/user/getUserMeLoader.d.ts

@@ -0,0 +1,10 @@
+import { User } from "@/types/user";
+export declare function getUserMeLoader(query?: string): Promise<{
+    ok: boolean;
+    data: null;
+    error: any;
+} | {
+    ok: boolean;
+    data: User;
+    error: null;
+}>;

package/dist/types/types/logistics/Report.d.ts

@@ -16,6 +16,8 @@ export type Report = {
     type: ReportType;
     related: PolymorphicRelation[];
     author: any;
+    signature_username?: string;
+    signature_email?: string;
 };
 export interface ReportMakingComponentProps {
     author?: string;
@@ -27,6 +29,7 @@ export interface ReportMakingComponentProps {
     type: ReportType;
     related?: PolymorphicRelation[];
     revalidateCallback?: () => void;
+    biggerButton?: boolean;
 }
 export interface SimpleReportFieldsProps {
     itemID: number;

package/dist/types/types/user.d.ts

@@ -0,0 +1,14 @@
+import { CustomerProfileProps } from "./e-commerce/customer/types";
+import { EnduserProfileProps } from "./e-commerce/enduser/types";
+import { DispatcherProfileProps } from "./logistics/dispatcher/types";
+export type User = {
+    id: string;
+    username: string;
+    email: string;
+    role?: "customer" | "enduser" | "dispatcher";
+    created_at: Date;
+    updated_at: Date;
+    customer_profile?: CustomerProfileProps;
+    enduser_profile?: EnduserProfileProps;
+    dispatcher_profile?: DispatcherProfileProps;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "umwd-components",
-  "version": "0.1.686",
+  "version": "0.1.688",
   "description": "UMWD Component library",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",

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

@@ -26,6 +26,7 @@ import Button from "@mui/material/Button";
 import AmountIndicator from "../../../components/common/AmountIndicator";
 import { IpoItem } from "../../../types/logistics/Ipo";
 import { OpoItem } from "../../../types/e-commerce/opo/types";
+import { alignProperty } from "@mui/material/styles/cssUtils";
 
 const INITIAL_STATE = {
   zodErrors: null,
@@ -384,19 +385,22 @@ export function EditStockForm({
                 not forget to click the button!
               </Typography>
               <ReportsDisplay reports={reports} />
-              <ReportMakingComponent
-                content={"content"}
-                quantity={0}
-                type="stock"
-                related={[{ id: id, __type: "api::e-commerce.product" }]}
-                revalidateCallback={revalidateCallback}
-              />
+              <Stack direction="row" justifyContent={"flex-end"}>
+                <ReportMakingComponent
+                  content={"content"}
+                  quantity={0}
+                  type="stock"
+                  related={[{ id: id, __type: "api::e-commerce.product" }]}
+                  revalidateCallback={revalidateCallback}
+                  biggerButton={true}
+                />
+              </Stack>
             </Stack>
           </Grid>
           <Grid item xs={12}>
             <Stack
               direction="row"
-              justifyContent="space-between"
+              justifyContent="flex-end"
               alignItems="center"
               sx={{ py: 1 }}
             >
@@ -405,11 +409,13 @@ export function EditStockForm({
                   Close
                 </Button>
               )}
+              {/* 
+              Nothing to submit here, the form is just for the reports
               <SubmitButton
                 text="Update Stock"
                 loadingText="Updating..."
                 variant="contained"
-              />
+              /> */}
             </Stack>
           </Grid>
         </Grid>

package/src/components/logistics/note/NoteTakingComponent.tsx

@@ -17,12 +17,14 @@ import { useFormState } from "react-dom";
 import { createNoteAction } from "../../../data/actions/logistics/note/createNoteAction";
 import { NoteTakingComponentProps } from "../../../types/logistics/Note";
 import MarkdownEditor from "../../../components/common/markdown/MarkdownEditor";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
 
 const INITIAL_STATE = {
   zodErrors: null,
   strapiErrors: null,
   data: null,
   message: null,
+  severity: null,
 };
 
 /** INFO Notes can only be created with entities that already excist,
@@ -41,11 +43,28 @@ export default function NoteTakingComponent({
     INITIAL_STATE
   );
 
+  const { handleAddMessage } = useSnackbar();
+
   useEffect(() => {
-    if (formState?.data && revalidateCallback) {
-      revalidateCallback();
+    if (formState?.strapiErrors) {
+      handleAddMessage({
+        message: formState.strapiErrors,
+        severity: formState.severity || "error",
+      });
+    }
+    if (formState?.message) {
+      handleAddMessage({
+        message: formState.message,
+        severity: formState.severity || "success",
+      });
+      if (formState?.severity === "success") {
+        setOpen(false);
+        if (revalidateCallback) {
+          revalidateCallback();
+        }
+      }
     }
-  }, [formState.data]);
+  }, [formState]);
 
   return (
     <>
@@ -60,7 +79,12 @@ export default function NoteTakingComponent({
         <NoteAltIcon fontSize="large" />
       </IconButton>
 
-      <Dialog open={open} fullWidth={true} maxWidth={"lg"}>
+      <Dialog
+        open={open}
+        fullWidth={true}
+        maxWidth={"lg"}
+        onClose={() => setOpen(false)}
+      >
         <form action={formAction}>
           <DialogContent sx={{ p: 1 }}>
             <Paper
@@ -75,22 +99,7 @@ export default function NoteTakingComponent({
               <Stack spacing={2}>
                 <Typography variant="body1" textAlign={"right"}>
                   {dayjs(Date.now()).format("DD-MM-YYYY")}
-                  {/*  format(Date.now(), "dd-MM-yyyy")} */}
                 </Typography>
-                {/* <TextField
-                  id="content"
-                  name="content"
-                  sx={{
-                    color: "black",
-                    label: { color: "black" },
-                    input: { color: "black" },
-                    div: { color: "black" },
-                  }}
-                  label="The note"
-                  multiline
-                  rows={12}
-                  defaultValue={content}
-                /> */}
                 <MarkdownEditor
                   name={"content"}
                   label="The note"
@@ -108,10 +117,6 @@ export default function NoteTakingComponent({
           <DialogActions>
             <Button onClick={() => setOpen(false)}>Cancel</Button>
             <SubmitButton text="Submit" loadingText="Loading..." />
-            <StrapiErrors error={formState?.strapiErrors} />
-            {formState?.message && (
-              <Alert severity="error">{formState?.message}</Alert>
-            )}
           </DialogActions>
         </form>
       </Dialog>

package/src/components/logistics/report/ReportMakingComponent.tsx

@@ -19,7 +19,8 @@ import { ReportMakingComponentProps } from "../../../types/logistics/Report";
 import MarkdownEditor from "../../../components/common/markdown/MarkdownEditor";
 import AnnouncementIcon from "@mui/icons-material/Announcement";
 import { Box, Tooltip } from "@mui/material";
-import { Block } from "@mui/icons-material";
+import { getUserMeLoader } from "../../../data/loaders/user/getUserMeLoader";
+import { useSnackbar } from "../../../context/common/SnackbarContext";
 
 const INITIAL_STATE = {
   zodErrors: null,
@@ -37,12 +38,21 @@ export default function ReportMakingComponent({
   minValue,
   maxValue,
   revalidateCallback,
+  biggerButton = false, // if true, the button will be bigger
 }: ReportMakingComponentProps) {
   const [open, setOpen] = useState(false);
 
+  interface User {
+    username: string;
+    email: string;
+  }
+
+  const [currentUser, setCurrentUser] = useState<User | null>(null);
+
   const createReportWithRelationsAction = createReportAction.bind(
     null,
-    related
+    related,
+    type
   );
 
   const [formState, formAction] = useFormState(
@@ -50,27 +60,67 @@ export default function ReportMakingComponent({
     INITIAL_STATE
   );
 
+  const { handleAddMessage } = useSnackbar();
+
+  useEffect(() => {
+    if (formState?.message) {
+      handleAddMessage({
+        message: formState.message,
+        severity: formState.severity || "error",
+      });
+
+      if (formState.severity === "success") {
+        revalidateCallback && revalidateCallback();
+        setOpen(false);
+      }
+    }
+  }, [formState?.message]);
+
   useEffect(() => {
-    if (formState?.data && revalidateCallback) {
-      revalidateCallback();
+    async function fetchUser() {
+      const { ok, data, error } = await getUserMeLoader();
+      if (ok && data) {
+        console.log("Current User:", data);
+        setCurrentUser(data);
+      } else {
+        setCurrentUser(null);
+        console.error("Error fetching current user:", error);
+      }
     }
-  }, [formState.data]);
+    fetchUser();
+  }, []);
 
   return (
     <>
       <Box sx={{ display: "block", position: "relative" }}>
-        <Tooltip title="Create a report">
-          <IconButton onClick={() => setOpen(true)}>
-            <AnnouncementIcon fontSize="large" />
-          </IconButton>
-        </Tooltip>
+        {biggerButton ? (
+          <Button
+            variant="contained"
+            onClick={() => setOpen(true)}
+            startIcon={<AnnouncementIcon />}
+          >
+            Create Report
+          </Button>
+        ) : (
+          <Tooltip title="Create a report">
+            <IconButton onClick={() => setOpen(true)}>
+              <AnnouncementIcon fontSize="large" />
+            </IconButton>
+          </Tooltip>
+        )}
       </Box>
 
-      <Dialog open={open} fullWidth={true} maxWidth={"lg"}>
+      <Dialog
+        open={open}
+        fullWidth={true}
+        maxWidth={"lg"}
+        sx={{ marginX: 1 }}
+        onClose={() => setOpen(false)}
+      >
         <form action={formAction}>
           <DialogContent sx={{ p: 1 }}>
+            {" "}
             <Stack spacing={2}>
-              <input type="hidden" name="type" value={type} />
               <Typography variant="body1" textAlign={"right"}>
                 {dayjs(Date.now()).format("DD-MM-YYYY")}
               </Typography>
@@ -111,15 +161,25 @@ export default function ReportMakingComponent({
                 label="The report"
                 defaultValue={content}
               />
+              {currentUser !== null && (
+                <>
+                  <Typography variant="body1" textAlign={"right"}>
+                    {currentUser.username}
+                  </Typography>
+                  <Typography variant="body2" textAlign={"right"}>
+                    {currentUser.email}
+                  </Typography>
+                </>
+              )}
             </Stack>
           </DialogContent>
           <DialogActions>
             <Button onClick={() => setOpen(false)}>Cancel</Button>
             <SubmitButton text="Submit" loadingText="Loading..." />
-            <StrapiErrors error={formState?.strapiErrors} />
+            {/* <StrapiErrors error={formState?.strapiErrors} />
             {formState?.message && (
               <Alert severity="error">{formState?.message}</Alert>
-            )}
+            )} */}
           </DialogActions>
         </form>
       </Dialog>

package/src/components/logistics/report/ReportsDisplay.tsx

@@ -15,23 +15,64 @@ const ReportsDisplay = ({ reports }: { reports: Report[] }) => {
         reports.map((report, index) => {
           return (
             <Grid container key={index}>
-              <Grid item xs={1}>
+              <Grid
+                item
+                xs={1}
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                }}
+              >
                 <Chip
                   label={`${report.quantity > 0 ? "+" : ""} ${report.quantity}`}
                   color={report.quantity > 0 ? "success" : "error"}
                   size="small"
                 />
               </Grid>
-              <Grid item xs={7}>
+              <Grid
+                item
+                xs={7}
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                }}
+              >
                 <MarkdownDisplay>{report.content}</MarkdownDisplay>
               </Grid>
-              <Grid item xs={2}>
+              <Grid
+                item
+                xs={2}
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                }}
+              >
                 <Typography variant="body2"> {report.date}</Typography>
               </Grid>
-              <Grid item xs={2}>
-                <Typography variant="body2" align="right">
-                  {report.author?.username ? report.author.username : "Unknown"}
-                </Typography>
+              <Grid
+                item
+                xs={2}
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "flex-start",
+                }}
+              >
+                <Stack direction="column" alignItems={"flex-end"}>
+                  {report.signature_username && (
+                    <Typography variant="body1">
+                      {report.signature_username}
+                    </Typography>
+                  )}
+                  {report.signature_username && (
+                    <Typography variant="body2">
+                      {report.signature_email}
+                    </Typography>
+                  )}
+                </Stack>
               </Grid>
 
               <Grid item xs={12}>

package/src/data/actions/logistics/note/createNoteAction.ts

@@ -28,6 +28,7 @@ export async function createNoteAction(
       ...prevState,
       strapiErrors: null,
       message: "Ops! Something went wrong. Please try again.",
+      severity: "error",
     };
   }
 
@@ -36,6 +37,7 @@ export async function createNoteAction(
       ...prevState,
       strapiErrors: responseData.error,
       message: "Failed to Create Note.",
+      severity: "error",
     };
   }
 
@@ -44,6 +46,7 @@ export async function createNoteAction(
   return {
     ...prevState,
     message: "New Note Created",
+    severity: "success",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/actions/logistics/report/createReportAction.ts

@@ -7,15 +7,16 @@ import { parseFormData } from "../../../../lib/parseFormData";
 
 export async function createReportAction(
   related: any,
+  type: string,
   prevState: any,
   formData: FormData
 ) {
   const parsedFormData = parseFormData(formData);
-
   const reportData = {
     data: {
       ...parsedFormData.data,
       related,
+      type,
     },
   };
 
@@ -46,6 +47,7 @@ export async function createReportAction(
   return {
     ...prevState,
     message: "New Report Created",
+    severity: "success",
     data: flattenedData,
     strapiErrors: null,
   };

package/src/data/loaders/e-commerce/getAllOpos.ts

@@ -13,7 +13,7 @@ async function getAllOpos(
   rowsPerPage: number,
   order: "asc" | "desc",
   orderBy: string,
-  is_archive: boolean[]
+  is_archive: boolean[] = [false] // default to both archived and non-archived OPOs
 ) {
   noStore();
 

package/src/data/loaders/e-commerce/getPaginatedCategories.ts

@@ -10,7 +10,8 @@ export async function getPaginatedCategories(
   currentPage?: number,
   rowsPerPage?: number,
   order?: "asc" | "desc",
-  orderBy?: string
+  orderBy?: string,
+  is_archive: boolean[] = [false] // default to both archived and non-archived categories
 ) {
   const url = new URL(`/api/product-categories`, baseUrl);
 
@@ -19,10 +20,16 @@ export async function getPaginatedCategories(
     currentPage,
     rowsPerPage,
     order,
-    orderBy
+    orderBy,
+    is_archive
   );
 
   url.search = qs.stringify({
+    filters: {
+      is_archive: {
+        $in: is_archive,
+      },
+    },
     populate: {
       products: {
         populate: {

package/src/data/loaders/user/getUserMeLoader.ts

@@ -0,0 +1,49 @@
+"use server";
+
+import { getAuthToken } from "../../services/get-token";
+import qs from "qs";
+import { flattenAttributes, getStrapiURL } from "../../../lib/utils";
+import { unstable_noStore as noStore } from "next/cache";
+import { User } from "@/types/user";
+
+const baseUrl = getStrapiURL();
+
+const defaultQuery = qs.stringify({
+  fields: ["id", "username", "email", "createdAt", "updatedAt"],
+});
+
+export async function getUserMeLoader(query: string = defaultQuery) {
+  noStore();
+  const url = new URL("/api/users/me", baseUrl);
+  url.search = query;
+
+  const authToken = await getAuthToken();
+  if (!authToken) return { ok: false, data: null, error: null };
+
+  try {
+    const response = await fetch(url.href, {
+      method: "GET",
+      headers: {
+        "Content-Type": "application/json",
+        Authorization: `Bearer ${authToken}`,
+      },
+      cache: "no-cache", // Ensure the response is not cached and revalidated on every render
+    });
+
+    // Check if the response status is not OK (i.e., not in the range 200-299)
+    if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+
+    const data = await response.json();
+
+    // Check if the data contains an error field
+    if (data.error) return { ok: false, data: null, error: data.error };
+
+    // If everything is fine, return the data
+    // return { ok: true, data: data, error: null };
+    const user: User = flattenAttributes(data);
+    return { ok: true, data: user, error: null };
+  } catch (error) {
+    console.error("getUserMeLoader Error:", error);
+    return { ok: false, data: null, error: error };
+  }
+}

package/src/types/logistics/Report.ts

@@ -28,6 +28,8 @@ export type Report = {
   type: ReportType;
   related: PolymorphicRelation[];
   author: any;
+  signature_username?: string; // name of the person who made the report, should be set by the cms
+  signature_email?: string; // email of the person who made the report, should be set by the cms
 };
 
 export interface ReportMakingComponentProps {
@@ -40,6 +42,7 @@ export interface ReportMakingComponentProps {
   type: ReportType;
   related?: PolymorphicRelation[]; // polymorphic relation to the parent entity
   revalidateCallback?: () => void;
+  biggerButton?: boolean; // if true, the button will be bigger
 }
 
 export interface SimpleReportFieldsProps {

package/src/types/user.ts

@@ -0,0 +1,15 @@
+import { CustomerProfileProps } from "./e-commerce/customer/types";
+import { EnduserProfileProps } from "./e-commerce/enduser/types";
+import { DispatcherProfileProps } from "./logistics/dispatcher/types";
+
+export type User = {
+  id: string;
+  username: string;
+  email: string;
+  role?: "customer" | "enduser" | "dispatcher";
+  created_at: Date;
+  updated_at: Date;
+  customer_profile?: CustomerProfileProps;
+  enduser_profile?: EnduserProfileProps;
+  dispatcher_profile?: DispatcherProfileProps;
+};