[plugin] Library updates (#10070)

* Expose lingui modules to plugins

* Add i18n object to plugin context

* Expose form types

* Update package.json requirements

* Externalize react and mantine when building @inventreedb/ui components

* Externalize lingui packages too

* Extern <AddItemButton />

src/frontend/lib/components/AddItemButton.tsx

@@ -0,0 +1,10 @@
+import { IconPlus } from '@tabler/icons-react';
+
+import { ActionButton, type ActionButtonProps } from './ActionButton';
+
+/**
+ * A generic icon button which is used to add or create a new item
+ */
+export function AddItemButton(props: Readonly<ActionButtonProps>) {
+  return <ActionButton {...props} color='green' icon={<IconPlus />} />;
+}

src/frontend/lib/functions/Plugins.tsx

@@ -16,3 +16,14 @@ export function checkPluginVersion(context: InvenTreePluginContext) {
     );
   }
 }
+
+/**
+ * Helper function to initialize the plugin context.
+ */
+export function initPlugin(context: InvenTreePluginContext) {
+  // Check that the plugin version matches the expected version
+  checkPluginVersion(context);
+
+  // Activate the i18n context for the current locale
+  context.i18n?.activate?.(context.locale);
+}

src/frontend/lib/index.ts

@@ -15,6 +15,16 @@ export { UserRoles, UserPermissions } from './enums/Roles';
 export type { InvenTreePluginContext } from './types/Plugins';
 export type { RowAction, RowViewProps } from './types/Tables';
 
+export type {
+  ApiFormFieldChoice,
+  ApiFormFieldHeader,
+  ApiFormFieldType,
+  ApiFormFieldSet,
+  ApiFormProps,
+  ApiFormModalProps,
+  BulkEditApiFormModalProps
+} from './types/Forms';
+
 // Common utility functions
 export { apiUrl } from './functions/Api';
 export {
@@ -22,7 +32,10 @@ export {
   getDetailUrl,
   navigateToLink
 } from './functions/Navigation';
-export { checkPluginVersion } from './functions/Plugins';
+export {
+  checkPluginVersion,
+  initPlugin
+} from './functions/Plugins';
 
 export {
   formatCurrencyValue,
@@ -31,7 +44,11 @@ export {
 } from './functions/Formatting';
 
 // Common UI components
-export { ActionButton } from './components/ActionButton';
+export {
+  ActionButton,
+  type ActionButtonProps
+} from './components/ActionButton';
+export { AddItemButton } from './components/AddItemButton';
 export { ButtonMenu } from './components/ButtonMenu';
 export { ProgressBar } from './components/ProgressBar';
 export { PassFailButton, YesNoButton } from './components/YesNoButton';

src/frontend/lib/types/Plugins.tsx

@@ -1,3 +1,4 @@
+import type { I18n } from '@lingui/core';
 import type { MantineColorScheme, MantineTheme } from '@mantine/core';
 import type { QueryClient } from '@tanstack/react-query';
 import type { AxiosInstance } from 'axios';
@@ -43,6 +44,7 @@ export type InvenTreeFormsContext = {
  * @param theme - The current Mantine theme
  * @param colorScheme - The current Mantine color scheme (e.g. 'light' / 'dark')
  * @param host - The current host URL
+ * @param i18n - The i18n instance for translations (from @lingui/core)
  * @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
@@ -63,6 +65,7 @@ export type InvenTreePluginContext = {
   modelInformation: ModelDict;
   renderInstance: (props: Readonly<RenderInstanceProps>) => React.ReactNode;
   host: string;
+  i18n: I18n;
   locale: string;
   navigate: NavigateFunction;
   theme: MantineTheme;