chore: wire in entitlements

abose · abose · commit e94c7b585271 · 2026-02-23T21:42:37.000+05:30
diff --git a/src/core-ai/AIChatPanel.js b/src/core-ai/AIChatPanel.js
@@ -41,6 +41,9 @@ define(function (require, exports, module) {
         StringUtils         = require("utils/StringUtils"),
         marked              = require("thirdparty/marked.min");
 
+    // Capture at module load time — window.KernalModeTrust is deleted before extensions load
+    const _KernalModeTrust = window.KernalModeTrust;
+
     let _nodeConnector = null;
     let _isStreaming = false;
     let _queuedMessage = null;  // text queued by user while AI is streaming
@@ -86,6 +89,7 @@ define(function (require, exports, module) {
 
     // DOM references
     let $panel, $messages, $status, $statusText, $textarea, $sendBtn, $stopBtn, $imagePreview;
+    let $aiTabContainer = null;
 
     // Live DOM query for $messages — the cached $messages reference can become stale
     // after SidebarTabs reparents the panel. Use this for any deferred operations
@@ -148,6 +152,7 @@ define(function (require, exports, module) {
                 '<div class="ai-unavailable-message">' +
                     Strings.AI_CHAT_DESKTOP_ONLY +
                 '</div>' +
+                '<button class="ai-upsell-btn ai-download-btn">' + Strings.AI_CHAT_DOWNLOAD_BTN + '</button>' +
             '</div>' +
         '</div>';
 
@@ -185,16 +190,138 @@ define(function (require, exports, module) {
             }
         });
 
-        // Check availability and render appropriate UI
-        _checkAvailability();
+        // Create container once, add to AI tab
+        $aiTabContainer = $('<div class="ai-tab-container"></div>');
+        SidebarTabs.addToTab("ai", $aiTabContainer);
+
+        // Listen for entitlement changes to refresh UI on login/logout
+        const EntitlementsManager = _KernalModeTrust && _KernalModeTrust.EntitlementsManager;
+        if (EntitlementsManager) {
+            EntitlementsManager.on(EntitlementsManager.EVENT_ENTITLEMENTS_CHANGED, _checkEntitlementAndInit);
+        }
+
+        // Check entitlements and render appropriate UI
+        _checkEntitlementAndInit();
     }
 
     /**
      * Show placeholder UI for non-native (browser) builds.
      */
     function initPlaceholder() {
+        $aiTabContainer = $('<div class="ai-tab-container"></div>');
+        SidebarTabs.addToTab("ai", $aiTabContainer);
         const $placeholder = $(PLACEHOLDER_HTML);
-        SidebarTabs.addToTab("ai", $placeholder);
+        $placeholder.find(".ai-download-btn").on("click", function () {
+            window.open("https://phcode.io", "_blank");
+        });
+        $aiTabContainer.empty().append($placeholder);
+    }
+
+    /**
+     * Remove any existing panel content from the AI tab container.
+     */
+    function _removeCurrentPanel() {
+        if ($aiTabContainer) {
+            $aiTabContainer.empty();
+        }
+        // Clear cached DOM references so stale jQuery objects aren't reused
+        $panel = null;
+        $messages = null;
+        $status = null;
+        $statusText = null;
+        $textarea = null;
+        $sendBtn = null;
+        $stopBtn = null;
+        $imagePreview = null;
+    }
+
+    /**
+     * Gate AI UI behind entitlement checks. Shows login screen if not logged in,
+     * upsell screen if no AI plan, or proceeds to CLI availability check if entitled.
+     */
+    function _checkEntitlementAndInit() {
+        _removeCurrentPanel();
+        const EntitlementsManager = _KernalModeTrust && _KernalModeTrust.EntitlementsManager;
+        if (!EntitlementsManager) {
+            // No entitlement system (test env or dev) — skip straight to CLI check
+            _checkAvailability();
+            return;
+        }
+        EntitlementsManager.getAIEntitlement().then(function (entitlement) {
+            if (entitlement.aiDisabledByAdmin) {
+                _renderAdminDisabledUI();
+            } else if (entitlement.activated) {
+                _checkAvailability();
+            } else if (entitlement.needsLogin) {
+                _renderLoginUI();
+            } else {
+                _renderUpsellUI(entitlement);
+            }
+        }).catch(function () {
+            _checkAvailability(); // fallback on error
+        });
+    }
+
+    /**
+     * Render the login prompt UI (user not signed in).
+     */
+    function _renderLoginUI() {
+        const html =
+            '<div class="ai-chat-panel">' +
+                '<div class="ai-unavailable">' +
+                    '<div class="ai-unavailable-icon"><i class="fa-solid fa-wand-magic-sparkles"></i></div>' +
+                    '<div class="ai-unavailable-title">' + Strings.AI_CHAT_LOGIN_TITLE + '</div>' +
+                    '<div class="ai-unavailable-message">' +
+                        Strings.AI_CHAT_LOGIN_MESSAGE +
+                    '</div>' +
+                    '<button class="ai-retry-btn ai-login-btn">' + Strings.AI_CHAT_LOGIN_BTN + '</button>' +
+                '</div>' +
+            '</div>';
+        const $login = $(html);
+        $login.find(".ai-login-btn").on("click", function () {
+            _KernalModeTrust.EntitlementsManager.loginToAccount();
+        });
+        $aiTabContainer.empty().append($login);
+    }
+
+    /**
+     * Render the upsell UI (user logged in but no AI plan).
+     */
+    function _renderUpsellUI(entitlement) {
+        const html =
+            '<div class="ai-chat-panel">' +
+                '<div class="ai-unavailable">' +
+                    '<div class="ai-unavailable-icon"><i class="fa-solid fa-wand-magic-sparkles"></i></div>' +
+                    '<div class="ai-unavailable-title">' + Strings.AI_CHAT_UPSELL_TITLE + '</div>' +
+                    '<div class="ai-unavailable-message">' +
+                        Strings.AI_CHAT_UPSELL_MESSAGE +
+                    '</div>' +
+                    '<button class="ai-upsell-btn">' + Strings.AI_CHAT_UPSELL_BTN + '</button>' +
+                '</div>' +
+            '</div>';
+        const $upsell = $(html);
+        $upsell.find(".ai-upsell-btn").on("click", function () {
+            const url = (entitlement && entitlement.buyURL) || brackets.config.purchase_url;
+            Phoenix.app.openURLInDefaultBrowser(url);
+        });
+        $aiTabContainer.empty().append($upsell);
+    }
+
+    /**
+     * Render the admin-disabled UI (AI turned off by system administrator).
+     */
+    function _renderAdminDisabledUI() {
+        const html =
+            '<div class="ai-chat-panel">' +
+                '<div class="ai-unavailable">' +
+                    '<div class="ai-unavailable-icon"><i class="fa-solid fa-wand-magic-sparkles"></i></div>' +
+                    '<div class="ai-unavailable-title">' + Strings.AI_CHAT_ADMIN_DISABLED_TITLE + '</div>' +
+                    '<div class="ai-unavailable-message">' +
+                        Strings.AI_CHAT_ADMIN_DISABLED_MESSAGE +
+                    '</div>' +
+                '</div>' +
+            '</div>';
+        $aiTabContainer.empty().append($(html));
     }
 
     /**
@@ -419,7 +546,7 @@ define(function (require, exports, module) {
             _newSession();
         });
 
-        SidebarTabs.addToTab("ai", $panel);
+        $aiTabContainer.empty().append($panel);
     }
 
     /**
@@ -428,10 +555,9 @@ define(function (require, exports, module) {
     function _renderUnavailableUI(error) {
         const $unavailable = $(UNAVAILABLE_HTML);
         $unavailable.find(".ai-retry-btn").on("click", function () {
-            $unavailable.remove();
             _checkAvailability();
         });
-        SidebarTabs.addToTab("ai", $unavailable);
+        $aiTabContainer.empty().append($unavailable);
     }
 
     // --- Context bar chip management ---
diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js
@@ -1823,7 +1823,16 @@ define({
     "AI_CHAT_CLI_NOT_FOUND": "Claude CLI Not Found",
     "AI_CHAT_CLI_INSTALL_MSG": "Install the Claude CLI to use AI features:<br><code>npm install -g @anthropic-ai/claude-code</code><br><br>Then run <code>claude login</code> to authenticate.",
     "AI_CHAT_RETRY": "Retry",
-    "AI_CHAT_DESKTOP_ONLY": "AI features require the Phoenix desktop app.",
+    "AI_CHAT_DESKTOP_ONLY": "AI features require the Phoenix desktop app. Download it to get started.",
+    "AI_CHAT_DOWNLOAD_BTN": "Download Desktop App",
+    "AI_CHAT_LOGIN_TITLE": "Sign In to Use AI",
+    "AI_CHAT_LOGIN_MESSAGE": "Sign in to your {APP_NAME} account to access AI features.",
+    "AI_CHAT_LOGIN_BTN": "Sign In",
+    "AI_CHAT_UPSELL_TITLE": "Phoenix Pro + AI",
+    "AI_CHAT_UPSELL_MESSAGE": "AI features are available with Phoenix Pro.",
+    "AI_CHAT_UPSELL_BTN": "Get Phoenix Pro",
+    "AI_CHAT_ADMIN_DISABLED_TITLE": "AI Disabled",
+    "AI_CHAT_ADMIN_DISABLED_MESSAGE": "AI features have been disabled by your system administrator.",
     "AI_CHAT_TOOL_SEARCH_FILES": "Search files",
     "AI_CHAT_TOOL_SEARCH_CODE": "Search code",
     "AI_CHAT_TOOL_READ": "Read",
diff --git a/src/styles/Extn-AIChatPanel.less b/src/styles/Extn-AIChatPanel.less
@@ -20,10 +20,20 @@
 
 /* AI Chat Panel — sidebar chat UI for Claude Code integration */
 
+.ai-tab-container {
+    display: flex;
+    flex-direction: column;
+    -webkit-box-flex: 1;
+    flex: 1;
+    min-height: 0;
+    overflow: hidden;
+}
+
 .ai-chat-panel {
     display: flex;
     flex-direction: column;
     -webkit-box-flex: 1;
+    flex: 1;
     min-height: 0;
     overflow: hidden;
     background-color: @bc-sidebar-bg;
@@ -1409,4 +1419,20 @@
             color: @project-panel-text-1;
         }
     }
+
+    .ai-upsell-btn {
+        background: #FF9900;
+        border: none;
+        color: #000;
+        font-weight: 600;
+        font-size: @sidebar-small-font-size;
+        padding: 3px 12px;
+        border-radius: 3px;
+        cursor: pointer;
+        transition: background-color 0.15s ease;
+
+        &:hover {
+            background: #FFa820;
+        }
+    }
 }
