feat: added line and word counter to editor status bar#474
feat: added line and word counter to editor status bar#474harshiyasaxena wants to merge 1 commit into
Conversation
Qodo reviews are paused for this user.Troubleshooting steps vary by plan Learn more → On a Teams plan? Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center? |
👋 Thanks for opening a PR, @harshiyasaxena!Your PR has entered the 🚦 PR Review Pipeline.
What happens next
A pipeline status comment will appear below and update automatically as your PR progresses. While you wait
This comment is posted only once. |
github-actions
Bot
added
enhancement
WalkthroughEditorArea now calculates line and word counts from the currently active file's content and passes these metrics to StatusBar. StatusBar extends its props type to accept both values and renders them in the status footer alongside the existing cursor position indicator. ChangesDocument Metrics in Status Bar
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
modules/playground/components/editor-area.tsx (1)
81-90: ⚡ Quick winMemoize document metrics to avoid recomputing on cursor-only renders.
lineCountandwordCountdepend on content, but they currently recalculate on every render (including frequent cursor updates). Memoizing by content keeps this path cheaper for larger files.♻️ Proposed refactor
-import React, { useEffect } from "react"; +import React, { useEffect, useMemo } from "react"; ... - const fileContent = activeFile?.content || ""; - - const lineCount = fileContent - ? fileContent.split("\n").length - : 0; - - const wordCount = fileContent.trim() - ? fileContent.trim().split(/\s+/).length - : 0; + const fileContent = activeFile?.content ?? ""; + const { lineCount, wordCount } = useMemo(() => { + if (!activeFile) return { lineCount: 0, wordCount: 0 }; + return { + lineCount: fileContent.split(/\r?\n/).length, + wordCount: fileContent.trim() + ? fileContent.trim().split(/\s+/).length + : 0, + }; + }, [activeFile, fileContent]);🤖 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 `@modules/playground/components/editor-area.tsx` around lines 81 - 90, lineCount and wordCount are recomputed on every render even when only the cursor moves; wrap their calculations in a memo keyed on activeFile?.content (e.g., using React.useMemo) so they only recompute when fileContent changes. Update the logic that computes fileContent, lineCount, and wordCount (referencing fileContent, lineCount, wordCount) to use useMemo for line/word derivation and keep fileContent as the dependency source so cursor-only renders are cheap.
🤖 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.
Inline comments:
In `@modules/playground/components/editor-area.tsx`:
- Around line 83-85: The lineCount calculation under-reports empty active files
because it returns 0 for an empty string; update the computation in
editor-area.tsx (the lineCount variable that uses fileContent) to treat any
defined fileContent as at least 1 line — e.g. compute splitCount =
fileContent.split("\n").length and set lineCount = Math.max(1, splitCount) when
fileContent is not null/undefined, otherwise keep 0 for no active file.
---
Nitpick comments:
In `@modules/playground/components/editor-area.tsx`:
- Around line 81-90: lineCount and wordCount are recomputed on every render even
when only the cursor moves; wrap their calculations in a memo keyed on
activeFile?.content (e.g., using React.useMemo) so they only recompute when
fileContent changes. Update the logic that computes fileContent, lineCount, and
wordCount (referencing fileContent, lineCount, wordCount) to use useMemo for
line/word derivation and keep fileContent as the dependency source so
cursor-only renders are cheap.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 7c82b7f7-158d-4bf3-8535-127d65143b76
📒 Files selected for processing (2)
modules/playground/components/editor-area.tsxmodules/playground/components/status-bar.tsx
| const lineCount = fileContent | ||
| ? fileContent.split("\n").length | ||
| : 0; |
There was a problem hiding this comment.
Empty active files are reported as 0 lines.
For newline-based counting, an empty active file should be 1 line, not 0, so the status bar currently under-reports this case.
🛠️ Proposed fix
- const lineCount = fileContent
- ? fileContent.split("\n").length
- : 0;
+ const lineCount = activeFile
+ ? fileContent.split(/\r?\n/).length
+ : 0;📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const lineCount = fileContent | |
| ? fileContent.split("\n").length | |
| : 0; | |
| const lineCount = activeFile | |
| ? fileContent.split(/\r?\n/).length | |
| : 0; |
🤖 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 `@modules/playground/components/editor-area.tsx` around lines 83 - 85, The
lineCount calculation under-reports empty active files because it returns 0 for
an empty string; update the computation in editor-area.tsx (the lineCount
variable that uses fileContent) to treat any defined fileContent as at least 1
line — e.g. compute splitCount = fileContent.split("\n").length and set
lineCount = Math.max(1, splitCount) when fileContent is not null/undefined,
otherwise keep 0 for no active file.
1 participant
Summary
Why it changed
The editor currently does not provide basic text statistics. This enhancement improves usability by giving users quick insights into the size of the file they are working on directly from the footer/status bar.
Type of change
Related issue
Closes #386
Validation
npm run lintnpm testnpm run buildList any additional manual verification you performed:
Checklist
Summary by CodeRabbit