feat: Add batch operations, dashboard redesign, hierarchical locations

## Batch Operations (#13)
- Add POST /spool/bulk/archive, /bulk/delete, /bulk/update endpoints
- Add row selection with checkboxes to spool list
- Add floating BatchActionBar with archive/unarchive/delete/move actions
- Add confirmation modals for all batch operations

## Dashboard Redesign (#12)
- Install recharts for pie charts
- Add AlertCards (low stock, pending jobs, needs weighing)
- Add MaterialDistributionChart (pie chart by material)
- Add QuickStats row (total spools, filaments, vendors, weight)
- Refactor home page layout with new components

## Hierarchical Locations (#9)
- Add Location model with self-referential parent relationship
- Add migration for location table and spool.location_id FK
- Add location database operations (CRUD, tree, full path)
- Add location API endpoints (list, tree, CRUD)
- Add LocationTreeSelect component with nested tree display
- Add LocationCreateModal for inline location creation
- Keep legacy location string field for backward compatibility

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

client/src/pages/spools/list.tsx

@@ -39,8 +39,9 @@ import { removeUndefined } from "../../utils/filtering";
 import { EntityType, useGetFields } from "../../utils/queryFields";
 import { TableState, useInitialTableState, useSavedState, useStoreInitialState } from "../../utils/saveload";
 import { useCurrencyFormatter } from "../../utils/settings";
-import { setSpoolArchived, useSpoolAdjustModal } from "./functions";
+import { bulkArchiveSpools, bulkDeleteSpools, bulkUpdateSpools, setSpoolArchived, useSpoolAdjustModal } from "./functions";
 import { ISpool } from "./model";
+import { BatchActionBar } from "./components/BatchActionBar";
 
 dayjs.extend(utc);
 
@@ -119,6 +120,9 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
   // State for the switch to show archived spools
   const [showArchived, setShowArchived] = useSavedState("spoolList-showArchived", false);
 
+  // State for batch selection
+  const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
+
   // Fetch data from the API
   // To provide the live updates, we use a custom solution (useLiveify) instead of the built-in refine "liveMode" feature.
   // This is because the built-in feature does not call the liveProvider subscriber with a list of IDs, but instead
@@ -211,6 +215,58 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
     }
   };
 
+  // Batch action handlers
+  const handleBatchArchive = () => {
+    confirm({
+      title: t("batch.archive_confirm"),
+      content: t("batch.archive_confirm_content", { count: selectedRowKeys.length }),
+      okText: t("buttons.archive"),
+      okType: "primary",
+      cancelText: t("buttons.cancel"),
+      async onOk() {
+        await bulkArchiveSpools(selectedRowKeys as number[], true);
+        invalidate({ resource: "spool", invalidates: ["list"] });
+        setSelectedRowKeys([]);
+      },
+    });
+  };
+
+  const handleBatchUnarchive = async () => {
+    confirm({
+      title: t("batch.unarchive_confirm"),
+      content: t("batch.unarchive_confirm_content", { count: selectedRowKeys.length }),
+      okText: t("buttons.unArchive"),
+      okType: "primary",
+      cancelText: t("buttons.cancel"),
+      async onOk() {
+        await bulkArchiveSpools(selectedRowKeys as number[], false);
+        invalidate({ resource: "spool", invalidates: ["list"] });
+        setSelectedRowKeys([]);
+      },
+    });
+  };
+
+  const handleBatchDelete = () => {
+    confirm({
+      title: t("batch.delete_confirm"),
+      content: t("batch.delete_confirm_content", { count: selectedRowKeys.length }),
+      okText: t("buttons.delete"),
+      okType: "danger",
+      cancelText: t("buttons.cancel"),
+      async onOk() {
+        await bulkDeleteSpools(selectedRowKeys as number[]);
+        invalidate({ resource: "spool", invalidates: ["list"] });
+        setSelectedRowKeys([]);
+      },
+    });
+  };
+
+  const handleBatchMove = async (location: string) => {
+    await bulkUpdateSpools(selectedRowKeys as number[], { location });
+    invalidate({ resource: "spool", invalidates: ["list"] });
+    setSelectedRowKeys([]);
+  };
+
   if (tableProps.pagination) {
     tableProps.pagination.showSizeChanger = true;
   }
@@ -339,6 +395,11 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
         scroll={{ x: "max-content" }}
         dataSource={dataSource}
         rowKey="id"
+        rowSelection={{
+          selectedRowKeys,
+          onChange: (newSelectedRowKeys) => setSelectedRowKeys(newSelectedRowKeys),
+          preserveSelectedRowKeys: true,
+        }}
         // Make archived rows greyed out
         onRow={(record) => {
           if (record.archived) {
@@ -480,6 +541,14 @@ export const SpoolList: React.FC<IResourceComponentsProps> = () => {
           ActionsColumn(t("table.actions"), actions),
         ])}
       />
+      <BatchActionBar
+        selectedIds={selectedRowKeys as number[]}
+        onArchive={handleBatchArchive}
+        onUnarchive={handleBatchUnarchive}
+        onDelete={handleBatchDelete}
+        onMove={handleBatchMove}
+        onClear={() => setSelectedRowKeys([])}
+      />
     </List>
   );
 };