From cacfe5a268349edfb94880c09d85bf5a416fc1d7 Mon Sep 17 00:00:00 2001
From: WithoutPants <53250216+WithoutPants@users.noreply.github.com>
Date: Wed, 4 Dec 2024 14:15:32 +1100
Subject: [PATCH] Add PerformerSelect as loadable component (#5528)

* Add PerformerSelect to loadable components
* Add PerformerSelect to example plugin
---
 pkg/plugin/examples/react-component/src/testReact.tsx | 10 +++++++++-
 ui/v2.5/src/pluginApi.tsx                             |  1 +
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/pkg/plugin/examples/react-component/src/testReact.tsx b/pkg/plugin/examples/react-component/src/testReact.tsx
index c29f9c3dd16..70aba653980 100644
--- a/pkg/plugin/examples/react-component/src/testReact.tsx
+++ b/pkg/plugin/examples/react-component/src/testReact.tsx
@@ -145,11 +145,16 @@ interface IPluginApi {
   });
 
   const TestPage: React.FC = () => {
-    const componentsLoading = PluginApi.hooks.useLoadComponents([PluginApi.loadableComponents.SceneCard]);
+    const componentsToLoad = [
+      PluginApi.loadableComponents.SceneCard,
+      PluginApi.loadableComponents.PerformerSelect,
+    ];
+    const componentsLoading = PluginApi.hooks.useLoadComponents(componentsToLoad);
     
     const {
       SceneCard,
       LoadingIndicator,
+      PerformerSelect,
     } = PluginApi.components;
 
     // read a random scene and show a scene card for it
@@ -172,6 +177,9 @@ interface IPluginApi {
       <div>
         <div>This is a test page.</div>
         {!!scene && <SceneCard scene={data.findScenes.scenes[0]} />}
+        <div>
+          <PerformerSelect isMulti onSelect={() => {}} values={[]} />
+        </div>
       </div>
     );
   };
diff --git a/ui/v2.5/src/pluginApi.tsx b/ui/v2.5/src/pluginApi.tsx
index ac8fcf840ec..ddb5f487133 100644
--- a/ui/v2.5/src/pluginApi.tsx
+++ b/ui/v2.5/src/pluginApi.tsx
@@ -83,6 +83,7 @@ export const PluginApi = {
   loadableComponents: {
     // add components as needed for plugins that provide pages
     SceneCard: () => import("./components/Scenes/SceneCard"),
+    PerformerSelect: () => import("./components/Performers/PerformerSelect"),
   },
   components,
   utils: {