feat(frontend): Print logs with plugin version if available

Author: ynhhoJ

frontend/src/components/settings/pages/plugin_list/index.tsx

@@ -23,6 +23,7 @@ import {
   requestPluginInstall,
 } from '../../../../store';
 import { useSetting } from '../../../../utils/hooks/useSetting';
+import { getPluginDisplayName } from '../../../../utils/pluginHelpers';
 import { useDeckyState } from '../../../DeckyState';
 import PluginListLabel from './PluginListLabel';
 
@@ -69,7 +70,7 @@ function PluginInteractables(props: { entry: ReorderableEntry<PluginTableData> }
               try {
                 await reloadPluginBackend(name);
               } catch (err) {
-                console.error('Error Reloading Plugin Backend', err);
+                console.error(`Error Reloading Plugin Backend for ${getPluginDisplayName(name, version)}`, err);
               }
             }}
           >

frontend/src/plugin-loader.tsx

@@ -38,6 +38,7 @@ import { checkForPluginUpdates } from './store';
 import TabsHook from './tabs-hook';
 import Toaster from './toaster';
 import { getVersionInfo } from './updater';
+import { getPluginDisplayName } from './utils/pluginHelpers';
 import { getSetting, setSetting } from './utils/settings';
 import TranslationHelper, { TranslationClass } from './utils/TranslationHelper';
 
@@ -343,7 +344,7 @@ class PluginLoader extends Logger {
 
   public dismountAll() {
     for (const plugin of this.plugins) {
-      this.log(`Dismounting ${plugin.name}`);
+      this.log(`Dismounting ${getPluginDisplayName(plugin.name, plugin.version)}`);
       plugin.onDismount?.();
     }
   }
@@ -403,14 +404,14 @@ class PluginLoader extends Logger {
     timeoutMS?: number,
   ) {
     if (useQueue && this.reloadLock) {
-      this.log('Reload currently in progress, adding to queue', name);
+      this.log(`Reload currently in progress, adding ${getPluginDisplayName(name, version)} to queue`);
       this.pluginReloadQueue.push({ name, version: version, loadType });
       return;
     }
 
     try {
       if (useQueue) this.reloadLock = true;
-      this.log(`Trying to load ${name}`);
+      this.log(`Trying to load ${getPluginDisplayName(name, version)}`);
 
       this.unloadPlugin(name, true);
       const startTime = performance.now();
@@ -420,7 +421,7 @@ class PluginLoader extends Logger {
 
       this.deckyState.setDisabledPlugins(this.deckyState.publicState().disabledPlugins.filter((d) => d.name !== name));
       this.deckyState.setPlugins(this.plugins);
-      this.log(`Loaded ${name} in ${endTime - startTime}ms`);
+      this.log(`Loaded ${getPluginDisplayName(name, version)} in ${endTime - startTime}ms`);
     } catch (e) {
       throw e;
     } finally {
@@ -502,16 +503,17 @@ class PluginLoader extends Logger {
               version: version,
               loadType,
             });
-          } else throw new Error(`${name} frontend_bundle not OK`);
+          } else throw new Error(`${getPluginDisplayName(name, version)} frontend_bundle not OK`);
           break;
 
         default:
-          throw new Error(`${name} has no defined loadType.`);
+          throw new Error(`${getPluginDisplayName(name, version)} has no defined loadType.`);
       }
     } catch (e) {
       if (e === timeoutException) throw timeoutException;
 
-      this.error('Error loading plugin ' + name, e);
+      this.error(`Error loading plugin ${getPluginDisplayName(name, version)}`, e);
+
       const TheError: FC<{}> = () => (
         <PanelSection>
           <PanelSectionRow>
@@ -731,7 +733,8 @@ class PluginLoader extends Logger {
           backendAPI.useQuickAccessVisible = useQuickAccessVisible;
         }
 
-        this.debug(`${pluginName} connected to loader API.`);
+        // Note: version info not available at connection time
+        this.debug(`Plugin ${pluginName} connected to loader API.`);
         return backendAPI;
       },
     };

frontend/src/utils/pluginHelpers.ts

@@ -0,0 +1,14 @@
+/**
+ * Returns a formatted display name for a plugin with version if available
+ * @param name - The plugin name
+ * @param version - The optional plugin version
+ *
+ * @returns Formatted string like "PluginName (v1.2.3)" or just "PluginName" if version is undefined
+ */
+export function getPluginDisplayName(name: string, version?: string): string {
+  if (version) {
+    return `${name} (v${version})`;
+  }
+
+  return name;
+}