feat: enhance empty states for tasks, farms, and crops in dashboard#56
Conversation
|
@gitbasitmalik is attempting to deploy a commit to the karan3431's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
🎉 Thanks for your contribution, @gitbasitmalik! Please make sure CI passes and the checklist in the PR template is complete. A maintainer will review this soon. — The AgroNavis team |
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Adds a reusable, illustrated EmptyState component and expands the dashboard UI with a dedicated “My Crops” tab and localized empty-state copy, plus a small dev script adjustment for running the backend from a venv.
Changes:
- Introduced
EmptyStatecomponent + CSS module with illustrations/animations - Replaced multiple inline empty-state UIs in the dashboard with the new component and added “My Crops” navigation/tab
- Added i18n strings for new nav item and empty states (EN/HI/BN) and adjusted
dev:apiscript
Reviewed changes
Copilot reviewed 9 out of 11 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| package.json | Updates dev:api to use the backend venv uvicorn on non-Windows |
| frontend/src/styles/EmptyState.module.css | Adds styling/animations for the new EmptyState component |
| frontend/src/pages/dashboard.tsx | Adds “My Crops” item to dashboard nav |
| frontend/src/locales/en.json | Adds myCrops nav label + dashboard.emptyStates.* strings |
| frontend/src/locales/hi.json | Adds myCrops nav label + dashboard.emptyStates.* strings |
| frontend/src/locales/bn.json | Adds myCrops nav label + dashboard.emptyStates.* strings |
| frontend/src/components/EmptyState.tsx | New reusable illustrated EmptyState component |
| frontend/src/components/Dashboard.tsx | Uses EmptyState in multiple places + adds “My Crops” tab content |
| frontend/src/components/DailyTaskReminders.tsx | Shows a “tasks complete” EmptyState variant when all tasks are done |
Files not reviewed (1)
- frontend/package-lock.json: Language not supported
Comments suppressed due to low confidence (1)
package.json:1
- On non-Windows this assumes
./venv/bin/uvicornexists and is directly executable. A more reliable way to ensure the correct environment and avoid executable-bit/shebang issues is to invoke uvicorn via the venv’s Python (e.g.,./venv/bin/python -m uvicorn ...; аналогously on Windows with...\\\\python.exe -m uvicorn ...). This tends to be more portable across environments and venv setups.
{
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| {allComplete ? ( | ||
| <EmptyState | ||
| variant="tasks" | ||
| title={t('dashboard.emptyStates.tasks.title')} | ||
| description={t('dashboard.emptyStates.tasks.desc')} | ||
| ctaLabel="Reset for Tomorrow" | ||
| onCta={resetTasks} | ||
| /> |
|
Warning Review limit reached
More reviews will be available in 44 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (5)
📝 WalkthroughWalkthroughThe PR introduces a reusable ChangesEmpty State UI System
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 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: 4
🤖 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 `@frontend/src/components/DailyTaskReminders.tsx`:
- Line 110: DailyTaskReminders currently hardcodes the CTA text via
ctaLabel="Reset for Tomorrow"; add a new translation key (e.g.
dashboard.emptyStates.tasks.resetCta) to en.json, bn.json, and hi.json with the
appropriate localized strings, then replace the hardcoded ctaLabel with
t('dashboard.emptyStates.tasks.resetCta') in the DailyTaskReminders component so
it uses the existing t() i18n pattern used for title and description.
In `@frontend/src/components/Dashboard.tsx`:
- Around line 545-563: Replace the hardcoded header and button strings in the
Dashboard component with i18n lookups: use t('dashboard.crops.title') instead of
"My Crops" (target s.fertTitle), t('dashboard.crops.subtitle') for the subtitle
text, t('dashboard.crops.addCrop') for the button label (button using s.emptyBtn
and router.push), and t('dashboard.crops.loading') for the loading text shown
when loading is true; also add the suggested keys under dashboard.crops in your
locale JSONs (en.json, bn.json, hi.json).
- Around line 609-632: The crop card contains hardcoded user strings—replace
"Area not set", the "Stage: " prefix and "Growth stage not set", and "Scan Crop"
with localized keys from the dashboard.crops.card locale (e.g. card.areaNotSet,
card.stageLabel, card.stageNotSet, card.scanCrop). In Dashboard.tsx import/use
the i18n translation hook (e.g. useTranslation or t) at the top of the
component, swap the literal strings for t('dashboard.crops.card.areaNotSet')
where crop.area_allocated <= 0, render the stage by concatenating
t('dashboard.crops.card.stageLabel') + crop.current_growth_stage when present or
t('dashboard.crops.card.stageNotSet') otherwise (target the existing JSX that
references crop.current_growth_stage), and replace the button text "Scan Crop"
with t('dashboard.crops.card.scanCrop'); keep existing handlers like
setActiveTab('cropscan') unchanged.
- Around line 589-594: Validate and safely format crop.sowing_date and
crop.expected_harvest_date before calling toLocaleDateString: implement a
defensive helper (e.g., safeFormatDate) that accepts the raw value
(crop.sowing_date / crop.expected_harvest_date), returns 'Not set' for
null/undefined/empty, attempts to construct a Date and checks isFinite(date) or
isNaN(date.getTime()), and only then returns date.toLocaleDateString(...) else
returns 'Not set' (or a configurable fallback). Replace the inline new
Date(...).toLocaleDateString calls that produce sowingLabel and harvestLabel
with calls to this helper so malformed or invalid strings won't crash the UI.
🪄 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: 836c1509-ed35-47d3-a016-4b06a57cc5cd
⛔ Files ignored due to path filters (2)
frontend/package-lock.jsonis excluded by!**/package-lock.jsonpackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (9)
frontend/src/components/DailyTaskReminders.tsxfrontend/src/components/Dashboard.tsxfrontend/src/components/EmptyState.tsxfrontend/src/locales/bn.jsonfrontend/src/locales/en.jsonfrontend/src/locales/hi.jsonfrontend/src/pages/dashboard.tsxfrontend/src/styles/EmptyState.module.csspackage.json
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 9 out of 11 changed files in this pull request and generated 6 comments.
Files not reviewed (1)
- frontend/package-lock.json: Language not supported
Comments suppressed due to low confidence (1)
package.json:1
- On non-Windows this now hard-depends on
backend/venv/bin/uvicornexisting. If the venv isn’t created (or is named differently),npm run dev:apiwill fail. Consider adding a small fallback (e.g., try./venv/bin/uvicornthenuvicorn) or documenting/enforcing venv creation as part of setup (e.g., asetupscript).
{
| <p className={s.title}>{title}</p> | ||
| <p className={s.desc}>{description}</p> |
| /* Crops exist — render crop cards */ | ||
| <div className={s.farmsGrid}> | ||
| {crops.map((crop) => { | ||
| const stage = crop.current_growth_stage || 'Vegetative'; |
| </div> | ||
| {/* Area + Season row */} | ||
| <div className={s.soilDesc}> | ||
| {crop.area_allocated > 0 ? `${crop.area_allocated.toFixed(1)} acres` : t('dashboard.cropsTab.areaNotSet')} |
| {/* Sowing & Harvest */} | ||
| <div className={s.farmNpkGrid} style={{ marginTop: 0 }}> | ||
| <div className={s.npkItem}> | ||
| <div className={s.npkLabel}>SOWING</div> |
| <div className={s.npkVal} style={{ fontSize: 12 }}>{sowingLabel}</div> | ||
| </div> | ||
| <div className={s.npkItem}> | ||
| <div className={s.npkLabel}>HARVEST</div> |
| const parseDate = (d: string | null | undefined) => { | ||
| if (!d) return t('dashboard.notSet'); | ||
| const date = new Date(d); | ||
| return isNaN(date.getTime()) | ||
| ? t('dashboard.notSet') | ||
| : date.toLocaleDateString(undefined, { day: 'numeric', month: 'short', year: 'numeric' }); | ||
| }; |
JainamDedhia
left a comment
JainamDedhia
left a comment
There was a problem hiding this comment.
Reviewed the implementation and the overall approach looks good. The EmptyState integration across Farms, Crops, and Tasks improves the user experience and keeps the dashboard consistent. The localization updates and reusable component structure are also well organized.
Nice work! 🚀
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
you're welcome @JainamDedhia @jpdevhub |
|
You are not in the official contributer list of ssoc contact the organisers |
|
how to do this? i don't have an idea about this can you help me with that! |
|
|
it's says Contributor registration is currently closed. Please check back later! |
|
Hm you have to contact the organisers |
Summary
Enhances the dashboard by adding beautifully designed Empty State illustrations for the Farms, Crops, and Tasks sections.
Related Issue
Closes #47
Changes
DailyTaskReminderswith an animatedEmptyStatecomponent when all tasks are complete.EmptyStatecomponent when no fields are mapped.Testing
npx tsc --noEmitto ensure no TypeScript errors were introduced.Checklist
.envvalues are committedSummary by CodeRabbit
New Features
Localization