diff --git a/client/src/pages/spools/list.tsx b/client/src/pages/spools/list.tsx index c1533096..d19f73f3 100644 --- a/client/src/pages/spools/list.tsx +++ b/client/src/pages/spools/list.tsx @@ -189,7 +189,7 @@ export const SpoolList: React.FC = () => { const archiveSpoolPopup = async (spool: ISpoolCollapsed) => { // If the spool has no remaining weight, archive it immediately since it's likely not a mistake - if (spool.remaining_weight && spool.remaining_weight == 0) { + if (spool.remaining_weight != undefined && spool.remaining_weight <= 0) { await archiveSpool(spool, true); } else { confirm({ diff --git a/client/src/pages/spools/show.tsx b/client/src/pages/spools/show.tsx index a94ff963..acfb27da 100644 --- a/client/src/pages/spools/show.tsx +++ b/client/src/pages/spools/show.tsx @@ -1,7 +1,7 @@ -import { PrinterOutlined } from "@ant-design/icons"; +import {InboxOutlined, PrinterOutlined, ToTopOutlined} from "@ant-design/icons"; import { DateField, NumberField, Show, TextField } from "@refinedev/antd"; -import { IResourceComponentsProps, useShow, useTranslate } from "@refinedev/core"; -import { Button, Typography } from "antd"; +import {IResourceComponentsProps, useInvalidate, useShow, useTranslate} from "@refinedev/core"; +import {Button, Modal, Typography} from "antd"; import dayjs from "dayjs"; import utc from "dayjs/plugin/utc"; import React from "react"; @@ -13,15 +13,18 @@ import { EntityType, useGetFields } from "../../utils/queryFields"; import { useCurrency } from "../../utils/settings"; import { IFilament } from "../filaments/model"; import { ISpool } from "./model"; +import {setSpoolArchived} from "./functions"; dayjs.extend(utc); const { Title } = Typography; +const { confirm } = Modal; export const SpoolShow: React.FC = () => { const t = useTranslate(); const extraFields = useGetFields(EntityType.spool); const currency = useCurrency(); + const invalidate = useInvalidate(); const { queryResult } = useShow({ liveMode: "auto", @@ -39,6 +42,37 @@ export const SpoolShow: React.FC = () => { return item.price; }; + // Function for opening an ant design modal that asks for confirmation for archiving a spool + const archiveSpool = async (spool: ISpool, archive: boolean) => { + await setSpoolArchived(spool, archive); + invalidate({ + resource: "spool", + id: spool.id, + invalidates: ["list", "detail"], + }); + }; + + const archiveSpoolPopup = async (spool: ISpool|undefined) => { + if (spool === undefined) { + return + } + // If the spool has no remaining weight, archive it immediately since it's likely not a mistake + if (spool.remaining_weight != undefined && spool.remaining_weight <= 0) { + await archiveSpool(spool, true); + } else { + confirm({ + title: t("spool.titles.archive"), + content: t("spool.messages.archive"), + okText: t("buttons.archive"), + okType: "primary", + cancelText: t("buttons.cancel"), + onOk() { + return archiveSpool(spool, true); + }, + }); + } + }; + const formatFilament = (item: IFilament) => { let vendorPrefix = ""; if (item.vendor) { @@ -82,12 +116,29 @@ export const SpoolShow: React.FC = () => { headerButtons={({ defaultButtons }) => ( <> + {record?.archived ? ( + + ) : ( + + )} + {defaultButtons} )}