Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(web): add-siwe-authentication-for-file-uploads-and-notification-… #34

Merged

Conversation

Harman-singh-waraich
Copy link
Contributor

@Harman-singh-waraich Harman-singh-waraich commented May 27, 2024

  • Adds siwe authentication for notifications and file uploads
  • env variables might need to be set/ updated.

PR-Codex overview

This PR enhances Netlify deployment setup, adds user authentication features, and improves Supabase integration.

Detailed summary

  • Added generatedNetlifyInfo.json
  • Updated Netlify environment settings in netlify.toml
  • Implemented user authentication functions
  • Enhanced Supabase integration with new functions

The following files were skipped due to too many changes: web/netlify/functions/getNonce.ts, web/src/pages/SubmitItem/index.tsx, web/netlify/functions/uploadToIPFS.ts, web/src/pages/SubmitList/index.tsx, web/src/components/ActionButton/Modal/ChallengeItemModal.tsx, web/src/components/ActionButton/Modal/RemoveModal.tsx, web/src/components/EnsureAuth.tsx, web/netlify/functions/update-settings.ts, web/netlify/functions/authUser.ts, web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/index.tsx, web/src/types/supabase-notification.ts, web/src/types/supabase-datalake.ts, yarn.lock

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

Summary by CodeRabbit

  • New Features

    • Introduced authentication middleware and components to ensure secure access to various functionalities.
    • Added new functions for user settings, nonce generation, and IPFS uploads.
    • Implemented new hooks for user settings and session storage management.
  • Bug Fixes

    • Enhanced form validation and submission handling for user contact details.
  • Improvements

    • Updated build scripts and dependencies for better performance and security.
    • Improved error handling and middleware integration across various functions.
  • Chores

    • Added new environment setup scripts and updated .gitignore for better development workflow management.

Copy link

netlify bot commented May 27, 2024

Deploy Preview for curate-v2 ready!

Name Link
🔨 Latest commit 90181c7
🔍 Latest deploy log https://app.netlify.com/sites/curate-v2/deploys/66598784f44a040008e535c2
😎 Deploy Preview https://deploy-preview-34--curate-v2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

Copy link
Contributor

coderabbitai bot commented May 27, 2024

Important

Review skipped

Auto reviews are limited to the following labels: dependencies. Please add one of these labels to enable auto reviews.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Walkthrough

The changes introduce significant enhancements to the web application, including new authentication features, database integration, and improved user interface components. Key additions involve implementing authentication middleware, handling user settings, and integrating with Netlify for deployment. Several React components and hooks were updated to ensure authenticated access and better state management. Additionally, new scripts and configurations were added to streamline the build and deployment processes.

Changes

Files/Paths Change Summaries
web/.gitignore Added generatedNetlifyInfo.json to ignored files.
web/netlify.toml Added Netlify configuration for Yarn 3 cache, build environment variables, function directory, and development framework.
web/netlify/functions/... Added and updated various functions (authUser.ts, fetch-settings.ts, getNonce.ts, update-settings.ts, uploadToIPFS.ts) with new features like JWT authentication, database operations, and middleware usage.
web/netlify/middleware/authMiddleware.ts Introduced authentication middleware for JWT token verification.
web/package.json Updated build scripts and added dependencies: @middy/core, @middy/http-json-body-parser, jose, siwe.
web/scripts/... Added generateBuildInfo.sh script for environment setup and modified runEnv.sh to include the new script.
web/src/components/... Updated various components (ActionButton/Modal/ChallengeItemModal.tsx, ActionButton/Modal/RemoveModal.tsx, EnsureAuth.tsx) to include authentication checks.
web/src/hooks/... Added new hooks (useUserSettings.tsx, useSessionStorage.ts) for state management and session storage.
web/src/layout/... Updated layout components (Header/navbar/Menu/Settings/Notifications/...) to handle user settings with authentication and better state management.
web/src/pages/... Updated pages (SubmitItem/index.tsx, SubmitList/index.tsx) to include authentication checks using EnsureAuth component.
web/src/types/... Added type definitions for Supabase database tables and structures (supabase-datalake.ts, supabase-notification.ts).
web/src/utils/... Added utility functions for user authorization and IPFS upload with authentication (authoriseUser.ts, uploadFileToIPFS.ts, uploadSettingsToSupabase.ts).

Sequence Diagram(s) (Beta)

sequenceDiagram
    participant User
    participant Browser
    participant Netlify
    participant Function
    participant Database

    User->>Browser: Request access
    Browser->>Netlify: Send request with JWT
    Netlify->>Function: Call authMiddleware
    Function->>Database: Verify JWT token
    Database-->>Function: Return user details
    Function-->>Netlify: Return response
    Netlify-->>Browser: Send response
    Browser-->>User: Display content
Loading

Poem

In the land of code, where functions thrive,
Authentication blooms, making apps alive.
With tokens and nonces, secure and bright,
User settings dance in the moonlight.
Netlify builds, scripts in hand,
Together they craft a digital land.
🐇✨


Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share
Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>.
    • 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 generate interesting stats about this repository and render them as a table.
    • @coderabbitai show all the console.log statements in this repository.
    • @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 as 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.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration 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 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 for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@Harman-singh-waraich Harman-singh-waraich linked an issue May 29, 2024 that may be closed by this pull request
@jaybuidl
Copy link
Member

@coderabbitai full review

Copy link
Contributor

coderabbitai bot commented May 30, 2024

Actions performed

Full review triggered.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 16

Outside diff range and nitpick comments (8)
web/src/types/supabase-notification.ts (3)

60-77: The hermes-tg-counters table is well-defined. Consider adding a unique index on bot_name if it is expected to be unique to improve query performance.


141-155: The tg-juror-subscriptions table is straightforward. Ensure that juror_address and tg_user_id are indexed for faster lookups.


186-206: The user-settings table structure is appropriate for storing user preferences. Consider implementing caching strategies for frequently accessed settings to enhance performance.

web/src/types/supabase-datalake.ts (5)

51-65: The derived-accounts table is straightforward. Ensure that account and derived are indexed for faster lookups.


90-128: The historical table is well-structured for logging historical data. Consider implementing data retention policies to manage the growth of this table effectively.


177-203: The poh-vouchdb table is correctly defined for handling Proof of Humanity vouches. Ensure that chainId, claimer, pohId, and voucher are indexed for efficient querying.


204-221: The pohv2-events table is well-defined for event logging. Consider adding error handling strategies for transaction logging to ensure data integrity.


244-257: The sce-heights table is straightforward and well-defined. Ensure that height and network are indexed for efficient queries.

Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between b746fe9 and 4860e8e.

