Make Tree Path searchable (#7786)

* make tree searchable by pathstring

* fix related model field colors in dark mode

* remove unused import

---------

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

src/backend/InvenTree/part/api.py

@@ -43,7 +43,6 @@ from InvenTree.mixins import (
 from InvenTree.permissions import RolePermission
 from InvenTree.serializers import EmptySerializer
 from order.status_codes import PurchaseOrderStatusGroups, SalesOrderStatusGroups
-from part.admin import PartCategoryResource, PartResource
 from stock.models import StockLocation
 
 from . import serializers as part_serializers
@@ -245,7 +244,7 @@ class CategoryList(CategoryMixin, DataExportViewMixin, ListCreateAPI):
     # Use hierarchical ordering by default
     ordering = ['tree_id', 'lft', 'name']
 
-    search_fields = ['name', 'description']
+    search_fields = ['name', 'description', 'pathstring']
 
 
 class CategoryDetail(CategoryMixin, CustomRetrieveUpdateDestroyAPI):

src/backend/InvenTree/stock/api.py

@@ -418,7 +418,7 @@ class StockLocationList(DataExportViewMixin, ListCreateAPI):
 
     filter_backends = SEARCH_ORDER_FILTER
 
-    search_fields = ['name', 'description', 'tags__name', 'tags__slug']
+    search_fields = ['name', 'description', 'pathstring', 'tags__name', 'tags__slug']
 
     ordering_fields = ['name', 'pathstring', 'items', 'level', 'tree_id', 'lft']
 

src/frontend/src/components/forms/fields/RelatedModelField.tsx

@@ -236,25 +236,23 @@ export function RelatedModelField({
   // Field doesn't follow Mantine theming
   // Define color theme to pass to field based on Mantine theme
   const theme = useMantineTheme();
-
-  const colorschema = vars.colors.primaryColors;
   const { colorScheme } = useMantineColorScheme();
 
   const colors = useMemo(() => {
     let colors: any;
     if (colorScheme === 'dark') {
       colors = {
-        neutral0: colorschema[6],
-        neutral5: colorschema[4],
-        neutral10: colorschema[4],
-        neutral20: colorschema[4],
-        neutral30: colorschema[3],
-        neutral40: colorschema[2],
-        neutral50: colorschema[1],
-        neutral60: colorschema[0],
-        neutral70: colorschema[0],
-        neutral80: colorschema[0],
-        neutral90: colorschema[0],
+        neutral0: vars.colors.dark[6],
+        neutral5: vars.colors.dark[4],
+        neutral10: vars.colors.dark[4],
+        neutral20: vars.colors.dark[4],
+        neutral30: vars.colors.dark[3],
+        neutral40: vars.colors.dark[2],
+        neutral50: vars.colors.dark[1],
+        neutral60: vars.colors.dark[0],
+        neutral70: vars.colors.dark[0],
+        neutral80: vars.colors.dark[0],
+        neutral90: vars.colors.dark[0],
         primary: vars.colors.primaryColors[7],
         primary25: vars.colors.primaryColors[6],
         primary50: vars.colors.primaryColors[5],

src/frontend/src/components/render/Instance.tsx

@@ -157,7 +157,8 @@ export function RenderInlineModel({
   labels,
   url,
   navigate,
-  showSecondary = true
+  showSecondary = true,
+  tooltip
 }: {
   primary: string;
   secondary?: string;
@@ -168,6 +169,7 @@ export function RenderInlineModel({
   labels?: string[];
   url?: string;
   navigate?: any;
+  tooltip?: string;
 }): ReactNode {
   // TODO: Handle labels
 
@@ -181,7 +183,7 @@ export function RenderInlineModel({
   );
 
   return (
-    <Group gap="xs" justify="space-between" wrap="nowrap">
+    <Group gap="xs" justify="space-between" wrap="nowrap" title={tooltip}>
       <Group gap="xs" justify="left" wrap="nowrap">
         {prefix}
         {image && <Thumbnail src={image} size={18} />}

src/frontend/src/components/render/Part.tsx

@@ -56,13 +56,18 @@ export function RenderPartCategory(
   props: Readonly<InstanceRenderInterface>
 ): ReactNode {
   const { instance } = props;
-  const lvl = '-'.repeat(instance.level || 0);
 
   return (
     <RenderInlineModel
       {...props}
-      prefix={instance.icon && <ApiIcon name={instance.icon} />}
-      primary={`${lvl} ${instance.name}`}
+      tooltip={instance.pathstring}
+      prefix={
+        <>
+          <div style={{ width: 10 * (instance.level || 0) }}></div>
+          {instance.icon && <ApiIcon name={instance.icon} />}
+        </>
+      }
+      primary={instance.name}
       secondary={instance.description}
       url={
         props.link

src/frontend/src/components/render/Stock.tsx

@@ -17,7 +17,13 @@ export function RenderStockLocation(
   return (
     <RenderInlineModel
       {...props}
-      prefix={instance.icon && <ApiIcon name={instance.icon} />}
+      tooltip={instance.pathstring}
+      prefix={
+        <>
+          <div style={{ width: 10 * (instance.level || 0) }}></div>
+          {instance.icon && <ApiIcon name={instance.icon} />}
+        </>
+      }
       primary={instance.name}
       secondary={instance.description}
       url={