feat(plugins): add @devframes/plugin-git Git dashboard#38
Draft
antfubot wants to merge 16 commits into
Draft
Conversation
✅ Deploy Preview for devfra ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
A publishable devframe plugin that surfaces a read-only Git dashboard (status, log, branches, diff) through type-safe RPC, with a Next.js App Router + shadcn/ui SPA. Resolves live over WebSocket in dev and from a build-time snapshot for static deploys; mountable into any host via createGitDevframe() or runnable standalone with the bundled devframe-git CLI.
Add a combined dev runner that starts the Next.js HMR server and the devframe RPC/WebSocket backend at once, wiring the client to the backend via NEXT_PUBLIC_DEVFRAME_WS. Print a ready banner from the CLI so the headless server no longer looks idle, and keep dev:client / dev:server for running a single side.
- Light/dark mode following the system preference with a manual toggle
and a no-flash inline script; theme tokens already shipped in globals.css.
- SourceTree-style commit graph in the log: git:log now returns parent
hashes (--topo-order) and the client computes lanes and draws colored
SVG edges/nodes alongside fixed-height commit rows.
- Stage / unstage / commit from the UI via gated git:stage, git:unstage,
and git:commit actions (createGitDevframe({ write: true }) or --write).
Status reports canWrite; the UI exposes per-file and bulk controls plus
a commit box only when write mode is on over a live connection.
Redesign the commit list around a SourceTree/GitLens-style graph: colored lane lines with hollow ringed nodes, left-aligned branch/tag label pills (the checked-out branch rendered as a solid current pill), per-row lane-tinted highlight bars, and a dashed "Work in Progress" row driven by the working-tree status. Branch/tag/remote/HEAD refs are parsed from the raw git ref strings. Also fixes the previously broken Storybook build by wiring the React JSX plugin needed under Vite 8's rolldown bundler.
…ls with stories The git:log snapshot baked only page one and served it for every request, so in a static deploy 'Load more' could never advance and was disabled outright. Bake the head of history (up to the 200-commit handler ceiling) as the snapshot instead, reporting hasMore: false since a static bundle has no further page — the dashboard now shows full history offline and live mode keeps paginating. Drops the now-unnecessary live-only gate on the button. Adds Storybook stories for the status, branches, and diff panel views alongside the existing log stories.
Replace the manual Load more button with an IntersectionObserver sentinel that streams the next 30-commit page as the list scrolls, and make commit rows selectable. Selecting a commit opens a details panel in the right sidebar (subject, refs, author/committer, parents, message, changed files, and the patch) backed by a new git:show RPC. The RPC bakes per-commit records for the snapshot window so static builds show details offline.
Give the dashboard an identity tied to the commit graph: the neutral grayscale primary/ring tokens become a violet accent (light and dark), surfacing in the logo chip, focus rings, selected commit, and patch hunk headers. Add a sticky app-shell top bar, slim theme-aware scrollbars for native overflow regions, and a selection color. Apply data-presentation rules across the panels: tabular-nums for every technical value (counts, ahead/behind, SHAs, +/- stats, relative times) so they stop jittering, and title attributes on truncated subjects, refs, paths, and branch names so the full value is recoverable on hover. Also drops an em dash from a status string.
Rework the dashboard into a devtools shell modeled on vite-devtools' rolldown UI: a fixed-height app that fills the viewport with no page scroll, flat panels separated by a single 1px border that doubles as a drag-to-resize handle (left sidebar and the commit-details rail persist their widths to localStorage), and each panel scrolling inside its own region. Drops the rounded card chrome, folds the branch list into the left rail under its own panel heading, and makes the Status and commit-details panels fill and scroll like the commit log already does. The patch renderer gains an inline (non-scrolling) mode so the details rail keeps a single scroll context. Storybook's decorator now frames stories in a fixed-height bordered panel to match.
antfubot
force-pushed
the
feat/plugin-git
branch
from
67567eb to
b7b59c9
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Adds
@devframes/plugin-git(plugins/git/) — the first built-in plugin: a read-only Git dashboard you can drop into any devframe host or run standalone.It surfaces the workspace repository over type-safe RPC:
git:status— branch, upstream ahead/behind, and staged / unstaged / untracked filesgit:log— paginated commit historygit:branches— local branches with SHA, upstream tracking, and tip subjectgit:diff— per-file added/deleted counts plus a unified patch for a selected fileThe UI is a Next.js App Router + shadcn/ui SPA. Every function is a
querywithsnapshot: true, so the same bundle resolves live over WebSocket in dev and from a build-time snapshot for static deploys, and degrades cleanly to an emptyisRepo: falsestate outside a repository.Usage
Mount it into a host via devframe's adapters, or run it standalone:
createGitDevframe({ repoRoot?, basePath?, distDir?, port? })keeps the mount path adapter-resolved (/standalone,/__git/hosted).Packaging
Publish-ready alongside
@devframes/hub: tsdown compiles the node side todist/(.mjs+.d.mts), the SPA is built intodist/client/, and the tarball shipsbin.mjs+dist/only. Wired into the workspace (plugins/*glob, turbo, vitest); thetsnapipublic-API snapshot is included.This PR was created with the help of an agent.