feat(platform): entity count footer and delete dialog fix#829
Conversation
… dialog overflow
Add sticky "Showing all X {entity}" footer to entity tables (websites,
products, customers, vendors) so users can see total counts at a glance.
The footer updates live as data loads and shows filtered counts when
filters are active.
Also fix the document delete dialog where long filenames overflow the
dialog by middle-truncating names over 38 characters with a tooltip
showing the full name on hover.
There was a problem hiding this comment.
Your free trial has ended. If you'd like to continue receiving code reviews, you can add a payment method here.
📝 WalkthroughWalkthroughThis PR extends the data table infinite scroll functionality to support entity labels and total counts. Multiple table components (customers, products, vendors, websites) are updated to pass an Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@services/platform/app/features/documents/components/document-delete-dialog.tsx`:
- Around line 43-45: The title prop is being set unconditionally on the filename
anchor so short names get useless tooltips; update the JSX in
document-delete-dialog's rendering of the filename (the element that currently
uses <strong title={displayName}>{truncatedName}</strong>) to only set title
when the name is actually truncated (i.e., when index < parts.length - 1 or an
explicit isTruncated condition). In practice, compute a boolean like isTruncated
= index < parts.length - 1 (or reuse an existing truncated check) and change the
title to be conditional (title={isTruncated ? displayName : undefined}) so
tooltips only appear for truncated names.
In `@services/platform/app/hooks/use-list-page.ts`:
- Around line 331-333: Add a brief clarifying comment near the object returning
entityLabel and totalCount in use-list-page (where totalCount is set to
rawData.length) explaining that totalCount reflects the server-side/unfiltered
result set as returned from the backend (and therefore already includes
server-side filters like status/source/locale from URL params) while client-side
search may reduce the visible row count; reference the variables rawData and
totalCount and mention that client-side filtering is applied separately so
"Showing X of Y" displays X as the post-search visible count and Y as
rawData.length.
🪄 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: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: 119dec87-547c-4ab1-880d-869ab97c055d
⛔ Files ignored due to path filters (2)
services/platform/convex/_generated/api.d.tsis excluded by!**/_generated/**services/platform/convex/betterAuth/_generated/component.tsis excluded by!**/_generated/**
📒 Files selected for processing (8)
services/platform/app/components/ui/data-table/data-table.tsxservices/platform/app/features/customers/components/customers-table.tsxservices/platform/app/features/documents/components/document-delete-dialog.tsxservices/platform/app/features/products/components/products-table.tsxservices/platform/app/features/vendors/components/vendors-table.tsxservices/platform/app/features/websites/components/websites-table.tsxservices/platform/app/hooks/use-list-page.tsservices/platform/messages/en.json
| {index < parts.length - 1 && ( | ||
| <strong title={displayName}>{truncatedName}</strong> | ||
| )} |
There was a problem hiding this comment.
Show tooltip only when the filename is actually truncated.
Line 44 sets title unconditionally, so short names get redundant tooltips too. Gate it to truncated cases only.
✂️ Proposed fix
- {index < parts.length - 1 && (
- <strong title={displayName}>{truncatedName}</strong>
- )}
+ {index < parts.length - 1 && (
+ <strong title={truncatedName !== displayName ? displayName : undefined}>
+ {truncatedName}
+ </strong>
+ )}📝 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.
| {index < parts.length - 1 && ( | |
| <strong title={displayName}>{truncatedName}</strong> | |
| )} | |
| {index < parts.length - 1 && ( | |
| <strong title={truncatedName !== displayName ? displayName : undefined}> | |
| {truncatedName} | |
| </strong> | |
| )} |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In
`@services/platform/app/features/documents/components/document-delete-dialog.tsx`
around lines 43 - 45, The title prop is being set unconditionally on the
filename anchor so short names get useless tooltips; update the JSX in
document-delete-dialog's rendering of the filename (the element that currently
uses <strong title={displayName}>{truncatedName}</strong>) to only set title
when the name is actually truncated (i.e., when index < parts.length - 1 or an
explicit isTruncated condition). In practice, compute a boolean like isTruncated
= index < parts.length - 1 (or reuse an existing truncated check) and change the
title to be conditional (title={isTruncated ? displayName : undefined}) so
tooltips only appear for truncated names.
| entityLabel, | ||
| totalCount: entityLabel ? rawData.length : undefined, | ||
| }, |
There was a problem hiding this comment.
🧹 Nitpick | 🔵 Trivial
Clarify the totalCount semantics for filtered vs unfiltered counts.
The current implementation sets totalCount to rawData.length, which represents all items loaded from the backend (before client-side search filtering). This means:
- The "Showing X of Y" message appears when client-side search reduces the visible count
- Server-side filters (status, source, locale via URL params) are already reflected in
rawData, so those won't show as "filtered"
This behavior seems intentional for distinguishing client-side search from server-side filtering, but consider adding a brief comment to clarify this distinction for future maintainers.
📝 Suggested clarifying comment
entityLabel,
+ // totalCount reflects items loaded from backend (post server-side filter),
+ // enabling "Showing X of Y" when client-side search further reduces the set
totalCount: entityLabel ? rawData.length : undefined,📝 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.
| entityLabel, | |
| totalCount: entityLabel ? rawData.length : undefined, | |
| }, | |
| entityLabel, | |
| // totalCount reflects items loaded from backend (post server-side filter), | |
| // enabling "Showing X of Y" when client-side search further reduces the set | |
| totalCount: entityLabel ? rawData.length : undefined, | |
| }, |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@services/platform/app/hooks/use-list-page.ts` around lines 331 - 333, Add a
brief clarifying comment near the object returning entityLabel and totalCount in
use-list-page (where totalCount is set to rawData.length) explaining that
totalCount reflects the server-side/unfiltered result set as returned from the
backend (and therefore already includes server-side filters like
status/source/locale from URL params) while client-side search may reduce the
visible row count; reference the variables rawData and totalCount and mention
that client-side filtering is applied separately so "Showing X of Y" displays X
as the post-search visible count and Y as rawData.length.
Only show title tooltip on truncated filenames and add clarifying comment for totalCount semantics.
Summary
Test plan
Summary by CodeRabbit
New Features
Improvements