umwd-components 0.1.686 → 0.1.687

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/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;

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.687",
   "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,13 +385,15 @@ 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}
+                />
+              </Stack>
             </Stack>
           </Grid>
           <Grid item xs={12}>

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,
@@ -40,9 +41,17 @@ export default function ReportMakingComponent({
 }: 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,11 +59,35 @@ 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 (
     <>
@@ -69,8 +102,8 @@ export default function ReportMakingComponent({
       <Dialog open={open} fullWidth={true} maxWidth={"lg"}>
         <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,6 +144,16 @@ 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>

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/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/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 {

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;
+};