Files ignored due to path filters (1)
  • yarn.lock is excluded by !**/*.lock
Files selected for processing (26)
  • web/.gitignore (1 hunks)
  • web/netlify.toml (1 hunks)
  • web/netlify/functions/authUser.ts (1 hunks)
  • web/netlify/functions/fetch-settings.ts (1 hunks)
  • web/netlify/functions/getNonce.ts (1 hunks)
  • web/netlify/functions/update-settings.ts (1 hunks)
  • web/netlify/functions/uploadToIPFS.ts (4 hunks)
  • web/netlify/middleware/authMiddleware.ts (1 hunks)
  • web/package.json (4 hunks)
  • web/scripts/generateBuildInfo.sh (1 hunks)
  • web/scripts/runEnv.sh (1 hunks)
  • web/src/components/ActionButton/Modal/ChallengeItemModal.tsx (2 hunks)
  • web/src/components/ActionButton/Modal/RemoveModal.tsx (2 hunks)
  • web/src/components/EnsureAuth.tsx (1 hunks)
  • web/src/hooks/queries/useUserSettings.tsx (1 hunks)
  • web/src/hooks/useSessionStorage.ts (1 hunks)
  • web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/FormContact.tsx (3 hunks)
  • web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/index.tsx (4 hunks)
  • web/src/layout/Header/navbar/Menu/Settings/Notifications/index.tsx (2 hunks)
  • web/src/pages/SubmitItem/index.tsx (3 hunks)
  • web/src/pages/SubmitList/index.tsx (3 hunks)
  • web/src/types/supabase-datalake.ts (1 hunks)
  • web/src/types/supabase-notification.ts (1 hunks)
  • web/src/utils/authoriseUser.ts (1 hunks)
  • web/src/utils/uploadFileToIPFS.ts (2 hunks)
  • web/src/utils/uploadSettingsToSupabase.ts (1 hunks)
Additional context used
Shellcheck
web/scripts/generateBuildInfo.sh

[info] 6-6: Double quote to prevent globbing and word splitting.

web/scripts/runEnv.sh

[warning] 7-7: Assigning an array to a string! Assign as array, or use * instead of @ to concatenate.


[info] 10-10: Double quote to prevent globbing and word splitting.


[error] 15-15: Arrays implicitly concatenate in [[ ]]. Use a loop (or explicit * instead of @).


[warning] 15-15: Remove quotes from right-hand side of =~ to match as a regex rather than literally.


[error] 16-16: Argument mixes string and array. Use * or separate argument.


[warning] 22-22: ShellCheck can't follow non-constant source. Use a directive to specify location.


[info] 22-22: Double quote to prevent globbing and word splitting.


[warning] 23-23: ShellCheck can't follow non-constant source. Use a directive to specify location.


[info] 23-23: Double quote to prevent globbing and word splitting.


[info] 25-25: Double quote to prevent globbing and word splitting.

Biome
web/src/hooks/queries/useUserSettings.tsx

[error] 10-10: Do not use template literals if interpolation and special-character handling are not needed.


[error] 16-16: Do not use template literals if interpolation and special-character handling are not needed.


[error] 12-12: Use Number.Infinity instead of the equivalent global.

web/netlify/functions/fetch-settings.ts

[error] 12-12: Forbidden non-null assertion.


[error] 12-12: Forbidden non-null assertion.


[error] 21-21: Do not use template literals if interpolation and special-character handling are not needed.


[error] 3-4: All these imports are only used as types.

web/netlify/middleware/authMiddleware.ts

[error] 12-12: Do not use template literals if interpolation and special-character handling are not needed.

web/src/layout/Header/navbar/Menu/Settings/Notifications/index.tsx

[error] 1-1: All these imports are only used as types.


[error] 2-3: All these imports are only used as types.

web/netlify/functions/getNonce.ts

[error] 28-28: Forbidden non-null assertion.


[error] 28-28: Forbidden non-null assertion.


[error] 6-7: All these imports are only used as types.

web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/FormContact.tsx

[error] 1-1: The default import and some named imports are only used as types.


[error] 49-49: This hook does not specify all of its dependencies: isEditing

web/src/utils/authoriseUser.ts

[error] 12-12: Do not use template literals if interpolation and special-character handling are not needed.


[error] 26-26: Do not use template literals if interpolation and special-character handling are not needed.

web/src/pages/SubmitItem/index.tsx

[error] 49-49: Unsafe usage of optional chaining.


[error] 55-55: Change to an optional chain.


[error] 1-1: The default import is only used as a type.

web/src/components/EnsureAuth.tsx

[error] 57-57: The computed expression can be simplified without the use of a string literal.


[error] 1-1: The default import is only used as a type.

web/netlify/functions/uploadToIPFS.ts

[error] 97-97: Unexpected any. Specify a different type.


[error] 1-2: Some named imports are only used as types.

web/netlify/functions/update-settings.ts

[error] 15-15: Unexpected any. Specify a different type.


[error] 67-67: Forbidden non-null assertion.


[error] 67-67: Forbidden non-null assertion.


[error] 5-6: All these imports are only used as types.

web/src/pages/SubmitList/index.tsx

[error] 1-1: All these imports are only used as types.

web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/index.tsx

[error] 1-1: The default import is only used as a type.


[error] 10-11: All these imports are only used as types.


[error] 52-52: This hook does not specify all of its dependencies: refetchUserSettings


[error] 52-52: This hook specifies more dependencies than necessary: address

web/netlify/functions/authUser.ts

[error] 50-50: Do not use template literals if interpolation and special-character handling are not needed.


[error] 55-55: Do not use template literals if interpolation and special-character handling are not needed.


[error] 63-63: Forbidden non-null assertion.


[error] 63-63: Forbidden non-null assertion.


[error] 10-11: All these imports are only used as types.

web/src/components/ActionButton/Modal/RemoveModal.tsx

[error] 28-31: Template literals are preferred over string concatenation.


[error] 31-31: Do not use template literals if interpolation and special-character handling are not needed.


[error] 109-109: The computed expression can be simplified without the use of a string literal.


[error] 1-1: The default import is only used as a type.


[error] 6-7: All these imports are only used as types.


[error] 15-16: Some named imports are only used as types.


[error] 63-63: This hook specifies more dependencies than necessary: isLoadingExtradata

web/src/components/ActionButton/Modal/ChallengeItemModal.tsx

[error] 26-26: This enum declaration contains members that are implicitly initialized.


[error] 133-133: The computed expression can be simplified without the use of a string literal.


[error] 1-1: The default import is only used as a type.


[error] 15-16: All these imports are only used as types.


[error] 16-17: Some named imports are only used as types.


[error] 75-75: This hook does not specify all of its dependencies: challengeType


[error] 85-85: This hook does not specify all of its dependencies: isLoadingExtradata

Additional comments not posted (29)
web/netlify.toml (1)

1-14: Configuration settings in netlify.toml look good and align with the PR objectives.

web/.gitignore (1)

33-33: The addition of generatedNetlifyInfo.json to .gitignore is appropriate to avoid tracking generated files in version control.

web/src/hooks/useSessionStorage.ts (1)

1-22: The implementation of useSessionStorage hook looks good and follows best practices for managing session storage in React.

web/src/utils/uploadFileToIPFS.ts (1)

Line range hint 5-18: The implementation of uploadFileToIPFS function looks good and correctly handles authentication tokens for secure file uploads.

web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/FormContact.tsx (1)

27-27: Add optional isEditing prop to IForm interface.

This addition allows conditional validation and UI changes based on whether the form is in editing mode.

web/src/pages/SubmitItem/index.tsx (2)

36-38: Define a styled version of EnsureAuth.

This styled component centralizes the authentication logic while allowing for specific styling, which enhances modularity and maintainability.


70-80: Wrap sensitive routes in EnsureAuth to secure them.

This change ensures that only authenticated users can access certain routes, enhancing the security of the application.

web/src/components/EnsureAuth.tsx (1)

74-94: Implement createSiweMessage to generate SIWE messages.

This function is crucial for generating standardized messages for Ethereum-based authentication, aligning with best practices for decentralized applications.

web/netlify/functions/uploadToIPFS.ts (1)

Line range hint 69-104: Refactor uploadToIpfs to handle file uploads with authentication.

This function now properly checks for required query parameters and handles errors, ensuring robustness and security in file uploads.

web/netlify/functions/update-settings.ts (1)

15-88: Enhance input validation and error handling in updateSettings.

The function now includes comprehensive checks for required and unexpected keys, proper formatting validation, and secure database interactions, significantly improving the robustness and security of the settings update process.

web/src/pages/SubmitList/index.tsx (2)

20-20: LGTM! The addition of EnsureAuth and StyledEnsureAuth aligns with the PR's objective to enhance authentication for sensitive operations.

Also applies to: 42-44


81-98: LGTM! The use of StyledEnsureAuth to wrap the form routes ensures that these operations are secured and accessible only to authenticated users.

web/src/layout/Header/navbar/Menu/Settings/Notifications/FormContactDetails/index.tsx (2)

40-61: LGTM! The use of useUserSettings to fetch and manage user settings dynamically enhances the component's functionality and user experience.


68-82: LGTM! The form submission logic is well-implemented, correctly handling the update of user settings and providing appropriate feedback to the user.

web/package.json (1)

Line range hint 76-109: LGTM! The addition of new dependencies such as @middy/core, @middy/http-json-body-parser, jose, and siwe are essential for the middleware and authentication functionalities introduced in this PR.

web/netlify/functions/authUser.ts (1)

13-112: LGTM! The authUser function is well-implemented with robust error handling, security checks, and middleware usage, enhancing the authentication process.

web/src/components/ActionButton/Modal/RemoveModal.tsx (1)

92-131: LGTM! The use of EnsureAuth to secure the removal process is a crucial security enhancement, ensuring that only authenticated users can perform this operation.

web/src/components/ActionButton/Modal/ChallengeItemModal.tsx (1)

116-155: LGTM! The use of EnsureAuth to secure the challenge process is a crucial security enhancement, ensuring that only authenticated users can perform this operation.

web/src/types/supabase-notification.ts (4)

1-1: Type definition for JSON is comprehensive and correctly handles nested structures.


3-242: The Database interface structure is well-organized, covering various tables with appropriate types for rows, inserts, and updates.


156-185: The user-public-messages table correctly uses nullable types for optional fields. Review the use of id to ensure it is appropriately set as a primary key or unique identifier.


27-59: The discord-broadcast table includes nullable types where appropriate, reflecting optional data. Ensure that the use of nullables aligns with business logic.

web/src/types/supabase-datalake.ts (7)

1-1: Type definition for JSON is comprehensive and correctly handles nested structures.


3-296: The Database interface structure is well-organized, covering various tables with appropriate types for rows, inserts, and updates.


222-242: The sce-contracts table includes a Json type for contract, which is appropriate for storing structured data. Validate the JSON structure before insertion to prevent schema violations.


6-28: The CIDs table structure is correctly defined. Ensure that the use of nullable types for estuary, file_headers, threat_detected, and verified is justified by business requirements.


129-152: The logbook table is defined to track process logs. Ensure that lastSeenBlock, network, and unix are appropriately used and indexed if they serve as common query parameters.


154-176: The mainnet-justifications table uses nullable types extensively. Review the business logic to ensure that this flexibility is required and does not compromise data quality.


258-281: The sepolia-justifications table uses nullable types extensively. Review the business logic to ensure that this flexibility is required and does not compromise data quality.

web/scripts/generateBuildInfo.sh Outdated Show resolved Hide resolved
web/src/utils/authoriseUser.ts Outdated Show resolved Hide resolved
web/scripts/runEnv.sh Outdated Show resolved Hide resolved
web/src/hooks/queries/useUserSettings.tsx Outdated Show resolved Hide resolved
web/src/types/supabase-notification.ts Show resolved Hide resolved
web/src/types/supabase-notification.ts Show resolved Hide resolved
web/src/types/supabase-notification.ts Show resolved Hide resolved
web/src/types/supabase-datalake.ts Show resolved Hide resolved
web/src/types/supabase-datalake.ts Show resolved Hide resolved
jaybuidl and others added 3 commits May 30, 2024 18:40
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
jaybuidl
jaybuidl previously approved these changes May 30, 2024
@jaybuidl jaybuidl requested review from alcercu and kemuru May 30, 2024 17:54
@jaybuidl
Copy link
Member

LGTM

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
coderabbitai[bot]
coderabbitai bot previously approved these changes May 31, 2024
@jaybuidl jaybuidl merged commit 5f44cb5 into master Jun 3, 2024
6 checks passed
@jaybuidl jaybuidl deleted the feat/siwe-authentication-for-file-uploads-and-notifications branch June 3, 2024 14:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Curate v2 - SIWE + Notification settings
2 participants