refactor(silo card): changes to allow viewers to see and able to attach and detach

frontend/src/components/logistics/siloAdjustments/SiloCard.tsx

@@ -21,13 +21,28 @@ import { toast } from "sonner";
 import ChartData from "./ChartData";
 import { AttachSilo } from "./AttachSilo";
 import { DetachSilo } from "./DetachSilo";
+import { useSessionStore } from "@/lib/store/sessionStore";
+import { useModuleStore } from "@/lib/store/useModuleStore";
+import { useGetUserRoles } from "@/lib/store/useGetRoles";
 
 export default function SiloCard(data: any) {
     const token = localStorage.getItem("auth_token");
     const [submitting, setSubmitting] = useState(false);
     const { refetch } = useQuery(getStockSilo());
+    const { user } = useSessionStore();
+    const { userRoles } = useGetUserRoles();
+    const { modules } = useModuleStore();
     const silo = data.silo;
 
+    // roles that can do the silo adjustments
+    const roles = ["systemAdmin", "technician", "admin", "manager"];
+
+    const module = modules.filter((n) => n.name === "logistics");
+
+    const accessRoles = userRoles.filter(
+        (n) => n.module_id === module[0]?.module_id
+    ) as any;
+
     const form = useForm({
         defaultValues: {
             newLevel: "",
@@ -46,7 +61,7 @@ export default function SiloCard(data: any) {
                     dataToSubmit,
                     { headers: { Authorization: `Bearer ${token}` } }
                 );
-                console.log(res.data);
+                //console.log(res.data);
 
                 if (res.data.success) {
                     toast.success(res.data.message);
@@ -70,6 +85,8 @@ export default function SiloCard(data: any) {
             }
         },
     });
+
+    console.log(accessRoles);
     return (
         <LstCard>
             <div className="flex flex-row">
@@ -109,6 +126,9 @@ export default function SiloCard(data: any) {
                                 </ul>
                             </div>
                         ) : (
+                            <>
+                                {user &&
+                                    roles.includes(accessRoles[0]?.role) && (
                                         <form
                                             onSubmit={(e) => {
                                                 e.preventDefault();
@@ -137,17 +157,25 @@ export default function SiloCard(data: any) {
                                                             </div>
                                                             <div className="flex flex-row">
                                                                 <Input
-                                                        name={field.name}
+                                                                    name={
+                                                                        field.name
+                                                                    }
                                                                     value={
-                                                            field.state.value
+                                                                        field
+                                                                            .state
+                                                                            .value
                                                                     }
                                                                     onBlur={
                                                                         field.handleBlur
                                                                     }
                                                                     type="decimal"
-                                                        onChange={(e) =>
+                                                                    onChange={(
+                                                                        e
+                                                                    ) =>
                                                                         field.handleChange(
-                                                                e.target.value
+                                                                            e
+                                                                                .target
+                                                                                .value
                                                                         )
                                                                     }
                                                                 />
@@ -158,7 +186,9 @@ export default function SiloCard(data: any) {
                                                                     onClick={
                                                                         form.handleSubmit
                                                                     }
-                                                        disabled={submitting}
+                                                                    disabled={
+                                                                        submitting
+                                                                    }
                                                                 >
                                                                     {submitting ? (
                                                                         <span className="w-24">
@@ -172,7 +202,8 @@ export default function SiloCard(data: any) {
                                                                 </Button>
                                                             </div>
 
-                                                {field.state.meta.errors
+                                                            {field.state.meta
+                                                                .errors
                                                                 .length ? (
                                                                 <em>
                                                                     {field.state.meta.errors.join(
@@ -186,6 +217,8 @@ export default function SiloCard(data: any) {
                                             />
                                         </form>
                                     )}
+                            </>
+                        )}
                     </div>
                 </LstCard>
                 <div className="grow max-w-[600px]">