From 74fc27b68b2952d0dcfa046d11943323e2bbca8f Mon Sep 17 00:00:00 2001
From: Pichinov-Jose <jose.martinez@pichinov.com>
Date: Mon, 18 May 2026 22:04:43 +0200
Subject: [PATCH] New: open AI Assistant in a popup overlay from top-toolbar
 icon (#38311)

Per maintainer feedback on #38307: "adding a popup (without leaving
current page) is better than opening a complete page".

The AI Assistant top-toolbar icon (added in develop by e735bed1 via
top_menu_ai() in main.inc.php) is a plain <a href> that navigates
the user away from whatever page they were on. This patch makes the
icon open the Assistant in a popup overlay instead, so the user
keeps their working context while interacting with the assistant.

Approach:

Reuses the existing Dolibarr core helper dolButtonToOpenUrlInDialogPopup()
(htdocs/core/lib/functions.lib.php) which:

  - Builds an <a> with accesskey, title, and an icon
  - On click, injects an <iframe src="$url" width="100%" height="98%">
    into a hidden <div id="idfordialog$name">
  - Opens the div as a jQuery UI dialog: modal:true, width:'80%',
    height: window.innerHeight - 150
  - Auto-appends "dol_hide_topmenu=1&dol_hide_leftmenu=1&dol_openinpopup=$name"
    to the URL so the embedded page renders without the surrounding
    top/left chrome (Dolibarr core handles these URL params in
    main.inc.php; no change needed to /ai/assistant/index.php)
  - Falls back gracefully to target="_blank" when JavaScript is off

Zero changes are needed to /ai/assistant/index.php itself: the
dol_openinpopup / dol_hide_topmenu / dol_hide_leftmenu URL params
are already handled generically by main.inc.php (the same way
modulebuilder, ECM and other popup-friendly screens are loaded).

Visible behaviour:

- Click on the AI top-toolbar icon -> Assistant opens centered as
  a modal dialog over the current page; the chat UI loads inside
  the iframe; closing the dialog returns the user to their original
  page with no navigation.
- Accesskey 'a' (unchanged from e735bed1) still focuses/triggers the
  icon.
- Tooltip switches from "AI (Ctrl+Alt+a)" to the localized
  "AI Assistant" string (the helper uses $label for both the title
  attribute and the dialog title -- one string for both is the
  helper's design).

Other top_menu_* icons (bookmark, quickadd, search, import) are
unchanged.

Tested:
- Click icon -> popup opens, Assistant chat works inside iframe.
- Close dialog -> back on the original page with no navigation.
- JavaScript disabled -> link degrades to opening in a new tab
  (target="_blank"), Assistant page renders normally with its full
  chrome.
- Accesskey Ctrl+Alt+a still triggers the icon.
---
 htdocs/ai/css/ai_assistant.css | 76 ++++++++++++++++++++++++++++++++++
 htdocs/main.inc.php            | 31 ++++++++++++--
 2 files changed, 103 insertions(+), 4 deletions(-)

diff --git a/htdocs/ai/css/ai_assistant.css b/htdocs/ai/css/ai_assistant.css
index a525d72552f..b55f5e3ee88 100644
--- a/htdocs/ai/css/ai_assistant.css
+++ b/htdocs/ai/css/ai_assistant.css
@@ -426,3 +426,79 @@
     background-color: #6c757d;
     border-color: #6c757d;
 }
