feat: add Zustand persistence middleware and ErrorBoundary (Fixes #639)

[zeroknowledge0x]

Summary

Standardize Zustand persistence middleware with error handling and add ErrorBoundary component for graceful error recovery.

Changes

1. Persistence Middleware (persistenceMiddleware.js)

• Quota Error Handling: Automatically detects and handles QuotaExceededError
• Storage Cleanup: Removes oldest 25% of store entries when quota is exceeded
• Corruption Recovery: Detects and cleans up corrupted localStorage data
• Standardized API: createPersistedStore() for consistent store configuration

2. Error Boundary Component (ErrorBoundary.jsx)

• Stylized Error UI: Beautiful gradient-based error page
• Diagnostic Export: "Copy Error" button generates JSON with error details
• Error ID Tracking: Unique error ID for support reference
• Development Details: Shows stack trace in development mode
• Recovery Actions: Refresh and Go Home buttons

3. Store Updates

• authStore: Updated to use createPersistedStore
• ticketStore: Updated to use createPersistedStore
• adminStore: Updated to use createPersistedStore

Benefits

1. Robust Storage: Handles quota limits and corrupted data gracefully
2. Better UX: Users see helpful error page instead of blank screen
3. Easy Debugging: Copy Error button provides all diagnostic info
4. Consistent Pattern: All stores use same persistence configuration
5. Production Ready: Error logging hook for Sentry/LogRocket integration

Testing

• Test with full localStorage (quota exceeded)
• Test with corrupted localStorage data
• Verify ErrorBoundary catches React errors
• Test Copy Error functionality
• Verify all stores still persist correctly

Fixes #639

[vercel]

@rkhandrianto is attempting to deploy a commit to the ritesh Team on Vercel.

A member of the Team first needs to authorize it.

[coderabbitai]

Warning

Review limit reached

@zeroknowledge0x, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 25 minutes and 40 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 @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

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 configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a31135c1-2108-4a1b-a99a-786adb6e3674

📥 Commits

Reviewing files that changed from the base of the PR and between da8faf2 and 49ad7ef.

📒 Files selected for processing (5)

• Frontend/src/components/shared/ErrorBoundary.jsx
• Frontend/src/store/adminStore.js
• Frontend/src/store/authStore.js
• Frontend/src/store/persistenceMiddleware.js
• Frontend/src/store/ticketStore.js

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[ritesh-1918]

Hi @zeroknowledge0x! Thanks for the contribution. I have triaged your PR and set it to merge into the gssoc branch.

⚠️ MANDATORY GSSOC ONBOARDING STEPS:
Before your PR points are finalized on the leaderboard, you MUST complete these required steps:

1. ⭐ Star this repository: https://github.com/ritesh-1918/HELPDESK.AI (Mandatory)
2. 👤 Follow the Project Admin: https://github.com/ritesh-1918 (Mandatory)
3. 💼 Connect on LinkedIn: https://www.linkedin.com/in/ritesh1908/ (Mandatory)

Welcome to the HELPDESK.AI developer family! 🚀💻

[ritesh-1918]

Hi @zeroknowledge0x! 🙌

Thank you so much for your excellent contribution: "feat: add Zustand persistence middleware and ErrorBoundary (Fixes #639)"! We really appreciate the high-quality code and effort you have put into the platform.

Just a quick, friendly heads-up as we prepare our manual merging and verification queues—please make sure to complete all the mandatory community steps listed below.

Once those manual steps are verified, we'll get your PR officially merged into the gssoc branch (or keep it neatly cataloged if closed as integrated) and assign it the highest possible GSSoC S-Tier labels to maximize your leaderboard points!

Let's build something amazing together! 🚀🔥

---

🌟 Community Support & Network Steps (Take 10 Seconds!)

As we prepare our manual verification and merging queues, please make sure you have taken a moment to complete these required steps to finalize your points:

1. ⭐ Star this repository: https://github.com/ritesh-1918/HELPDESK.AI (Mandatory)
2. 🍴 Fork this repository: https://github.com/ritesh-1918/HELPDESK.AI/fork (Mandatory)
3. 👤 Follow @ritesh-1918 on GitHub: https://github.com/ritesh-1918 (Mandatory - manual step)
4. 💼 Connect on LinkedIn: https://www.linkedin.com/in/ritesh1908/ (Mandatory)

Note: Having these steps completed manually is required before your PR points are officially cleared.