feat(silo): added in charts and historical data

frontend/src/utils/querys/logistics/siloAdjustments/getAdjustments.tsx

@@ -1,14 +1,14 @@
 import { queryOptions } from "@tanstack/react-query";
 import axios from "axios";
 
-export function getStockSilo() {
+export function getAdjustments() {
     const token = localStorage.getItem("auth_token");
     return queryOptions({
-        queryKey: ["getUsers"],
+        queryKey: ["getAdjustments"],
         queryFn: () => fetchStockSilo(token),
         enabled: !!token, // Prevents query if token is null
         staleTime: 1000,
-        //refetchInterval: 2 * 2000,
+        refetchInterval: 2 * 2000,
         refetchOnWindowFocus: true,
     });
 }

frontend/src/utils/tableData/siloAdjustmentHist/siloAdjHist.tsx

@@ -0,0 +1,84 @@
+import { ColumnDef } from "@tanstack/react-table";
+import { format } from "date-fns";
+
+// This type is used to define the shape of our data.
+// You can use a Zod schema here if you want.
+export type Adjustmnets = {
+    siloAdjust_id: string;
+    currentStockLevel: string;
+    newLevel: number;
+    dateAdjusted: string;
+    lastDateAdjusted: string;
+    comment: string;
+    commentAddedBy: string;
+    commentDate: string;
+    add_user: string;
+};
+
+export const columns: ColumnDef<Adjustmnets>[] = [
+    {
+        accessorKey: "currentStockLevel",
+        header: () => <div className="text-right">Stock At Post</div>,
+    },
+    {
+        accessorKey: "newLevel",
+        header: "Level Entered",
+    },
+    {
+        accessorKey: "dateAdjusted",
+        header: "Adjustmnet",
+        cell: ({ row }) => {
+            if (row.getValue("dateAdjusted")) {
+                const correctDate = format(
+                    row.original.dateAdjusted?.replace("Z", ""),
+                    "M/d/yyyy hh:mm"
+                );
+                return (
+                    <div className="text-right font-medium">{correctDate}</div>
+                );
+            }
+        },
+    },
+    {
+        accessorKey: "lastDateAdjusted",
+        header: "Last Adjusted",
+        cell: ({ row }) => {
+            if (row.getValue("lastDateAdjusted")) {
+                const correctDate = format(
+                    row.original.lastDateAdjusted?.replace("Z", ""),
+                    "M/d/yyyy hh:mm"
+                );
+                return (
+                    <div className="text-right font-medium">{correctDate}</div>
+                );
+            }
+        },
+    },
+    {
+        accessorKey: "comment",
+        header: "Comment",
+    },
+    {
+        accessorKey: "commentAddedBy",
+        header: "Commenter ",
+    },
+    {
+        accessorKey: "commentDate",
+        header: "Comment Date ",
+        cell: ({ row }) => {
+            if (row.getValue("commentDate")) {
+                const correctDate = format(
+                    row.original.commentDate?.replace("Z", ""),
+                    "M/d/yyyy hh:mm"
+                );
+                return (
+                    <div className="text-right font-medium">{correctDate}</div>
+                );
+            }
+        },
+    },
+    {
+        accessorKey: "add_user",
+        header: "Creator",
+    },
+];

frontend/src/utils/tableData/siloAdjustmentHist/siloDate.tsx

@@ -0,0 +1,110 @@
+import {
+    ColumnDef,
+    flexRender,
+    getCoreRowModel,
+    useReactTable,
+    getPaginationRowModel,
+} from "@tanstack/react-table";
+
+import {
+    Table,
+    TableBody,
+    TableCell,
+    TableHead,
+    TableHeader,
+    TableRow,
+} from "@/components/ui/table";
+import { Button } from "@/components/ui/button";
+
+interface DataTableProps<TData, TValue> {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+}
+
+export function DataTable<TData, TValue>({
+    columns,
+    data,
+}: DataTableProps<TData, TValue>) {
+    const table = useReactTable({
+        data,
+        columns,
+        getCoreRowModel: getCoreRowModel(),
+        getPaginationRowModel: getPaginationRowModel(),
+    });
+    //console.log(data);
+    return (
+        <div className="rounded-md border w-[1028px]">
+            <div>
+                <Table>
+                    <TableHeader>
+                        {table.getHeaderGroups().map((headerGroup) => (
+                            <TableRow key={headerGroup.id}>
+                                {headerGroup.headers.map((header) => {
+                                    return (
+                                        <TableHead key={header.id}>
+                                            {header.isPlaceholder
+                                                ? null
+                                                : flexRender(
+                                                      header.column.columnDef
+                                                          .header,
+                                                      header.getContext()
+                                                  )}
+                                        </TableHead>
+                                    );
+                                })}
+                            </TableRow>
+                        ))}
+                    </TableHeader>
+                    <TableBody>
+                        {table.getRowModel().rows?.length ? (
+                            table.getRowModel().rows.map((row) => (
+                                <TableRow
+                                    key={row.id}
+                                    data-state={
+                                        row.getIsSelected() && "selected"
+                                    }
+                                >
+                                    {row.getVisibleCells().map((cell) => (
+                                        <TableCell key={cell.id}>
+                                            {flexRender(
+                                                cell.column.columnDef.cell,
+                                                cell.getContext()
+                                            )}
+                                        </TableCell>
+                                    ))}
+                                </TableRow>
+                            ))
+                        ) : (
+                            <TableRow>
+                                <TableCell
+                                    colSpan={columns.length}
+                                    className="h-24 text-center"
+                                >
+                                    No results.
+                                </TableCell>
+                            </TableRow>
+                        )}
+                    </TableBody>
+                </Table>
+            </div>
+            <div className="flex items-center justify-end space-x-2 py-4">
+                <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => table.previousPage()}
+                    disabled={!table.getCanPreviousPage()}
+                >
+                    Previous
+                </Button>
+                <Button
+                    variant="outline"
+                    size="sm"
+                    onClick={() => table.nextPage()}
+                    disabled={!table.getCanNextPage()}
+                >
+                    Next
+                </Button>
+            </div>
+        </div>
+    );
+}