Pop out console when plugin install error happens

Author: deep1401

src/renderer/components/MainAppPanel.tsx

@@ -472,7 +472,12 @@ export default function MainAppPanel({
         />
         <Route
           path="/plugins"
-          element={<Plugins experimentInfo={experimentInfo} />}
+          element={
+            <Plugins
+              experimentInfo={experimentInfo}
+              setLogsDrawerOpen={setLogsDrawerOpen}
+            />
+          }
         />
         <Route
           path="/plugins/:pluginName"

src/renderer/components/Plugins/LocalPlugins.tsx

@@ -18,7 +18,10 @@ import NewPluginModal from './NewPluginModal';
 
 const fetcher = (url) => fetch(url).then((res) => res.json());
 
-export default function LocalPlugins({ experimentInfo }) {
+export default function LocalPlugins({
+  experimentInfo,
+  setLogsDrawerOpen = null,
+}) {
   const [newPluginModalOpen, setNewPluginModalOpen] = useState(false);
 
   const { data, error, isLoading, mutate } = useSWR(
@@ -77,6 +80,7 @@ export default function LocalPlugins({ experimentInfo }) {
                 download={undefined}
                 experimentInfo={experimentInfo}
                 machineType={device}
+                setLogsDrawerOpen={setLogsDrawerOpen}
               />
             </Grid>
           ))}

src/renderer/components/Plugins/PluginCard.tsx

@@ -83,6 +83,7 @@ export default function PluginCard({
   parentMutate,
   experimentInfo = {},
   machineType,
+  setLogsDrawerOpen = null,
 }) {
   const [installing, setInstalling] = useState(null);
 
@@ -134,7 +135,7 @@ export default function PluginCard({
           {/* {JSON.stringify(plugin)} */}
           <Typography
             level="title-lg"
-          // startDecorator={getIcon(type)}
+            // startDecorator={getIcon(type)}
           >
             <b>
               {plugin.name}&nbsp;
@@ -239,18 +240,22 @@ export default function PluginCard({
                   experimentInfo?.id,
                   plugin.uniqueId,
                 ),
-              ).then(async response => {
+              ).then(async (response) => {
                 if (response.ok) {
                   const responseBody = await response.json();
                   console.log('Response Body:', responseBody);
                   if (responseBody?.status == 'error') {
-                    /*if (setLogsDrawerOpen) {
+                    alert(
+                      `Failed to install plugin:\n${responseBody?.message}`,
+                    );
+                    if (setLogsDrawerOpen) {
                       setLogsDrawerOpen(true);
-                    }*/
-                    alert(`Failed to install plugin:\n${responseBody?.message}`);
+                    }
                   }
                 } else {
-                  alert("Error: The API did not return a response. Plugin installation failed.");
+                  alert(
+                    'Error: The API did not return a response. Plugin installation failed.',
+                  );
                 }
               });
               setInstalling(null);

src/renderer/components/Plugins/PluginGallery.tsx

@@ -22,7 +22,10 @@ import PluginCard from './PluginCard';
 
 const fetcher = (url) => fetch(url).then((res) => res.json());
 
-export default function PluginGallery({ experimentInfo }) {
+export default function PluginGallery({
+  experimentInfo,
+  setLogsDrawerOpen = null,
+}) {
   const { data, error, isLoading, mutate } = useSWR(
     chatAPI.Endpoints.Plugins.Gallery(),
     fetcher,
@@ -187,6 +190,7 @@ export default function PluginGallery({ experimentInfo }) {
                       experimentInfo={experimentInfo}
                       parentMutate={mutate}
                       machineType={device}
+                      setLogsDrawerOpen={setLogsDrawerOpen}
                     />
                   </Grid>
                 ))}
@@ -220,6 +224,7 @@ export default function PluginGallery({ experimentInfo }) {
                           experimentInfo={experimentInfo}
                           parentMutate={mutate}
                           machineType={device}
+                          setLogsDrawerOpen={setLogsDrawerOpen}
                         />
                       </Box>
                     </Grid>

src/renderer/components/Plugins/Plugins.tsx

@@ -18,7 +18,7 @@ import PluginGallery from './PluginGallery';
 import LocalPlugins from './LocalPlugins';
 import OneTimePopup from '../Shared/OneTimePopup';
 
-export default function Plugins({ experimentInfo }) {
+export default function Plugins({ experimentInfo, setLogsDrawerOpen = null }) {
   const { data: outdatedPlugins, mutate: outdatePluginsMutate } =
     usePluginStatus(experimentInfo);
   const [installing, setInstalling] = useState(null);
@@ -114,7 +114,10 @@ export default function Plugins({ experimentInfo }) {
           <Sheet
             sx={{ display: 'flex', flexDirection: 'column', height: '100%' }}
           >
-            <LocalPlugins experimentInfo={experimentInfo} />
+            <LocalPlugins
+              experimentInfo={experimentInfo}
+              setLogsDrawerOpen={setLogsDrawerOpen}
+            />
           </Sheet>
         </TabPanel>
         <TabPanel
@@ -128,7 +131,10 @@ export default function Plugins({ experimentInfo }) {
           <Sheet
             sx={{ display: 'flex', flexDirection: 'column', height: '100%' }}
           >
-            <PluginGallery experimentInfo={experimentInfo} />
+            <PluginGallery
+              experimentInfo={experimentInfo}
+              setLogsDrawerOpen={setLogsDrawerOpen}
+            />
           </Sheet>
         </TabPanel>
       </Tabs>