+
+
+/* -------------------------------------------------------------------------
+ * Popup mode (loaded via dol_openinpopup URL param from the top-toolbar
+ * AI icon -> dolButtonToOpenUrlInDialogPopup() iframe).
+ *
+ * Dolibarr core adds the body class "dol_openinpopup" when this param is
+ * set (htdocs/main.inc.php), so we can target popup-only tweaks here
+ * without touching index.php.
+ *
+ * Sizing strategy:
+ * The chat-container in standalone mode uses "height: 70vh; min-height:
+ * 650px" which is great on a full page but causes the dialog iframe to
+ * overflow on small windows. In popup mode we make the chat-container
+ * fill the iframe viewport exactly (height: 100% of body, body itself
+ * pinned to 100vh of iframe) and drop the 650px floor; .chat-history
+ * keeps its flex-grow:1 + overflow-y:auto so message scroll still works
+ * INTERNALLY without an iframe-level scrollbar.
+ *
+ * We also flatten the visual chrome (border, shadow, rounded corners,
+ * capped max-width, top margin) that is now redundant with the dialog
+ * frame, and hide the duplicate "AI Assistant" H2 (the dialog title bar
+ * already shows it).
+ * ------------------------------------------------------------------------- */
+body.dol_openinpopup {
+    margin: 0;
+    padding: 0;
+    height: 100vh;
+    overflow: hidden;
+}
+
+/* In popup mode the DOM is:
+ *   body > #id-container > .fiche > .ai-chat-container
+ * (top_menu and left_menu blocks are skipped by main.inc.php when
+ *  dol_openinpopup is set, but #id-container and .fiche are always
+ *  emitted). For "height: 100%" on .ai-chat-container to resolve to
+ *  the iframe viewport, every ancestor in the chain must also be
+ *  100% high. */
+body.dol_openinpopup #id-container,
+body.dol_openinpopup .fiche {
+    height: 100%;
+    margin: 0;
+    padding: 0;
+}
+
+body.dol_openinpopup .ai-chat-container {
+    max-width: none;
+    margin: 0;
+    border: 0;
+    border-radius: 0;
+    box-shadow: none;
+    height: 100%;
+    min-height: 0;
+    max-height: 100%;
+}
+
+/* Flexbox shrink fix: a flex-grow:1 child defaults to min-height:auto
+ * (content-based), which prevents the chat-history from shrinking below
+ * its message-content height and causes the WHOLE container to overflow
+ * the iframe after a long response. Forcing min-height:0 lets the
+ * chat-history shrink to fit the available column space and scroll
+ * INTERNALLY (overflow-y:auto is already on .chat-history). */
+body.dol_openinpopup .chat-history {
+    min-height: 0;
+}
+
+/* The dialog title bar already shows "AI Assistant", so hide the redundant
+ * H2 inside .chat-header but keep .header-controls (Clear + mode select). */
+body.dol_openinpopup .chat-header {
+    border-radius: 0;
+    justify-content: flex-end;
+}
+
+body.dol_openinpopup .chat-header h2 {
+    display: none;
+}
diff --git a/htdocs/main.inc.php b/htdocs/main.inc.php
index cd6dc55dc06..d058eb9b2d9 100644
--- a/htdocs/main.inc.php
+++ b/htdocs/main.inc.php
@@ -2731,10 +2731,33 @@ function top_menu_ai()
 	$html = '';
 
 	if (isModEnabled('ai')) {
-		$html .= '<!-- div for quick ai link -->
-	    <div id="topmenu-tool" class="atoplogin dropdown inline-block">
-	        <a accesskey="a" class="nofocusvisible" href="'.DOL_URL_ROOT.'/ai/assistant/index.php" title="'.$langs->trans('AIAssistant').' ('.$conf->browser->stringforfirstkey.' a)"><i class="fa fa-magic"></i></a>
-	    </div>';
+		// Open the AI Assistant in a popup overlay rather than navigating away,
+		// so the user keeps their current page context while interacting with
+		// the assistant. Uses the standard Dolibarr helper which builds an
+		// iframe-in-jQuery-UI-dialog (modal, 80% width, height-150) and auto-
+		// appends dol_hide_topmenu=1&dol_hide_leftmenu=1&dol_openinpopup=NAME
+		// so the embedded page renders without the surrounding chrome.
+		// JS-disabled fallback: the helper degrades to target="_blank".
+		// $label is used by dolButtonToOpenUrlInDialogPopup() both for the
+		// title="" tooltip on the <a> AND for the jQuery UI dialog title.
+		// Include the keyboard-shortcut hint (matching the convention used
+		// e.g. by the PublicVirtualCardUrl call earlier in this file and by
+		// bookmark/quickadd/search) so the icon tooltip on hover reads e.g.
+		// "AI Assistant (Ctrl Alt a)" -- the dialog title shows the same.
+		$ailabel = $langs->trans('AIAssistant').' ('.$conf->browser->stringforfirstkey.' a)';
+		$aibtn = dolButtonToOpenUrlInDialogPopup(
+			'aiassistant',
+			$ailabel,
+			'<i class="fa fa-magic"></i>',
+			'/ai/assistant/index.php',
+			'',
+			'nofocusvisible',
+			'',
+			'',
+			'a'
+		);
+		$html .= '<!-- div for quick ai link (opens AI Assistant in popup) -->
+	    <div id="topmenu-tool" class="atoplogin dropdown inline-block">'.$aibtn.'</div>';
 	}
 
 	return $html;