feat: new qr login logic

gaboesquivel commented 1 week ago

Summary by Sourcery

Implement a new QR login logic for Bitcash Wallet, refactor UI components for better accessibility and consistency, and streamline the session dialog by integrating login and registration processes.

New Features:

Introduce a new QR login logic that allows users to login or register using a QR code with the Bitcash Wallet.

Enhancements:

Refactor the StepsSection component to use semantic HTML elements like
and
for better accessibility.
Update the button variants to include a new 'tertiary' style for improved UI consistency.
Modify the session dialog to streamline the login and registration process by removing the register dialog content and integrating it into the login dialog.

Chores:

Remove the unused 'register-dialog-content.tsx' file to clean up the codebase.

Summary by CodeRabbit

New Features
- Updated login dialog to enhance user guidance with clearer titles and descriptions.
- Introduced a new button variant, "tertiary," for improved visual options.
Improvements
- Simplified session dialog structure for a more direct user experience.
- Enhanced styling of headers and buttons for better visibility and accessibility.
Bug Fixes
- Improved session management and referral handling logic for robustness.
Style
- Increased font size for headers and adjusted button styles for a more cohesive design.

vercel[bot] commented 1 week ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
bitlauncher	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 6, 2024 4:24am
smartsale-faucet	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 6, 2024 4:24am

coderabbitai[bot] commented 1 week ago

Walkthrough

The changes across various components of the web application focus on simplifying state management, enhancing semantic HTML structure, and improving user interface elements. Notable modifications include updates to dialog content handling, button labels, and styling adjustments in headers and sections. Additionally, new button variants were introduced, and the referral handling logic was made more dynamic based on the environment.

Changes

Files	Change Summary
`apps/webapp/components/dialogs/session/...`	Simplified `SessionDialogContent` by removing the `updateDialogContent` prop and enhancing user guidance in titles and descriptions. `SessionDialog` now directly renders `SessionDialogContent`.
`apps/webapp/components/routes/home/...`	Increased header font size in `Features` and improved semantic structure in `StepsSection` by changing `div` to `h3` and `p`.
`apps/webapp/components/shared/referral-hero-banner.tsx`	Changed button variant from `accent` to `tertiary`.
`apps/webapp/components/ui/button.tsx`	Introduced a new `tertiary` button variant with specific styling properties.
`apps/webapp/hooks/use-referral.ts`	Updated referral handling to use dynamic constants for URI and referrer based on the environment.
`apps/webapp/hooks/use-session.tsx`	Enhanced session management and login URI generation.
`apps/webapp/hooks/use-signing-request.ts`	Changed URL parameter key from `esr_code` to `esr`.
`apps/webapp/tailwind.config.js`	Modified color properties in the theme, expanding `tertiary` and introducing a new structure for `accent`.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant SessionDialog
    participant SessionDialogContent

    User->>SessionDialog: Open Dialog
    SessionDialog->>SessionDialogContent: Render Content
    User->>SessionDialogContent: Scan QR Code
    SessionDialogContent-->>User: Login/Register

🐰 "In a world of code and light,
Changes hop with pure delight.
Buttons bright, and dialogs clear,
A smoother path for all to steer.
With every tweak, we bounce and play,
Hooray for updates, hip-hip-hooray!" 🐇✨

[!WARNING]

Review ran into problems

Problems (1)
* Git: Failed to clone repository. Please contact CodeRabbit support.

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

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

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 .` - `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 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` 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](https://discord.com/invite/GsXnASn26c) to get help, request features, and share feedback. - Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

AndlerRL commented 1 week ago

@gaboesquivel -- feature working. Tested locally and on preview on both desktop and mobile.

Here is a video from @Bran18, he was doing login and the BSR appeared on AccessView (logout) however, Brandon did login by choice on the video. Pop-up is now showing on all screens.

https://github.com/user-attachments/assets/df170e38-3a9e-4e34-8112-fdaa26472e44

sourcery-ai[bot] commented 1 week ago

Reviewer's Guide by Sourcery

This pull request implements a new QR login logic for the webapp. It updates the login dialog, session management, and related components to improve the user experience and integrate with the Bitcash wallet. The changes focus on streamlining the login process, enhancing the UI, and refactoring code for better maintainability.

File-Level Changes

Change	Details	Files
Updated login dialog UI and functionality	Simplified dialog content to focus on QR code scanning Added a link to learn more about the Bitcash KYC process Removed separate register dialog content Updated text and styling for better clarity	`apps/webapp/components/dialogs/session/login-dialog-content.tsx` `apps/webapp/components/dialogs/session/session-dialog.tsx`
Refactored session management and login process	Updated loginUri generation to include Bitcash register URI Modified login redirect logic for better integration with Bitcash wallet Added default URIs and referrers for different environments	`apps/webapp/hooks/use-session.tsx` `apps/webapp/hooks/use-referral.ts`
Updated UI components and styling	Modified button variants and colors Updated text sizes and layout in various components Adjusted Tailwind configuration for new color schemes	`apps/webapp/components/routes/home/section/steps-section.tsx` `apps/webapp/components/routes/home/features.tsx` `apps/webapp/components/shared/referral-hero-banner.tsx` `apps/webapp/components/ui/button.tsx` `apps/webapp/tailwind.config.js`
Improved mobile compatibility and QR code handling	Updated QR code generation and handling for login Modified signing request process for mobile devices	`apps/webapp/hooks/use-signing-request.ts`

Tips

- Trigger a new Sourcery review by commenting `@sourcery-ai review` on the pull request. - Continue your discussion with Sourcery by replying directly to review comments. - You can change your review settings at any time by accessing your [dashboard](https://app.sourcery.ai): - Enable or disable the Sourcery-generated pull request summary or reviewer's guide; - Change the review language; - You can always [contact us](mailto:support@sourcery.ai) if you have any questions or feedback.

bitcashorg / smartsale