From 345fe1d67ecfa85c5c1bd8dfba4e97aff5fea38b Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Mon, 8 Jun 2026 13:51:21 +1000
Subject: [PATCH] Calendar tweaks (#12115)

* Support initial filters for UseCalendar

* [UI] Calendar updates

- Allow calendars to display completed / cancelled items also
---
 src/frontend/src/components/calendar/OrderCalendar.tsx | 5 ++++-
 src/frontend/src/hooks/UseCalendar.tsx                 | 8 +++++---
 src/frontend/src/pages/build/BuildIndex.tsx            | 3 ++-
 src/frontend/src/pages/purchasing/PurchasingIndex.tsx  | 3 ++-
 src/frontend/src/pages/sales/SalesIndex.tsx            | 6 ++++--
 src/frontend/src/pages/stock/LocationDetail.tsx        | 3 ++-
 6 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/frontend/src/components/calendar/OrderCalendar.tsx b/src/frontend/src/components/calendar/OrderCalendar.tsx
index 36923e48e2..0f468a7041 100644
--- a/src/frontend/src/components/calendar/OrderCalendar.tsx
+++ b/src/frontend/src/components/calendar/OrderCalendar.tsx
@@ -47,12 +47,14 @@ export default function OrderCalendar({
   role,
   params,
   filters,
+  initialFilters,
   tooltip
 }: {
   model: ModelType;
   role: UserRoles;
   params: Record<string, any>;
   filters?: TableFilter[];
+  initialFilters?: TableFilter[];
   tooltip?: (event: EventContentArg) => React.ReactNode;
 }) {
   const navigate = useNavigate();
@@ -94,7 +96,8 @@ export default function OrderCalendar({
   const calendarState = useCalendar({
     endpoint: modelInfo.api_endpoint,
     name: model.toString(),
-    queryParams: params
+    queryParams: params,
+    initialFilters: initialFilters
   });
 
   // Build the events
diff --git a/src/frontend/src/hooks/UseCalendar.tsx b/src/frontend/src/hooks/UseCalendar.tsx
index 2f7ec5b226..ec1d32c7ab 100644
--- a/src/frontend/src/hooks/UseCalendar.tsx
+++ b/src/frontend/src/hooks/UseCalendar.tsx
@@ -2,7 +2,7 @@ import type FullCalendar from '@fullcalendar/react';
 import type { ApiEndpoints } from '@lib/enums/ApiEndpoints';
 import { apiUrl } from '@lib/functions/Api';
 import useFilterSet from '@lib/hooks/UseFilterSet';
-import type { FilterSetState } from '@lib/types/Filters';
+import type { FilterSetState, TableFilter } from '@lib/types/Filters';
 import type { UseModalReturn } from '@lib/types/Modals';
 import type { DateValue } from '@mantine/dates';
 import { type UseQueryResult, useQuery } from '@tanstack/react-query';
@@ -54,15 +54,17 @@ export type CalendarState = {
 export default function useCalendar({
   name,
   endpoint,
-  queryParams
+  queryParams,
+  initialFilters
 }: {
   name: string;
   endpoint: ApiEndpoints;
   queryParams?: any;
+  initialFilters?: TableFilter[];
 }): CalendarState {
   const ref = useRef<FullCalendar>(null as any);
 
-  const filterSet = useFilterSet(`calendar-${name}`);
+  const filterSet = useFilterSet(`calendar-${name}`, initialFilters);
 
   const [searchTerm, setSearchTerm] = useState<string>('');
 
diff --git a/src/frontend/src/pages/build/BuildIndex.tsx b/src/frontend/src/pages/build/BuildIndex.tsx
index f52441923d..43456c6138 100644
--- a/src/frontend/src/pages/build/BuildIndex.tsx
+++ b/src/frontend/src/pages/build/BuildIndex.tsx
@@ -48,8 +48,9 @@ function BuildOrderCalendar() {
     <OrderCalendar
       model={ModelType.build}
       role={UserRoles.build}
-      params={{ outstanding: true, part_detail: true }}
+      params={{ part_detail: true }}
       filters={calendarFilters}
+      initialFilters={[{ name: 'outstanding', value: 'true' }]}
       tooltip={renderTooltip}
     />
   );
diff --git a/src/frontend/src/pages/purchasing/PurchasingIndex.tsx b/src/frontend/src/pages/purchasing/PurchasingIndex.tsx
index bdaa271c0e..8e8887144e 100644
--- a/src/frontend/src/pages/purchasing/PurchasingIndex.tsx
+++ b/src/frontend/src/pages/purchasing/PurchasingIndex.tsx
@@ -51,8 +51,9 @@ function PurchaseOrderCalendar() {
     <OrderCalendar
       model={ModelType.purchaseorder}
       role={UserRoles.purchase_order}
-      params={{ outstanding: true, supplier_detail: true }}
+      params={{ supplier_detail: true }}
       filters={calendarFilters}
+      initialFilters={[{ name: 'outstanding', value: 'true' }]}
       tooltip={renderTooltip}
     />
   );
diff --git a/src/frontend/src/pages/sales/SalesIndex.tsx b/src/frontend/src/pages/sales/SalesIndex.tsx
index 0f1c0879b0..447229a747 100644
--- a/src/frontend/src/pages/sales/SalesIndex.tsx
+++ b/src/frontend/src/pages/sales/SalesIndex.tsx
@@ -49,8 +49,9 @@ function SalesOrderCalendar() {
     <OrderCalendar
       model={ModelType.salesorder}
       role={UserRoles.sales_order}
-      params={{ outstanding: true, customer_detail: true }}
+      params={{ customer_detail: true }}
       filters={calendarFilters}
+      initialFilters={[{ name: 'outstanding', value: 'true' }]}
       tooltip={renderTooltip}
     />
   );
@@ -73,8 +74,9 @@ const ReturnOrderCalendar = () => {
     <OrderCalendar
       model={ModelType.returnorder}
       role={UserRoles.return_order}
-      params={{ outstanding: true, customer_detail: true }}
+      params={{ customer_detail: true }}
       filters={calendarFilters}
+      initialFilters={[{ name: 'outstanding', value: 'true' }]}
       tooltip={renderTooltip}
     />
   );
diff --git a/src/frontend/src/pages/stock/LocationDetail.tsx b/src/frontend/src/pages/stock/LocationDetail.tsx
index eef0eb6e0b..5fbab60d46 100644
--- a/src/frontend/src/pages/stock/LocationDetail.tsx
+++ b/src/frontend/src/pages/stock/LocationDetail.tsx
@@ -70,8 +70,9 @@ function TransferOrderCalendar() {
     <OrderCalendar
       model={ModelType.transferorder}
       role={UserRoles.transfer_order}
-      params={{ outstanding: true }}
+      params={{}}
       filters={calendarFilters}
+      initialFilters={[{ name: 'outstanding', value: 'true' }]}
     />
   );
 }