makelore/.project-docs/30-worklog/tasks/20260930-preview-toolbar-tabs-56e98b2d.md

Task: Move work preview address toolbar beside workspace tabs

Identity

• Task ID: 20260930-preview-toolbar-tabs-56e98b2d
• Mode: Feature
• Branch: codex/20260930-preview-toolbar-tabs-56e98b2d-preview-toolbar-tabs
• Worktree: /Users/chillishark/Makelore 麦洛/.codex-worktrees/makelore/20260930-preview-toolbar-tabs-56e98b2d
• Base commit: c55e9c7182
• Owner: codex
• Status: Ready for Integration

Scope

• Move the entire embedded work-preview address toolbar (back, forward, reload and editable URL) beside the Operation Chat / Work tabs, as explicitly confirmed by the user.

Intent And Constraints

• Keep the current navigation, browser/view lifecycle, URL editing, empty-work behavior, native viewport bounds, teacher clearance and student drafts. Show the toolbar only in the Work tab; retain standalone developer-browser layout. Use existing visual styles, fitting one row when space permits and wrapping cleanly on narrow panes. The follow-up explicitly requests updating the temporary app; no main merge or push is requested.

Outcome

• Embedded work previews render their existing navigation form through a portal into a stable slot beside the two workspace tabs. The form remains outside the tablist, retains existing handlers and address focus protection, and disappears when the Work tab is hidden. The old internal toolbar row is removed only when the external slot is available; standalone/fallback browsers remain unchanged. Responsive layout keeps all controls usable and wraps the address toolbar only when the pane is too narrow. README documents the new position.
• Updated the running temporary app on explicit follow-up authorization. Its latest composite renderer now includes this toolbar patch, with prior reference isolation and presentation changes preserved. No main-branch merge or remote push was performed.

Verification

• Standard typecheck, production build and scoped ESLint passed. All 59 relevant unit tests passed: 42 coding-chat-panel/use-work-preview tests and 17 agent-browser-panel tests, including external-toolbar navigation, inline fallback and hide/reopen behavior.
• All 17 browser layout scenarios were verified (14 passed in the full run; the final 3 passed after replacing obsolete internal-toolbar spacing assumptions with native viewport clearance assertions). Screenshots verified 375px wrapping, 768/1180px alignment and the expanded teacher pane. The fixture now includes a standards-mode doctype and production tab icons. Native pixels keep 8–10px below overlapping teacher speech, reclaim space for shorter messages, and restore the original 20px content padding when speech is dismissed or no longer overlaps.
• The updated isolated Electron work-tab scenario passed: the complete toolbar shares the tab row, address arrow keys stay in the input, refresh reaches the existing navigation endpoint, keyboard tab switches preserve the draft, and the toolbar returns without duplicate controls. Test-only changes to generated Main were restored byte-for-byte; no running user app or data was changed.
• Independent static review found no blocking lifecycle, focus, native bounds, tab semantics or teacher-clearance issues. Root reviewed the product/test diff and browser/Electron screenshots. Logs: /tmp/preview-toolbar-tabs-final-typecheck.log, /tmp/preview-toolbar-tabs-final-lint.log, /tmp/preview-toolbar-tabs-build.log, /tmp/preview-toolbar-tabs-regression.log, /tmp/preview-toolbar-tabs-browser-full-56e98b2d.log, /tmp/preview-toolbar-tabs-clearance-56e98b2d.log, /tmp/preview-toolbar-tabs-electron-56e98b2d.log.

Follow-ups

• None recorded.

Promotion Candidates

• None recorded.

Project Context Loaded

