Sitelet https://github.com/overleaf/overleaf/pull/1513
Skip to content

Symbol palette v2 for overleaf.com(!!!) - #1513

Open
davrot wants to merge 5 commits into
overleaf:mainfrom
davrot:symbol_palette_v2
Open

davrot wants to merge 5 commits into
overleaf:mainfrom
davrot:symbol_palette_v2

Conversation

@davrot

@davrot davrot commented Aug 27, 2026

Copy link
Copy Markdown

Description

I call upon on all gods who are responsible to UI / UX, please update the crusty symbol palette in overleaf.com. I would like to improve the symbol palette downstream but compability issues (means opinions) with overleaf.com are blocking me. Use the code however you want, you don't need to disclose it and you don't need to add it to overleaf CE (I know that otherwise it is a total block for you).

Screenshot_2026-08-27_17-23-50 Screenshot_2026-08-27_17-25-07 Screenshot_2026-08-27_17-24-49

Related issues / Pull Requests

Contributor Agreement

This is human guided AI (mainly qwen3.8; a bit of VS code copilot AI code might be left) and hence can not be copyrighted. You can do with the code what what ever you want. This includes including (& modify) the code into overleaf.com and other closed source projects without the need to disclose the code.

davrot added 5 commits August 27, 2026 11:43
Port the symbol-palette v2 feature (rail-based palette + user-customizable
categories/symbols in localStorage) from the ext-ce fork (commit
bee34ec 'Initial files') into the current CE tree, adapted to the
modern ide-react architecture:

- add services/web/modules/symbol-palette (components, config context,
  default symbol data, categories util, safe character helper)
- register sourceEditorSymbolPalette / settingsEntries / railEntries
  module imports and add 'symbol-palette' to moduleImportSequence
  (Features gate -> ol-symbolPaletteAvailable meta -> toolbar command)
- move the palette out of the editor bottom PanelGroup into a rail tab;
  toolbar 'Symbol' command opens the rail tab via ui:select-rail-tab
- add moduleSettingsEntries spread to the settings modal
- append rail-panel + settings page styles to symbol-palette.scss
- add en + extracted i18n keys for the settings UI

Audit fixes vs the ported source:
- safe symbol character derivation (U+CUSTOM-*/non-hex codepoints no
  longer yield NaN/garbage chars or throw RangeError)
- validate + sanitize + dedupe imported palette configs; addSymbol now
  guarantees unique codepoints (the identity key)
- re-select active category in settings when it disappears (import/reset)
- remove dead code (unused state/imports, orphan close-button component,
  unused buildCategorisedSymbols), fix window globals for lint
- fix scss append seam and overflow shorthand; resolve the
  editor-context SymbolWithCharacter import with a type-only shim
Bake the contents of the compose-local settings.js.fixed override into
server-ce/config/settings.js (Dockerfile already copies it to
/etc/overleaf/settings.js), so the image no longer needs the
./settings.js.fixed volume mount:
- SMTP: OVERLEAF_EMAIL_SMTP_PASS_FILE support (pass read from file),
  takes precedence over OVERLEAF_EMAIL_SMTP_PASS
- enableRegiserPage: OVERLEAF_ENABLE_REGISTER_PAGE flag
… subpath

User test feedback fixes:
- symbol palette header was ugly when the rail panel is narrow: switch
  .symbol-palette-header to a column layout (horizontal scrolling tab
  row on top, full-width search below) instead of a wrapping row
- settings page had two intersecting scrollbars: remove the inner
  .sp-settings-table-container scroll (max-height/overflow) so the
  settings modal's own scroll is the only one (table header still
  sticks to the modal scroll)
- drop the dead sourceEditorSymbolPalette registration +
  symbol-palette.js subpath: the palette is served by the rail entry
  (panel) and the settings entry; nothing renders the pane anymore
…pping

- The palette root used min-content sizing, so when the rail panel was
  resized the panel width and the internal content fought each other in
  an endless re-layout loop: the editor pane kept re-measuring (text
  and scrollbar flickering for minutes after the drag). Break the loop
  by making the palette content width-independent of the panel width:
  contain: layout paint on .symbol-palette-rail-panel and min-width: 0
  down the whole flex chain (panel body, container, palette, body,
  items, search)
- Restore the requested dynamic line-wrap on the category tabs
  (flex-wrap: wrap) instead of a horizontal scroll row, so the tab
  header grows vertically instead of fighting the panel width
…ight

Root cause of the persistent 'Measure loop restarted' / text + scrollbar
flicker after palette resize: removing the old bottom PanelGroup left
.ide-redesign-editor-content (flex: 1 1 auto, default min-height: auto)
growing to its content height (multi-megapixel). That made .cm-scroller
unbounded, so the vertical-overflow bottom-padding plugin (padding =
scroller clientHeight - line height) fed its own output back in on every
geometry change: a never-converging positive-feedback loop that resized
the editor and re-measured CodeMirror continuously.

Fix: bound the editor content box (min-height: 0 + overflow hidden on
.ide-redesign-editor-content) so the cm chain always has a definite
viewport height; the padding plugin then converges in one pass.

Also: give the breadcrumb bar a little more height (28px -> 34px) as
requested.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant