Skip to content

feat: custom commit messages#157

Open
eclairjit wants to merge 7 commits into
erictli:mainfrom
eclairjit:feat/custom-commit-messages
Open

feat: custom commit messages#157
eclairjit wants to merge 7 commits into
erictli:mainfrom
eclairjit:feat/custom-commit-messages

Conversation

@eclairjit

@eclairjit eclairjit commented May 30, 2026

Copy link
Copy Markdown

Summary

Adds support for custom git commit messages.

Previously, commits triggered from the footer and command palette always used a hardcoded message. This change introduces a shared commit panel that allows users to review and edit the commit message before committing.

Closes #154.

Changes

  • Added a reusable Textarea component
  • Added a commit panel in the sidebar above the footer
  • Unified footer and command palette commit workflows
  • Renamed commit actions to Commit Changes
  • Added support for multiline commit messages
  • Added validation to prevent empty commit messages

Testing

  • Open commit panel from the footer
  • Open commit panel from the command palette
  • Commit using the default message
  • Commit using a custom message
  • Commit using multiline messages
  • Enter commits the message
  • Shift+Enter inserts a newline
  • Escape closes the panel
  • Empty commit messages are blocked
  • Commit panel resets to the default message when reopened
  • Changes are committed and pushed successfully

Screenshots

custom-commit-message-ss-1

custom-commit-message-ss-2

custom-commit-message-ss-3

custom-commit-message-ss-4

Summary by CodeRabbit

  • New Features
    • Added a commit panel for composing commit messages before submitting.
  • Refactor
    • Commit action now opens the commit panel instead of performing an immediate quick commit; button label changed to "Commit Changes."
  • UX
    • Commit panel can be opened from the footer and via the command palette command.

Review Change Stack

@coderabbitai

coderabbitai Bot commented May 30, 2026

Copy link
Copy Markdown

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 7a4bc5cc-8cb8-44e3-8433-f193865165e6

📥 Commits

Reviewing files that changed from the base of the PR and between 12fc4c7 and 0809294.

📒 Files selected for processing (1)
  • src/components/layout/Sidebar.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • src/components/layout/Sidebar.tsx

📝 Walkthrough

Walkthrough

Adds a CommitPanel and Textarea UI, routes Footer/CommandPalette actions to open the panel via callbacks/events, and wires Sidebar to host the panel and handle commits.

Changes

Custom commit message panel

Layer / File(s) Summary
Textarea UI component
src/components/ui/Textarea.tsx, src/components/ui/index.tsx
New ref-forwarded Textarea component with merged styling classes and displayName; exported from UI index.
CommitPanel modal component
src/components/git/CommitPanel.tsx
New CommitPanel with commit message state, focus/reset on open, Escape/Enter keyboard handling, async commit via useGit().commit, toast feedback, and disabled buttons during committing.
Footer commit button callback
src/components/layout/Footer.tsx
FooterProps add optional onOpenCommit; handleCommit now invokes the callback instead of performing direct git commit + toasts. Button text changed to "Commit Changes".
Sidebar event orchestration
src/components/layout/Sidebar.tsx
Sidebar imports CommitPanel, adds commitPanelOpen state, listens for "open-commit-panel" window event, mounts CommitPanel, and wires Footer onOpenCommit to open it.
CommandPalette event dispatch
src/components/command-palette/CommandPalette.tsx
Removes commit from useGit in this component; "Commit Changes" command dispatches open-commit-panel and closes the palette. useMemo deps updated.
UI component formatting
src/components/ui/index.tsx
Cosmetic line-break and comma adjustments in ToolbarButton, IconButton, ListItem, and CommandItem className conditionals; no behavioral changes.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • erictli/scratch#88: Modifies Git command/button gating and touches similar commit-related UI wiring.

Suggested reviewers

  • erictli

Poem

🐰 A panel springs forth, textareas await,
Custom messages now seal their fate,
Escape to dismiss, Enter to send—
Events dispatched from end to end!
Git history grows with thoughtful prose.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat: custom commit messages' clearly summarizes the main change: adding support for custom commit messages through a new commit panel interface.
Linked Issues check ✅ Passed The PR fulfills all coding requirements from issue #154: adds ability to enter custom commit messages before syncing, supports multiline messages, and validates against empty messages.
Out of Scope Changes check ✅ Passed All changes are directly related to the custom commit message feature: new Textarea component, CommitPanel component, integration into Footer and Sidebar, and Command Palette updates.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (1)
src/components/layout/Sidebar.tsx (1)

437-446: ⚡ Quick win

Wrap the panel open/close handlers in useCallback.

Footer is memo-wrapped, but the inline onOpenCommit/onClose arrows are recreated on every Sidebar render, which defeats Footer's memoization and also regenerates CommitPanel's internal useCallbacks (since onClose is in their deps). Stable references avoid this.

♻️ Stable handlers
   const [commitPanelOpen, setCommitPanelOpen] = useState(false);
+  const openCommitPanel = useCallback(() => setCommitPanelOpen(true), []);
+  const closeCommitPanel = useCallback(() => setCommitPanelOpen(false), []);
       <CommitPanel
         open={commitPanelOpen}
-        onClose={() => setCommitPanelOpen(false)}
+        onClose={closeCommitPanel}
       />

       {/* Footer with git status, commit, and settings */}
         <Footer
           onOpenSettings={onOpenSettings}
-          onOpenCommit={() => setCommitPanelOpen(true)}
+          onOpenCommit={openCommitPanel}
         />
As per coding guidelines: "Use `useCallback` and `useMemo` for performance-critical paths".
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/components/layout/Sidebar.tsx` around lines 437 - 446, The inline arrow
handlers passed to CommitPanel and the memoized Footer are recreated every
render; wrap them in useCallback to provide stable references: create const
handleCloseCommitPanel = useCallback(() => setCommitPanelOpen(false), []) and
const handleOpenCommit = useCallback(() => setCommitPanelOpen(true), []) (or
include any deps if you reference others), then pass handleCloseCommitPanel to
CommitPanel's onClose and handleOpenCommit to Footer's onOpenCommit (keep
onOpenSettings as-is if already stable); this preserves Footer memoization and
prevents re-creating CommitPanel's internal callbacks.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In `@src/components/layout/Sidebar.tsx`:
- Around line 437-446: The inline arrow handlers passed to CommitPanel and the
memoized Footer are recreated every render; wrap them in useCallback to provide
stable references: create const handleCloseCommitPanel = useCallback(() =>
setCommitPanelOpen(false), []) and const handleOpenCommit = useCallback(() =>
setCommitPanelOpen(true), []) (or include any deps if you reference others),
then pass handleCloseCommitPanel to CommitPanel's onClose and handleOpenCommit
to Footer's onOpenCommit (keep onOpenSettings as-is if already stable); this
preserves Footer memoization and prevents re-creating CommitPanel's internal
callbacks.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: fa4ed644-d56a-451a-a83d-eb8d785834c5

📥 Commits

Reviewing files that changed from the base of the PR and between a638f02 and 12fc4c7.

📒 Files selected for processing (6)
  • src/components/command-palette/CommandPalette.tsx
  • src/components/git/CommitPanel.tsx
  • src/components/layout/Footer.tsx
  • src/components/layout/Sidebar.tsx
  • src/components/ui/Textarea.tsx
  • src/components/ui/index.tsx

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] Custom git commit message

1 participant