From 5caf40fdeb433c810749fbbcbfc71010100bcd38 Mon Sep 17 00:00:00 2001
From: David Montero <davidmonterocrespo24@gmail.com>
Date: Fri, 29 May 2026 15:14:36 +0200
Subject: [PATCH] feat(editor-toolbar): Share / Embed menu item

Fifth item in the overflow menu next to Sync to GitHub.  Free for
all users (no PRO badge); dispatches velxio-pro-share-prompt with the
current project id so the overlay's ShareModal can render the direct
link + iframe snippet copy UI.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 .../src/components/editor/EditorToolbar.tsx   | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/frontend/src/components/editor/EditorToolbar.tsx b/frontend/src/components/editor/EditorToolbar.tsx
index f4db7108..76359cca 100644
--- a/frontend/src/components/editor/EditorToolbar.tsx
+++ b/frontend/src/components/editor/EditorToolbar.tsx
@@ -1454,6 +1454,29 @@ export const EditorToolbar = ({
                     <span className="tb-overflow-label">{t('editor.toolbar.githubSyncLabel', 'Sync to GitHub')}</span>
                     <span className="tb-overflow-pro">PRO</span>
                   </button>
+                  {/* Share / Embed — free for all users with a public project.
+                      Watermark removal on the embed is the Pro perk; the
+                      Share modal itself is open to everyone so they can
+                      copy the link / iframe snippet. */}
+                  <button
+                    className="tb-overflow-item"
+                    role="menuitem"
+                    onClick={() => {
+                      setMoreMenuOpen(false);
+                      window.dispatchEvent(new CustomEvent('velxio-pro-share-prompt', {
+                        detail: { projectId: currentProject?.id ?? null },
+                      }));
+                    }}
+                  >
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
+                      <circle cx="18" cy="5" r="3" />
+                      <circle cx="6" cy="12" r="3" />
+                      <circle cx="18" cy="19" r="3" />
+                      <line x1="8.59" y1="13.51" x2="15.42" y2="17.49" />
+                      <line x1="15.41" y1="6.51" x2="8.59" y2="10.49" />
+                    </svg>
+                    <span className="tb-overflow-label">{t('editor.toolbar.shareLabel', 'Share / Embed')}</span>
+                  </button>
                 </div>
               )}
             </div>