Skip to content

[Bug]: Text overflow in main app note editor breaks layout and hides UI #23

@jamubc

Description

@jamubc

Why

When a note in the main app editor (not the quickview/capture panel) contains 28 or more lines of text, the note view grows unboundedly downward. The top of the app — including the header and the beginning of the note — disappears off the top of the screen, leaving the user staring at the bottom of the text with no way to scroll back up. Below 28 lines the app behaves correctly. The root cause is that the inline editor has no maximum height constraint; it stretches the entire app window to fit the content rather than scrolling internally.

What Changes

  • Cap the inline note editor in the main app at a fixed maximum height (threshold: ~28 lines) and scroll the content vertically within that height — the app window itself MUST NOT grow
  • Remove the erroneous "horizontal text wrapping" framing from the earlier draft — the issue is purely vertical overflow
  • Add an "Editor" mode — a dynamic, in-place expansion of the InstantNotes UI into a full-featured editor view for users who want to write and refine longer content (e.g. AI prompts, workspace notes) without leaving the app

MODIFIED Requirements

Requirement: Bounded inline editor height

The inline note editor in the main app SHALL NOT cause the application window to grow beyond its normal height.
When note content reaches or exceeds ~28 lines, the editor MUST constrain itself to a maximum height and scroll vertically within that fixed area.
(Previously: the editor expanded the entire app window downward, pushing the header and top of the note off-screen.)

Requirement: Editor Mode — entry & exit

A new "Editor" button SHALL appear alongside the existing Pin / Archive / Delete buttons when a note is active.
Clicking "Editor" MUST transition the UI in-place (no new window, no modal) — the default InstantNotes view dynamically morphs into the full editor view focused on that note.
The note list SHALL remain visible in Editor Mode as a lightweight visual anchor, allowing the user to switch to another note or exit Editor Mode with minimal friction.
Clicking "Editor" again (or an equivalent close control) MUST return the UI to the default note list view.
(Previously: no Editor Mode existed.)

Requirement: Editor Mode — feature set (ideation phase — candidate features, not final scope)

In Editor Mode the user SHOULD have access to a richer set of tools not present in the default simple inline editor. Candidate features for discussion:

  • Formatting toolbar — bold, italic, headings, lists, blockquotes, inline code
  • Markdown preview — toggle between raw markdown and rendered output
  • Word / character count — live counter visible while editing
  • Find & replace — search within the current note
  • Syntax highlighting — for code blocks (ties into the workspace/prompt-writing use case)
  • Adjustable font size — larger text for comfortable long-form writing
  • Auto-save indicator — visible confirmation that changes are persisted
  • Distraction-free / focus toggle — optionally collapse the note list sidebar to maximise writing space

The default inline editor MUST remain simple and zero-friction (no toolbars, no chrome) — Editor Mode is strictly opt-in and additive.

Requirement: Workspace concept alignment

Editor Mode is the entry point for the broader workspace concept: a space where quick captures can be revisited, expanded, and refined over time — keeping the user within InstantNotes rather than exporting to a separate document editor or IDE.

Scenario

Scenario A — overflow bug fix
GIVEN the main app note list is open
AND the user pastes or types 28 or more lines of text into a note
WHEN the content reaches the height threshold
THEN the note editor MUST NOT expand the app window beyond its normal height
AND the editor MUST display a vertical scrollbar within its own bounds
AND the header, note list, and all other UI elements MUST remain fully visible

Scenario B — Editor Mode entry
GIVEN a note is active in the default view
WHEN the user clicks the "Editor" button next to Pin / Archive / Delete
THEN the UI MUST animate/morph in-place into the full Editor view
AND the focused note MUST fill the expanded editor area
AND the note list MUST remain visible as a navigational sidebar

Verification

Bug fix (Scenario A)
1.1 Open the main app (not the quickview/capture panel)
1.2 Paste a block of 28 or more lines of text into a note
1.3 Verify the app window does NOT grow or shift — the header remains visible
1.4 Verify a scrollbar appears inside the note editor and scrolls through the full content
1.5 Verify all other notes and UI controls remain accessible

Editor Mode (Scenario B)
2.1 Open the main app and select any note
2.2 Verify an "Editor" button is visible alongside Pin / Archive / Delete
2.3 Click "Editor" and verify the UI transitions in-place to the full editor view
2.4 Verify the note list remains visible as a sidebar
2.5 Verify clicking "Editor" again (or the exit control) returns the UI to the default view
2.6 Verify the default inline note editor remains simple and unchanged

Additional Context

  • The 28-line threshold is the observed point of failure; the fix should apply a CSS max-height + overflow-y: scroll (or equivalent) to the inline editor container
  • Editor Mode is in the ideation phase — the candidate feature list above is a starting point for discussion, not a committed spec
  • The workspace concept (Editor Mode as a long-form refinement space) is a planned direction for the product; this issue tracks the first step toward it

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions