diff --git a/src/App.tsx b/src/App.tsx index d6591ae..86215ac 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -10,6 +10,7 @@ import { refreshCsrfToken } from "apiClient/client"; import BaseLayout from "components/BaseLayout"; import { ApprovalsPage } from "pages/Approvals"; import { AddNewApproval } from "pages/Approvals/AddNewApproval"; +import { GearInventoryPage } from "pages/Inventory/GearInventoryPage"; import { ApproveDeskCreditPage } from "pages/OfficeHours/ApproveDeskCreditPage"; import { MyOfficeHoursHistory } from "pages/OfficeHours/MyOfficeHoursHistory"; import { OfficeHoursHistory } from "pages/OfficeHours/OfficeHoursHistory"; @@ -82,6 +83,9 @@ function App() { + + + diff --git a/src/apiClient/gear.ts b/src/apiClient/gear.ts index 6f3e208..372fc5a 100644 --- a/src/apiClient/gear.ts +++ b/src/apiClient/gear.ts @@ -58,6 +58,7 @@ export interface GearTypeWithFee extends GearTypeBase { /** The representation of a gear type in the list endpoint*/ export interface GearType extends GearTypeWithShorthand { defaultDeposit: number; + shouldInventory: boolean; } export interface GearLocation { @@ -140,10 +141,18 @@ async function editGearItem( return request(`/gear/${id}/`, "PATCH", item); } +async function editGearType( + id: number, + gearType: Partial>, +) { + return request(`/gear-types/${id}/`, "PATCH", gearType); +} + export { addNote, createGear, editGearItem, + editGearType, getGearRentalHistory, markBroken, markFixed, diff --git a/src/pages/Inventory/GearInventoryPage.tsx b/src/pages/Inventory/GearInventoryPage.tsx new file mode 100644 index 0000000..b5e70f3 --- /dev/null +++ b/src/pages/Inventory/GearInventoryPage.tsx @@ -0,0 +1,84 @@ +import { API_HOST } from "apiClient/client"; +import { editGearType, GearType } from "apiClient/gear"; +import { useSetPageTitle } from "hooks"; +import { useGetGearTypesQuery } from "redux/api"; + +export function GearInventoryPage() { + useSetPageTitle("Gear Inventory"); + const { data: allGearTypes, refetch } = useGetGearTypesQuery(); + return ( +
+

Gear inventory

+

Gear types to inventory

+
+ {allGearTypes?.map((gearType) => { + return ( +
+ +
+ ); + })} +
+

Export CSV files

+ + Export gear CSV + + +
+ ); +} + +function makeGearTypesCSV(types: GearType[]) { + return [ + ["ID", "Type Name"], + ...types.map((gearType) => [gearType.id, gearType.typeName].join(",")), + ].join("\n"); +} + +function downloadCSVFile(content: string, name: string) { + const blob = new Blob([content], { type: "text/csv" }); + const blobUrl = URL.createObjectURL(blob); + const link = document.createElement("a"); + link.href = blobUrl; + link.download = name; + document.body.appendChild(link); + link.dispatchEvent( + new MouseEvent("click", { + bubbles: true, + cancelable: true, + view: window, + }), + ); + document.body.removeChild(link); +}