[plugin] Instance rendering (#10006)

* Move instance render types into @lib

- Expose type definitions

* Expose rendering function to the plugin context

src/frontend/lib/types/Plugins.tsx

@@ -6,6 +6,7 @@ import type { ModelDict } from '../enums/ModelInformation';
 import type { ModelType } from '../enums/ModelType';
 import type { ApiFormModalProps, BulkEditApiFormModalProps } from './Forms';
 import type { UseModalReturn } from './Modals';
+import type { RenderInstanceProps } from './Rendering';
 import type { SettingsStateProps } from './Settings';
 import type { UserStateProps } from './User';
 
@@ -45,6 +46,7 @@ export type InvenTreeFormsContext = {
  * @param locale - The current locale string (e.g. 'en' / 'de')
  * @param model - The model type associated with the rendered component (if applicable)
  * @param modelInformation - A dictionary of available model information
+ * @param renderInstance - A component function for rendering a model instance
  * @param id - The ID (primary key) of the model instance for the plugin (if applicable)
  * @param instance - The model instance data (if available)
  * @param reloadContent - A function which can be called to reload the plugin content
@@ -59,6 +61,7 @@ export type InvenTreePluginContext = {
   userSettings: SettingsStateProps;
   globalSettings: SettingsStateProps;
   modelInformation: ModelDict;
+  renderInstance: (props: Readonly<RenderInstanceProps>) => React.ReactNode;
   host: string;
   locale: string;
   navigate: NavigateFunction;

src/frontend/lib/types/Rendering.tsx

@@ -0,0 +1,24 @@
+import type { ModelType } from '../enums/ModelType';
+
+/**
+ * Interface for rendering a model instance.
+ */
+export interface InstanceRenderInterface {
+  instance: any;
+  link?: boolean;
+  navigate?: any;
+  showSecondary?: boolean;
+}
+
+type EnumDictionary<T extends string | symbol | number, U> = {
+  [K in T]: U;
+};
+
+export type ModelRendererDict = EnumDictionary<
+  ModelType,
+  (props: Readonly<InstanceRenderInterface>) => React.ReactNode
+>;
+
+export type RenderInstanceProps = {
+  model: ModelType | undefined;
+} & InstanceRenderInterface;

src/frontend/src/components/plugins/PluginContext.tsx

@@ -23,6 +23,7 @@ import {
   useDeleteApiFormModal,
   useEditApiFormModal
 } from '../../hooks/UseForm';
+import { RenderInstance } from '../render/Instance';
 
 export const useInvenTreeContext = () => {
   const [locale, host] = useLocalState(useShallow((s) => [s.language, s.host]));
@@ -50,6 +51,7 @@ export const useInvenTreeContext = () => {
       globalSettings: globalSettings,
       userSettings: userSettings,
       modelInformation: ModelInformationDict,
+      renderInstance: RenderInstance,
       theme: theme,
       colorScheme: colorScheme,
       forms: {

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

@@ -7,6 +7,11 @@ import { ModelInformationDict } from '@lib/enums/ModelInformation';
 import { ModelType } from '@lib/enums/ModelType';
 import { apiUrl } from '@lib/functions/Api';
 import { navigateToLink } from '@lib/functions/Navigation';
+import type {
+  ModelRendererDict,
+  RenderInstanceProps
+} from '@lib/types/Rendering';
+export type { InstanceRenderInterface } from '@lib/types/Rendering';
 import { useApi } from '../../contexts/ApiContext';
 import { shortenString } from '../../functions/tables';
 import { Thumbnail } from '../images/Thumbnail';
@@ -47,24 +52,10 @@ import {
 } from './Stock';
 import { RenderGroup, RenderOwner, RenderUser } from './User';
 
-type EnumDictionary<T extends string | symbol | number, U> = {
-  [K in T]: U;
-};
-
-export interface InstanceRenderInterface {
-  instance: any;
-  link?: boolean;
-  navigate?: any;
-  showSecondary?: boolean;
-}
-
 /**
  * Lookup table for rendering a model instance
  */
-const RendererLookup: EnumDictionary<
+export const RendererLookup: ModelRendererDict = {
-  ModelType,
-  (props: Readonly<InstanceRenderInterface>) => ReactNode
-> = {
   [ModelType.address]: RenderAddress,
   [ModelType.build]: RenderBuildOrder,
   [ModelType.buildline]: RenderBuildLine,
@@ -100,10 +91,6 @@ const RendererLookup: EnumDictionary<
   [ModelType.error]: RenderError
 };
 
-export type RenderInstanceProps = {
-  model: ModelType | undefined;
-} & InstanceRenderInterface;
-
 /**
  * Render an instance of a database model, depending on the provided data
  */