Feature: Auto-select items tab for final stock locations (#11766) (#11955)

* Enhance: Auto-select items tab for final stock locations/categories

* Fix biome formatting in PanelGroup.tsx

* Change default setting to False per review

* Refactor: Rename setting to DISPLAY_ITEMS_FINAL_LEVEL to apply generically to both locations and categories per review

---------

Co-authored-by: Oliver <oliver.henry.walters@gmail.com>

docs/docs/settings/user.md

@@ -30,6 +30,7 @@ The *Display Settings* screen shows general display configuration options:
 {{ usersetting("SHOW_BOM_SUBASSEMBLY_LEVELS")}}
 {{ usersetting("ENABLE_LAST_BREADCRUMB") }}
 {{ usersetting("SHOW_FULL_LOCATION_IN_TABLES") }}
+{{ usersetting("DISPLAY_ITEMS_FINAL_LEVEL") }}
 
 ### Search Settings
 

src/backend/InvenTree/common/setting/user.py

@@ -268,4 +268,12 @@ USER_SETTINGS: dict[str, InvenTreeSettingsKeyType] = {
         'description': _('Save the last used printing machines for a user'),
         'default': '',
     },
+    'DISPLAY_ITEMS_FINAL_LEVEL': {
+        'name': _('Display Items at Final Level'),
+        'description': _(
+            'Automatically default to showing items/parts instead of sub-levels for locations or categories with no children'
+        ),
+        'default': False,
+        'validator': bool,
+    },
 }

src/frontend/src/components/panels/PanelGroup.tsx

@@ -79,6 +79,7 @@ export type PanelProps = {
   model?: ModelType;
   id?: number | null;
   selectedPanel?: string;
+  defaultPanel?: string;
   onPanelChange?: (panel: string) => void;
   collapsible?: boolean;
   pluginPanelWithoutId?: boolean;
@@ -483,12 +484,16 @@ function getPanelContent(
 function IndexPanelComponent({
   pageKey,
   selectedPanel,
+  defaultPanel,
   panels
 }: Readonly<PanelProps>) {
   const lastUsedPanel = useLocalState(
     useShallow((state) => {
       const panelName =
-        selectedPanel || state.lastUsedPanels[pageKey] || panels[0]?.name;
+        selectedPanel ||
+        defaultPanel ||
+        state.lastUsedPanels[pageKey] ||
+        panels[0]?.name;
 
       const panel = panels.findIndex(
         (p) => p.name === panelName && !p.disabled && !p.hidden

src/frontend/src/pages/part/CategoryDetail.tsx

@@ -42,6 +42,7 @@ import {
   useEditApiFormModal
 } from '../../hooks/UseForm';
 import { useInstance } from '../../hooks/UseInstance';
+import { useUserSettingsState } from '../../states/SettingsStates';
 import { useUserState } from '../../states/UserState';
 import ParametricPartTable from '../../tables/part/ParametricPartTable';
 import { PartCategoryTable } from '../../tables/part/PartCategoryTable';
@@ -63,6 +64,7 @@ export default function CategoryDetail() {
 
   const navigate = useNavigate();
   const user = useUserState();
+  const settings = useUserSettingsState();
 
   const [treeOpen, setTreeOpen] = useState(false);
 
@@ -344,6 +346,17 @@ export default function CategoryDetail() {
     [category]
   );
 
+  const defaultPanel = useMemo(() => {
+    if (
+      settings.isSet('DISPLAY_ITEMS_FINAL_LEVEL', true) &&
+      category.pk &&
+      category.subcategories === 0
+    ) {
+      return 'parts';
+    }
+    return undefined;
+  }, [settings, category]);
+
   return (
     <>
       {editCategory.modal}
@@ -385,6 +398,7 @@ export default function CategoryDetail() {
             instance={category}
             reloadInstance={refreshInstance}
             id={category.pk ?? null}
+            defaultPanel={defaultPanel}
           />
         </Stack>
       </InstanceDetail>

src/frontend/src/pages/stock/LocationDetail.tsx

@@ -47,6 +47,7 @@ import {
 } from '../../hooks/UseForm';
 import { useInstance } from '../../hooks/UseInstance';
 import { useStockAdjustActions } from '../../hooks/UseStockAdjustActions';
+import { useUserSettingsState } from '../../states/SettingsStates';
 import { useUserState } from '../../states/UserState';
 import { PartListTable } from '../../tables/part/PartTable';
 import { StockItemTable } from '../../tables/stock/StockItemTable';
@@ -63,6 +64,7 @@ export default function Stock() {
 
   const navigate = useNavigate();
   const user = useUserState();
+  const settings = useUserSettingsState();
 
   const [treeOpen, setTreeOpen] = useState(false);
 
@@ -431,6 +433,17 @@ export default function Stock() {
     [location]
   );
 
+  const defaultPanel = useMemo(() => {
+    if (
+      settings.isSet('DISPLAY_ITEMS_FINAL_LEVEL', true) &&
+      location.pk &&
+      location.sublocations === 0
+    ) {
+      return 'stock-items';
+    }
+    return undefined;
+  }, [settings, location]);
+
   return (
     <>
       {editLocation.modal}
@@ -479,6 +492,7 @@ export default function Stock() {
             id={location?.pk}
             instance={location}
             pluginPanelWithoutId
+            defaultPanel={defaultPanel}
           />
         </Stack>
         {stockAdjustActions.modals.map((modal) => modal.modal)}