Build required widget (#8610)

* Implement "required for build orders" dashboard widget

* Allow dashboard widges to be optionally disabled

* Fix for enabled check

src/frontend/src/components/dashboard/DashboardWidget.tsx

@@ -15,6 +15,7 @@ export interface DashboardWidgetProps {
   label: string;
   title: string;
   description: string;
+  enabled?: boolean;
   minWidth?: number;
   minHeight?: number;
   render: () => JSX.Element;
@@ -35,12 +36,9 @@ export default function DashboardWidget({
   removing: boolean;
   onRemove: () => void;
 }>) {
-  // TODO: Implement visibility check
-  //     if (!props?.visible?.() == false) {
-  //     return null;
-  //   }
-
-  // TODO: Add button to remove widget (if "editing")
+  if (item.enabled == false) {
+    return null;
+  }
 
   return (
     <Paper withBorder key={item.label} shadow='sm' p='xs'>

src/frontend/src/components/dashboard/DashboardWidgetLibrary.tsx

@@ -1,6 +1,7 @@
 import { t } from '@lingui/macro';
 
 import { ModelType } from '../../enums/ModelType';
+import { useGlobalSettingsState } from '../../states/SettingsState';
 import type { DashboardWidgetProps } from './DashboardWidget';
 import ColorToggleDashboardWidget from './widgets/ColorToggleWidget';
 import GetStartedWidget from './widgets/GetStartedWidget';
@@ -13,6 +14,8 @@ import QueryCountDashboardWidget from './widgets/QueryCountDashboardWidget';
  * @returns A list of built-in dashboard widgets which display the number of results for a particular query
  */
 export function BuiltinQueryCountWidgets(): DashboardWidgetProps[] {
+  const globalSettings = useGlobalSettingsState.getState();
+
   return [
     QueryCountDashboardWidget({
       label: 'sub-prt',
@@ -38,22 +41,28 @@ export function BuiltinQueryCountWidgets(): DashboardWidgetProps[] {
       modelType: ModelType.part,
       params: { low_stock: true, active: true }
     }),
-    // TODO: Required for build orders
+    QueryCountDashboardWidget({
+      title: t`Required for Build Orders`,
+      label: 'bld-req',
+      description: t`Show parts which are required for active build orders`,
+      modelType: ModelType.part,
+      params: { stock_to_build: true }
+    }),
     QueryCountDashboardWidget({
       title: t`Expired Stock Items`,
       label: 'exp-stk',
       description: t`Show the number of stock items which have expired`,
       modelType: ModelType.stockitem,
-      params: { expired: true }
-      // TODO: Hide if expiry is disabled
+      params: { expired: true },
+      enabled: globalSettings.isSet('STOCK_ENABLE_EXPIRY')
     }),
     QueryCountDashboardWidget({
       title: t`Stale Stock Items`,
       label: 'stl-stk',
       description: t`Show the number of stock items which are stale`,
       modelType: ModelType.stockitem,
-      params: { stale: true }
-      // TODO: Hide if expiry is disabled
+      params: { stale: true },
+      enabled: globalSettings.isSet('STOCK_ENABLE_EXPIRY')
     }),
     QueryCountDashboardWidget({
       title: t`Active Build Orders`,

src/frontend/src/components/dashboard/widgets/QueryCountDashboardWidget.tsx

@@ -102,18 +102,21 @@ export default function QueryCountDashboardWidget({
   title,
   description,
   modelType,
+  enabled = true,
   params
 }: {
   label: string;
   title: string;
   description: string;
   modelType: ModelType;
+  enabled?: boolean;
   params: any;
 }): DashboardWidgetProps {
   return {
     label: label,
     title: title,
     description: description,
+    enabled: enabled,
     minWidth: 2,
     minHeight: 1,
     render: () => (

src/frontend/src/hooks/UseDashboardItems.tsx

@@ -93,7 +93,9 @@ export function useDashboardItems(): DashboardLibraryProps {
   }, [pluginQuery, inventreeContext]);
 
   const items: DashboardWidgetProps[] = useMemo(() => {
-    return [...builtin, ...pluginDashboardItems];
+    const widgets = [...builtin, ...pluginDashboardItems];
+
+    return widgets.filter((item) => item.enabled ?? true);
   }, [builtin, pluginDashboardItems]);
 
   const loaded: boolean = useMemo(() => {