UI panels fix (#10341)

* Tweak sample plugin

* Re-fetch panels when instance changes

* Unit test fix

src/backend/InvenTree/plugin/base/ui/tests.py

@@ -111,7 +111,7 @@ class UserInterfaceMixinTests(InvenTreeAPITestCase):
         # Request custom panel information for a part instance
         response = self.get(url, data=query_data)
 
-        # There should be 4 active panels for the part by default
+        # There should be 3 active panels for the part by default
         self.assertEqual(3, len(response.data))
 
         _part.active = False
@@ -119,8 +119,8 @@ class UserInterfaceMixinTests(InvenTreeAPITestCase):
 
         response = self.get(url, data=query_data)
 
-        # As the part is not active, only 3 panels left
+        # As the part is not active, only 2 panels left
-        self.assertEqual(3, len(response.data))
+        self.assertEqual(2, len(response.data))
 
         # Disable the "ENABLE_PART_PANELS" setting, and try again
         plugin.set_setting('ENABLE_PART_PANELS', False)

src/backend/InvenTree/plugin/samples/integration/user_interface_sample.py

@@ -93,13 +93,17 @@ class SampleUserInterfacePlugin(SettingsMixin, UserInterfaceMixin, InvenTreePlug
             except (Part.DoesNotExist, ValueError):
                 part = None
 
-            panels.append({
+            # Only display this panel for "active" parts
-                'key': 'part-panel',
+            if part and part.active:
-                'title': _('Part Panel'),
+                panels.append({
-                'source': self.plugin_static_file('sample_panel.js:renderPartPanel'),
+                    'key': 'part-panel',
-                'icon': 'ti:package_outline',
+                    'title': _('Part Panel'),
-                'context': {'part_name': part.name if part else ''},
+                    'source': self.plugin_static_file(
-            })
+                        'sample_panel.js:renderPartPanel'
+                    ),
+                    'icon': 'ti:package:outline',
+                    'context': {'part_name': part.name if part else ''},
+                })
 
         # Next, add a custom panel which will appear on the 'purchaseorder' page
         if target_model == 'purchaseorder' and self.get_setting(

src/frontend/src/hooks/UsePluginPanels.tsx

@@ -52,7 +52,7 @@ export function usePluginPanels({
   // API query to fetch initial information on available plugin panels
   const pluginQuery = useQuery({
     enabled: pluginPanelsEnabled && !!model && id !== undefined,
-    queryKey: ['custom-plugin-panels', model, id],
+    queryKey: ['custom-plugin-panels', model, id, instance],
     throwOnError: (error: any) => {
       console.error('ERR: Failed to fetch plugin panels');
       return false;