[PUI] Part category page (#5555)

* Replace PartIndex with CategoryDetail

- Can pass a category ID to show a single category
- Otherwise, show the top-level parts category

* Refactor <InvenTreeTable> component

- Simplify property passing
- Easier tableRefresh mechanism

* Refetch table data when base parameters change

* Correctly update pages when ID changes

* Notification panel cleanup

* Remove column from InvenTreeTableProps type

* more fancy

* Fix notification alert

* Implement useLocalStorage hook

* useLocalStorage hook for table filters too

src/frontend/src/components/tables/part/PartTable.tsx

@@ -1,16 +1,16 @@
 import { t } from '@lingui/macro';
 import { Text } from '@mantine/core';
-import { IconEdit, IconTrash } from '@tabler/icons-react';
 import { useMemo } from 'react';
 import { useNavigate } from 'react-router-dom';
 
 import { editPart } from '../../../functions/forms/PartForms';
 import { notYetImplemented } from '../../../functions/notifications';
 import { shortenString } from '../../../functions/tables';
+import { useTableRefresh } from '../../../hooks/TableRefresh';
 import { ThumbnailHoverCard } from '../../items/Thumbnail';
 import { TableColumn } from '../Column';
 import { TableFilter } from '../Filter';
-import { InvenTreeTable } from '../InvenTreeTable';
+import { InvenTreeTable, InvenTreeTableProps } from '../InvenTreeTable';
 import { RowAction } from '../RowActions';
 
 /**
@@ -26,11 +26,12 @@ function partTableColumns(): TableColumn[] {
       render: function (record: any) {
         // TODO - Link to the part detail page
         return (
-          <ThumbnailHoverCard
-            src={record.thumbnail || record.image}
-            text={record.name}
-            link=""
-          />
+          <Text>{record.full_name}</Text>
+          // <ThumbnailHoverCard
+          //   src={record.thumbnail || record.image}
+          //   text={record.name}
+          //   link=""
+          // />
         );
       }
     },
@@ -178,23 +179,17 @@ function partTableFilters(): TableFilter[] {
   ];
 }
 
-function partTableParams(params: any): any {
-  return {
-    ...params,
-    category_detail: true
-  };
-}
-
 /**
  * PartListTable - Displays a list of parts, based on the provided parameters
  * @param {Object} params - The query parameters to pass to the API
  * @returns
  */
-export function PartListTable({ params = {} }: { params?: any }) {
-  let tableParams = useMemo(() => partTableParams(params), [params]);
+export function PartListTable({ props }: { props: InvenTreeTableProps }) {
   let tableColumns = useMemo(() => partTableColumns(), []);
   let tableFilters = useMemo(() => partTableFilters(), []);
 
+  const { tableKey, refreshTable } = useTableRefresh('part');
+
   // Callback function for generating set of row actions
   function partTableRowActions(record: any): RowAction[] {
     let actions: RowAction[] = [];
@@ -227,16 +222,18 @@ export function PartListTable({ params = {} }: { params?: any }) {
   return (
     <InvenTreeTable
       url="part/"
-      enableDownload
-      tableKey="part-table"
-      printingActions={[
-        <Text onClick={notYetImplemented}>Hello</Text>,
-        <Text onClick={notYetImplemented}>World</Text>
-      ]}
-      params={tableParams}
+      tableKey={tableKey}
       columns={tableColumns}
-      customFilters={tableFilters}
-      rowActions={partTableRowActions}
+      props={{
+        ...props,
+        enableDownload: true,
+        customFilters: tableFilters,
+        rowActions: partTableRowActions,
+        params: {
+          ...props.params,
+          category_detail: true
+        }
+      }}
     />
   );
 }