PR Draft: Improve Preview & Save UX

Summary

UX improvements to the builder's save/publish/preview flow, making it clearer what state the creative is in and what action the user should take next.

Changes

1. Preview button gating

• Preview button is disabled when the creative has never been published
• Tooltip explains: "Publish first to open the live version."
• Prevents users from opening an empty preview page

2. Toast feedback on save and publish

• Save (without publish): "Saved. Publish to set changes live."
• Publish complete: "Published! Preview to verify."
• Guides the user through the save -> publish -> preview workflow

3. Unpublished changes indicator

• Orange dot appears on the Preview button after saving without publishing
• Tooltip shows last publish time: "Last published at 16:46. You have unpublished changes."
• Smart date formatting: time only (today), "yesterday 14:30", "17 Apr 14:30" (same year), "17 Apr 2025 14:30" (other year)
• Dot and tooltip clear after publishing
• Uses same $warning-color dot as the creative list for consistency

4. Zoom and pan persistence

• Preview zoom level and pan position now persist across block edits and config changes
• userHasZoomed flag in panZoomMixin tracks manual zoom
• onLoaded skips zoom/pan reset when user has manually adjusted the view
• Zoom resets on: refresh button, tab switch, format/device change, Scale to Fit
• Bug fix: atDefaultZoom (undefined) corrected to isAtDefaultZoom in autoScale -- previously autoScale() without force never actually ran

5. Action button layout

• Save and Publish/Preview buttons grouped into action-group containers
• Visual separator (1px line) between groups
• Removed fixed flex width -- buttons size naturally

6. Minor fixes

• CreativePreview: Fixed inverted mobile/desktop toggle label (showed current state instead of target state)
• PreviewPanel: Size display now shows live potentialWidth/Height during resize drag, and shows for mobile format types in standalone preview
• TagCode: Simplified "publish first" overlay text -- removed redundant "You have to" prefix
• Toast.scss: Changed from min-width: 500px to width: fit-content so toasts size to content

Files changed

File	What changed
src/pages/Chatbots/components/BuilderActions.vue	Action groups, preview gating, unpublished dot + tooltip, disabled styling
src/pages/Chatbots/ChatbotBuilder.vue	hasUnpublishedChanges and lastPublishedAt state, toast calls, props to BuilderActions
src/mixins/panZoom.ts	userHasZoomed flag, set on manual zoom, cleared on resetZoom
src/pages/Chatbots/components/BuilderVisuals/Preview/PreviewPanel.vue	Zoom persistence in onLoaded, atDefaultZoom bug fix, live resize size display, mobile size info
src/assets/i18n/en.js	New keys: previewRequiresPublish, previewOutdated, previewOutdatedAt, toast messages; updated tag text
src/pages/Chatbots/CreativePreview.vue	Inverted toggle label fix
src/pages/Chatbots/components/BuilderDelivery/TagCode.vue	Removed redundant text line
src/styles/Toast.scss	fit-content width