fix: deprecated extensions dialog wont come up again and styling tweaks

Author: abose

src/htmlContent/deprecated-extensions-dialog.html

@@ -7,7 +7,7 @@ <h1 class="dialog-title">{{Strings.DEPRECATED_EXTENSIONS_TITLE}}</h1>
 
         <div class="deprecated-extensions-list" style="margin-top: 16px;">
             {{#extensions}}
-            <div class="deprecated-extension-item" style="margin-bottom: 12px; padding: 12px; border: 1px solid var(--border-color, #ddd); border-radius: 4px;">
+            <div class="deprecated-extension-item" style="margin-bottom: 12px; padding: 12px;">
                 <div class="extension-info" style="margin-bottom: 6px;">
                     <i class="fa fa-exclamation-triangle" style="color: #f5a623; margin-right: 8px;"></i>
                     <strong>{{id}}</strong>

src/nls/root/strings.js

@@ -1725,8 +1725,8 @@ define({
     "LICENSE_REAPPLY_TO_DEVICE": "Already activated? Reapply system-wide",
     // Deprecated Extensions Dialog
     "DEPRECATED_EXTENSIONS_TITLE": "Deprecated Extensions Detected",
-    "DEPRECATED_EXTENSIONS_MESSAGE": "The following installed extensions are now natively supported by Phoenix and can be safely removed:",
-    "DEPRECATED_EXTENSIONS_LEARN_MORE": "Learn more about the native feature",
+    "DEPRECATED_EXTENSIONS_MESSAGE": "The following installed extensions are now natively supported by {APP_NAME} and can be safely uninstalled from the Extension Manager:",
+    "DEPRECATED_EXTENSIONS_LEARN_MORE": "Now built-in — learn more",
     // AI CONTROL
     "AI_LOGIN_DIALOG_TITLE": "Sign In to Use AI Edits",
     "AI_LOGIN_DIALOG_MESSAGE": "Please log in to use AI-powered edits",

src/utils/ExtensionLoader.js

@@ -1043,16 +1043,10 @@ define(function (require, exports, module) {
     }
 
     /**
-     * Check if any deprecated extensions are installed and show a dialog once
+     * Check if any deprecated extensions are installed and show a dialog once per extension
      * @private
      */
     function _checkAndShowDeprecatedExtensionsDialog() {
-        // Check if we've already shown the dialog
-        const dialogShown = PreferencesManager.stateManager.get(STATE_DEPRECATED_EXTENSIONS_DIALOG_SHOWN);
-        if (dialogShown) {
-            return;
-        }
-
         // Get deprecated extensions config
         const deprecatedExtensionsConfig = DefaultExtensions.deprecatedExtensions;
         if (!deprecatedExtensionsConfig || !deprecatedExtensionsConfig.extensionIDsAndDocs) {
@@ -1061,20 +1055,25 @@ define(function (require, exports, module) {
 
         const deprecatedExtensionIDs = deprecatedExtensionsConfig.extensionIDsAndDocs;
 
-        // Check which deprecated extensions are loaded
+        // Get the state object that tracks which deprecated extensions we've already shown
+        let shownDeprecatedExtensions = PreferencesManager.stateManager.get(STATE_DEPRECATED_EXTENSIONS_DIALOG_SHOWN);
+        if (!shownDeprecatedExtensions || typeof shownDeprecatedExtensions !== 'object') {
+            shownDeprecatedExtensions = {};
+        }
+
+        // Check which deprecated extensions are loaded and not yet shown
         const deprecatedExtensionsFound = [];
         for (const extensionID of loadedExtensionIDs) {
-            if (deprecatedExtensionIDs[extensionID]) {
+            if (deprecatedExtensionIDs[extensionID] && !shownDeprecatedExtensions[extensionID]) {
                 deprecatedExtensionsFound.push({
                     id: extensionID,
                     docUrl: deprecatedExtensionIDs[extensionID]
                 });
             }
         }
 
-        // If no deprecated extensions found, mark dialog as shown and return
+        // If no new deprecated extensions found, return
         if (deprecatedExtensionsFound.length === 0) {
-            PreferencesManager.stateManager.set(STATE_DEPRECATED_EXTENSIONS_DIALOG_SHOWN, true);
             return;
         }
 
@@ -1087,8 +1086,11 @@ define(function (require, exports, module) {
         const $template = $(Mustache.render(DeprecatedExtensionsTemplate, templateVars));
         Dialogs.showModalDialogUsingTemplate($template);
 
-        // Mark dialog as shown
-        PreferencesManager.stateManager.set(STATE_DEPRECATED_EXTENSIONS_DIALOG_SHOWN, true);
+        // Mark each extension as shown
+        for (const ext of deprecatedExtensionsFound) {
+            shownDeprecatedExtensions[ext.id] = true;
+        }
+        PreferencesManager.stateManager.set(STATE_DEPRECATED_EXTENSIONS_DIALOG_SHOWN, shownDeprecatedExtensions);
     }