[TMP] Plugins system.

src-ui/app/main_page/main_section/MainSection.jsx

@@ -9,12 +9,16 @@ import { useStore_IsOpenedLanguageSelector } from "@store";
 import { useLanguageSettings } from "@logics_main";
 import { useEffect } from "react";
 import { SubtitleSystemContainer } from "./subtitle_system_container/SubtitleSystemContainer";
+
+import { PluginHost } from "./PluginHost";
+
 export const MainSection = () => {
 
     return (
         <div className={styles.container}>
             <TopBar />
-            <SubtitleSystemContainer />
+            {/* <SubtitleSystemContainer /> */}
+            <PluginHost />
             {/* <MessageContainer /> */}
             <HandleLanguageSelector />
         </div>

src-ui/app/main_page/main_section/PluginHost.jsx

@@ -0,0 +1,20 @@
+// PluginHost.jsx
+import React from "react";
+import { useStore_LoadedPluginsList } from "@store";
+
+// export const PluginHost = ({ location }) => {
+export const PluginHost = () => {
+    const { currentLoadedPluginsList } = useStore_LoadedPluginsList();
+    console.log(currentLoadedPluginsList.data);
+
+    return (
+        <div>
+            {currentLoadedPluginsList.data
+                .filter((plugin) => plugin.location === "main_section")
+                .map((plugin, index) => {
+                    const PluginComponent = plugin.component;
+                    return PluginComponent ? <PluginComponent key={index} /> : null;
+                })}
+        </div>
+    );
+};