fix: bug with no results on storage page #7411
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
WalkthroughThe code was updated to use optional chaining when accessing nested properties of the Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant YourFilesComponent
User->>YourFilesComponent: Render component
YourFilesComponent->>YourFilesComponent: Access pinnedFilesQuery.data?.result?.count
alt data and result exist
YourFilesComponent->>YourFilesComponent: Calculate showPagination, totalPages, pinnedFilesToShow
YourFilesComponent->>User: Render files and pagination
else data or result missing
YourFilesComponent->>User: Render empty state or loading
end
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (8)
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. This stack of pull requests is managed by Graphite. Learn more about stacking. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7411 +/- ##
==========================================
- Coverage 52.06% 52.06% -0.01%
==========================================
Files 945 945
Lines 63565 63565
Branches 4208 4207 -1
==========================================
- Hits 33098 33092 -6
- Misses 30361 30367 +6
Partials 106 106
🚀 New features to boost your workflow:
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx (1)
215-219: Consider adding error state handling for improved user experience.While the current loading state is properly handled, there's no explicit error state handling for when the query fails. Users might see an empty interface without understanding why.
Consider adding error state handling after the loading state:
{pinnedFilesQuery.isPending && ( <div className="flex min-h-[730px] items-center justify-center rounded-lg"> <Spinner className="size-10" /> </div> )} + {pinnedFilesQuery.isError && ( + <div className="flex min-h-[250px] items-center justify-center rounded-lg text-destructive-text"> + Failed to load pinned files. Please try again. + </div> + )}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (8)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: Unit Tests
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: Lint Packages
- GitHub Check: Build Packages
- GitHub Check: Size
- GitHub Check: Analyze (javascript)
🔇 Additional comments (4)
apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/usage/storage/your-files.tsx (4)
140-142: LGTM: Proper null safety implementation for pagination logic.The optional chaining prevents runtime errors when
pinnedFilesQuery.dataor itsresultproperty are undefined, with a sensible fallback tofalse.
144-146: LGTM: Safe total pages calculation.The implementation correctly handles undefined data by defaulting to 0 pages, ensuring pagination components receive valid numeric values.
148-150: LGTM: Safe array access with proper fallback.Using optional chaining with
undefinedfallback ensures the map operation in the render logic won't execute when data is unavailable.
209-209: LGTM: Consistent null safety in conditional rendering.The optional chaining ensures the "No Pinned Files" message only displays when data successfully loads with zero results, not when data is undefined due to loading or error states.
size-limit report 📦
|
Merge activity
|
## [Dashboard] Fix: Add optional chaining to prevent undefined errors in YourFilesSection ## Notes for the reviewer Added optional chaining to prevent potential undefined errors when accessing `pinnedFilesQuery.data.result` properties in the YourFilesSection component. This ensures the component handles cases where the data or result might be undefined more gracefully. ## How to test Verify that the YourFilesSection component renders correctly when data is loading or when the API returns undefined values. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Bug Fixes** - Improved reliability when displaying pinned files by preventing errors if data is missing or incomplete. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
graphite-app
bot
force-pushed
the
ph/06-22-fix_bug_with_no_results_on_storage_page
branch
from
29b90f2 to
18ad1af
Compare
graphite-app
bot
deleted the
ph/06-22-fix_bug_with_no_results_on_storage_page
branch
[Dashboard] Fix: Add optional chaining to prevent undefined errors in YourFilesSection
Notes for the reviewer
Added optional chaining to prevent potential undefined errors when accessing
pinnedFilesQuery.data.resultproperties in the YourFilesSection component. This ensures the component handles cases where the data or result might be undefined more gracefully.How to test
Verify that the YourFilesSection component renders correctly when data is loading or when the API returns undefined values.
Summary by CodeRabbit
PR-Codex overview
This PR focuses on enhancing the null safety of the
pinnedFilesQuery.dataobject in theyour-files.tsxfile by using optional chaining. This change ensures that the code handles cases wheredatamight be undefined, preventing potential runtime errors.Detailed summary
showPaginationto use optional chaining forpinnedFilesQuery.data?.result.totalPagesto safely accesspinnedFilesQuery.data?.result.pinnedFilesToShowto include optional chaining.