refactor(web): optimize-session-invalidation

Harman-singh-waraich commented 1 month ago

closes #1717

PR-Codex overview

This PR focuses on improving error handling and authorization checks in the application, specifically when interacting with IPFS and GraphQL. It introduces a new AuthorizationError class and enhances existing functions to better manage authentication-related errors.

Detailed summary

Added AuthorizationError class in uploadToIpfs.ts.
Enhanced error handling in addUser and updateEmail functions to throw GraphQLError for specific errors.
Refactored AtlasProvider to include a new fetchWithAuthErrorHandling function for handling requests with authorization checks.
Updated the user addition, email update, and file upload processes to utilize the new error handling function.

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

Summary by CodeRabbit

New Features
- Enhanced error handling for authorization issues across various functions.
- Introduced a new AuthorizationError class for better error specificity.
Bug Fixes
- Improved error handling logic in addUser and updateEmail functions to provide more detailed error messages.
Refactor
- Updated session verification logic for more efficient checks based on JWT expiration.

coderabbitai[bot] commented 1 month ago

Walkthrough

The changes in this pull request enhance error handling and session verification in the AtlasProvider component and related functions. A new asynchronous function, fetchWithAuthErrorHandling, is introduced to manage authorization errors. The session verification logic is refactored from an interval-based to a timeout-based approach. Additionally, the addUser, updateEmail, and uploadFile methods are updated to utilize the new error handling mechanism. A new AuthorizationError class is created to handle specific authorization issues, improving overall error specificity.

Changes

File Path	Change Summary
web/src/context/AtlasProvider.tsx	Added `fetchWithAuthErrorHandling` for error handling; refactored session verification logic to timeout-based.
web/src/utils/atlas/addUser.ts	Enhanced error handling in `addUser` to throw `GraphQLError` with details on failure.
web/src/utils/atlas/updateEmail.ts	Improved error handling in `updateEmail` to throw `GraphQLError` with details; added `GraphQLError` import.
web/src/utils/atlas/uploadToIpfs.ts	Introduced `AuthorizationError` class; modified `uploadToIpfs` to throw `AuthorizationError` on 401 status.

Assessment against linked issues

Objective	Addressed	Explanation
Optimize session verification strategy in AtlasProvider (#1717)	✅

Possibly related PRs

#1654: This PR is related as it involves modifications to the addUser, updateEmail, and other user-related functions, which are also updated in the main PR to utilize the new error handling function in AtlasProvider.tsx.
#1687: This PR is related because it introduces the uploadFile method in AtlasProvider, which is directly connected to the changes made in the main PR regarding error handling and session verification, as well as the use of the uploadToIpfs function.
#1724: This PR improves error handling in the SubmitEvidenceModal, which is relevant to the main PR's focus on enhancing error handling across user operations, including those in the AtlasProvider.

Suggested labels

Priority: High, Type: Feature🗿, Package: Web

🐰 "In the garden where the code does grow,
Error handling now shines with a glow.
Sessions verified, no more delay,
With each hop, we improve our way.
Authorization clear, no more fright,
Hooray for changes, all feels right!" 🐇

🪧 Tips

### Chat There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai): - Review comments: Directly reply to a review comment made by CodeRabbit. Example: - `I pushed a fix in commit , please review it.` - `Generate unit testing code for this file.` - `Open a follow-up GitHub issue for this discussion.` - Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples: - `@coderabbitai generate unit testing code for this file.` - `@coderabbitai modularize this function.` - PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples: - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.` - `@coderabbitai read src/utils.ts and generate unit testing code.` - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.` - `@coderabbitai help me debug CodeRabbit configuration file.` 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) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai full review` to do a full review from scratch and review all the files again. - `@coderabbitai summary` to regenerate the summary of the PR. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository. - `@coderabbitai help` to get help. ### Other keywords and placeholders - Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. - Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description. - Add `@coderabbitai` or `@coderabbitai title` anywhere in the PR title to generate the title automatically. ### CodeRabbit Configuration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information. - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json` ### Documentation and Community - Visit our [Documentation](https://coderabbit.ai/docs) for detailed information on how to use CodeRabbit. - Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback. - Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

netlify[bot] commented 1 month ago

Deploy Preview for kleros-v2-testnet ready!

Name	Link
Latest commit	a85995823389bb96a1d6e06b73f5efcf84839d2e
Latest deploy log	https://app.netlify.com/sites/kleros-v2-testnet/deploys/6720962d20375000087cddad
Deploy Preview	https://deploy-preview-1727--kleros-v2-testnet.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 1 month ago

Deploy Preview for kleros-v2-university ready!

Name	Link
Latest commit	a85995823389bb96a1d6e06b73f5efcf84839d2e
Latest deploy log	https://app.netlify.com/sites/kleros-v2-university/deploys/6720962d035448000852a5c9
Deploy Preview	https://deploy-preview-1727--kleros-v2-university.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 1 month ago

Deploy Preview for kleros-v2-testnet-devtools ready!

Name	Link
Latest commit	a85995823389bb96a1d6e06b73f5efcf84839d2e
Latest deploy log	https://app.netlify.com/sites/kleros-v2-testnet-devtools/deploys/6720962d60db300008b2fb3e
Deploy Preview	https://deploy-preview-1727--kleros-v2-testnet-devtools.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 1 month ago

Deploy Preview for kleros-v2-neo ready!

Name	Link
Latest commit	a85995823389bb96a1d6e06b73f5efcf84839d2e
Latest deploy log	https://app.netlify.com/sites/kleros-v2-neo/deploys/6720962de2dda20008ed3f67
Deploy Preview	https://deploy-preview-1727--kleros-v2-neo.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Harman-singh-waraich commented 1 month ago

Looks great, I left some small notes and have a question: how is state managed across tabs/app reloads? The current approach seems to work (I've not run the code), but I want to check that the setTimeout will be reestablished on those conditions.

Session is linked to a tab, changing tabs would require to SignIn again. On reloads, there is an useEffect that does an initial session verification and then schedules the next verification. Which handles the reload cases.

Let me know if this answers your doubt :v:

codeclimate[bot] commented 1 month ago

Code Climate has analyzed commit a8599582 and detected 1 issue on this pull request.

Here's the issue category breakdown:

Category	Count
Style	1

View more on Code Climate.

sonarcloud[bot] commented 1 month ago

Quality Gate failed

Failed conditions
17.6% Duplication on New Code (required ≤ 10%)

See analysis details on SonarCloud

kleros / kleros-v2