Skip to content

feat: floating quick-access toolbar for sync commands - #49

Open
swapnilsubhashpatil wants to merge 4 commits into
RichardX366:masterfrom
swapnilsubhashpatil:feat/floating-toolbar
Open

feat: floating quick-access toolbar for sync commands#49
swapnilsubhashpatil wants to merge 4 commits into
RichardX366:masterfrom
swapnilsubhashpatil:feat/floating-toolbar

Conversation

@swapnilsubhashpatil

Copy link
Copy Markdown

Closes #48

Summary

Adds an optional floating toolbar for quick access to the sync commands
without opening the command palette. It's a single draggable button pinned to
the right edge of the app that expands into a menu of sync actions.

Disabled by default — fully opt-in.

Screenshots

Collapsed Expanded menu Settings
expanded menu collapsed button settings with toolbar action toggles

What it does

  • Toggle in settings (Floating toolbar) shows/hides it live, no reload needed.
  • Draggable button on the right edge — drag it vertically to reposition; a
    press without movement opens/closes the menu.
  • Expandable menu with the four sync actions: Push, Pull, Fix paths, Reset.
    The button shows the sync icon when collapsed and a cross when open.
  • Opens away from the edge — if dragged near the top, the menu opens below
    so it never runs off-screen.
  • Choose which actions appear under a Toolbar actions sub-group (shown only
    when the toolbar is enabled). At least one action must stay enabled; default is
    Push.
  • Buttons call the existing push / pull / fixDrivePath / reset helpers and
    no-op while a sync is in progress.

Implementation notes

  • Native styling throughout: Obsidian CSS variables (--interactive-normal,
    --background-secondary, --background-modifier-border, etc.), setIcon for
    Lucide icons, and aria-label tooltips.
  • The launcher icon is registered via addIcon('ogd-sync', …) — a Lucide
    refresh-cw scaled to Obsidian's icon grid, so it recolors with the theme.
  • Responsive down to mobile widths; drag works with touch (touch-action: none).
  • Cleanly torn down on unload and when disabled (element removed, document
    listener detached) — no leaks.

Tests

  • Added tests/floating_toolbar.test.ts covering action selection (only enabled
    actions returned, in order; icon/label mapping; empty when all disabled),
    matching the existing test style.
  • npm test → all passing. npm run build and npm run lint clean.

Docs

  • README: added a Features bullet and a Use entry describing the setting.

Changes

  • main.ts — setting + toolbar create/drag/toggle/teardown, per-action toggles,
    at-least-one enforcement
  • styles.css — toolbar styles
  • tests/floating_toolbar.test.ts — action-selection tests
  • README.md — docs

Add an optional floating toolbar: a draggable button on the right edge
that expands into a menu of sync actions (Push, Pull, Fix paths, Reset).
The enable toggle and per-action toggles react live, at least one action
must stay enabled, and the toolbar is torn down on unload.
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.

[Feature Request] Floating Toolbar / Quick Access Menu for Sync Commands

1 participant