• Task: 20260930-preview-toolbar-tabs-56e98b2d; feature mode; branch/worktree/base as Identity. Official start/status confirms ownership/reservation. App create_worktree is unavailable at this parent-directory chat root (Not a git repository); official skill isolation succeeded from primary main c55e9c7.
• Read AGENTS, entry/memory index, task record and planning gate. Positioning, current-state, decision index, architecture and teacher ADR remain byte-identical to the previously loaded 7bce156 snapshot; domain, success criteria and evidence/reflection/commitment context remains applicable. README and actual source govern current presentation.
• Project supports student creation through Main-owned project conversations and a shared Agent/browser work preview. This is a Renderer layout change, without API/model/data changes.
• Read all 26 peer task Scope/Intent/Promotion sections. New teacher-reference-isolation peer protects selected source text/teacher handoff; leave those handlers intact. Empty-work peer requires local empty detection before conversation/model launch. No semantic conflict. Old unspecified child-language task is unrelated.
• Browser ownership remains Main/project/generation-scoped. Tabs hide the existing view without destroying or navigating it; native viewport bounds and teacher-overlay clearance must remain correct. Standalone browser and diagnostics retain current behavior.
• Files: AgentBrowserPanel, CodingChatPanel, classroom-workspace.css, focused browser/navigation tests and README. React portal can reuse the existing toolbar state/handlers in an external sibling slot outside the semantic tablist, avoiding duplicate controls or a second browser owner.
• Gate: Passed.

Plan

1. Add an optional embedded-toolbar target and a sibling slot on the tabs row; keep the existing form/navigation handlers and standalone fallback.
2. Scope styles to the workspace row, keep tab/button semantics separate, and prevent overflow in narrow panes.
3. Verify navigation/disabled states/tab lifecycle, real layout/native viewport behavior, relevant regressions, typecheck/lint/build; record and commit the isolated result.

Temporary App Update

• User explicitly requested updating the temporary app after product commit d787267. Resumed this same task through official start/status; feature ownership, branch and base match. Previously loaded canonical context remains unchanged. Re-read own record, entry, memory index, positioning and relevant integrated/architecture context. Peer review found no semantic conflict: the new teacher-reference merge only updates main; the new Alice investigation targets the installed app. The merge peer was cleaned during review, making the initial owner snapshot stale, without a dependency on this renderer update. Gate: Passed.
• Actual temporary app is PID 32583 with its own makelore-trial-tdq_nuah/user-data. Its latest renderer is the composite teacher-reference-70b4a183/source, with served entry index-mR-oHKNI.js. Preserve its reference isolation, sidebar, height and prior presentation changes. The three product-file patch from d787267 applies cleanly to that source. Stage/build a separate copy, compare manifests and served entry before publication, append assets and atomically replace only the renderer entry, then refresh and verify state. Keep Main, preload, user data, native window overlays and the installed app intact.
• Completed staging at /var/folders/mx/ltbgwsks5_n8zllj69p_wbcw0000gn/T/makelore-trial-tdq_nuah/preview-toolbar-tabs-56e98b2d/source. Verified only the three requested product files differ from the previous composite source. Composite typecheck, production build and all 16 existing browser-panel unit tests passed.
• Published renderer asset index-nb2_203t.js and route stylesheet index-BC3KHUz-.css; retained old assets and saved previous entry/manifests for rollback. Main PID stayed 32583. Restored the original Work tab after refresh. Live DOM measurements and captured toolbar image confirm a single complete address toolbar to the right of the tabs, vertically centered, outside the tablist, without overflow; native preview starts below the row.
• Route, selected conversation, inputs, operation/teacher drafts, teacher panel/turns, preview URL, sidebar state, window bounds and fullscreen were preserved. All 14 previously rendered operation messages remain unchanged and in order; hydration additionally loaded 8 earlier messages. No request was active and no message was sent. Released the temporary runtime lease (0 remain), restored background throttling and closed the debugging listener. Main/preload, window overlays and the installed app were not replaced. Evidence: build-source.json, verification.json, cleanup.json, logs and live-toolbar.png under the staging directory above. Both trial launch manifests point to the new renderer source and record d787267 as an added overlay.