refactor: finance sections #391
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Updated `finance-deposit-modal.tsx` to enable the 'Stripe' tab. - Implemented a placeholder UI in `finance-deposit-from-stripe.tsx` with a "coming soon" message, description, and illustration to inform users about the upcoming feature.
- Updated `finance-deposit-from-metamask.tsx` to add `sx={{ m: 4 }}` style prop, ensuring consistent button spacing.
- This improves the UI alignment and visuals for the Metamask connect button.
- Updated `package.json` to include `@metamask/sdk-react` version ^0.31.4. - This enables integration of MetaMask functionalities in the project.
- Updated `chunkSize` in `FinanceContacts` component from 3 to 2. - This change ensures better alignment and improved user experience when displaying the contacts list.
- Updated `src/config-global.ts` to include `INFURA_API_KEY` in the global configuration. - Fetches the key from either `process.env` or `import.meta.env` variables. This addition enables seamless integration with Infura services.
- Replace the existing wallet connection logic with MetaMask SDK in `finance-deposit-from-metamask.tsx`. - Add loading state (`loadingMetamask`) and display `LoadingScreen` during MetaMask initialization. - Implement wallet reconnection logic using localStorage to persist connection state. - Update UI to handle MetaMask connection and improve error handling via `enqueueSnackbar`.
- **finance-withdraw-from-metamask.tsx**: - Added `LoadingScreen` and `loadingMetamask` state for better UX during wallet connection. - Replaced alert with `enqueueSnackbar` for error handling. - Automatically connect wallet if previously connected using localStorage. - Added autofocus to the withdraw amount input. - **finance-withdraw-from-smart-account.tsx**: - Added autofocus to the withdraw amount input. - **finance-deposit-from-metamask.tsx**: - Added autofocus to the deposit amount input. - **finance-deposit-from-smart-account.tsx**: - Added autofocus to the deposit amount input. - Minor formatting fix (removed trailing whitespace).
- `src/sections/finance/index.tsx`: Added responsive tab-based layout for smaller viewports and updated grid structure for better UX. Introduced TabsComponent. - `src/sections/finance/components/finance-overlay-loader.tsx`: Added a new component to display loading overlays consistently. - `src/sections/finance/components/finance-balance-statistics.tsx`: Integrated `FinanceOverlayLoader` for loading states. - `src/sections/finance/components/finance-transactions-history.tsx`: Added `FinanceOverlayLoader` and enhanced `TableNoData` integration for loading states. - `src/components/table/table-no-data.tsx`: Modified content to show "Loading..." dynamically during loading states. - `src/sections/finance/components/finance-transactions-table-row.tsx`: Removed unused `type` variable and eliminated logging.
- Updated `src/layouts/_common/header-balance.tsx`: - Imported `Iconify` for icon usage. - Added a new button labeled "Earn tokens" with a trophy icon. - Implemented a click handler to open an external link to "tropee.com/watchit" in a new tab.
- **src/sections/finance/index.tsx**: Integrated `FinanceEarnTokens` component for both large and small viewports to enable users to earn MMC tokens. - **src/layouts/_common/header-balance.tsx**: Removed "Earn Tokens" button and associated logic, delegating functionality to the new component. - **src/sections/finance/components/finance-earn-tokens.tsx**: Created a reusable `FinanceEarnTokens` component featuring tasks and invitations to earn rewards. - **src/assets/illustrations/earn.svg**: Added an illustration asset for the `FinanceEarnTokens` component.
- Updated `maxWidth` for container alignment for XS and MD breakpoints in `finance-earn-tokens.tsx`. - Increased `Typography` width limits for better text readability. - Added margin-top spacing to `Button` in larger screen sizes (`
- Updated `FinanceQuickTransfer` to conditionally render based on `mdUp` breakpoint in `src/sections/finance/index.tsx`. - Introduced `mdUp` variable for better readability and alignment with existing responsive logic. - Simplified conditional rendering for improved maintainability.
…the provider, also made a refactor to finance withdraw and metamask connect and added errors helper
- `finance-quick-actions.tsx`: Structured imports into groups for clarity. - `finance-balance-statistics.tsx`: Added missing grouping and comments for imports. - `finance-overlay-loader.tsx`: Reordered imports for better organization. - `finance-external-wallet.tsx`: Grouped and commented imports for consistency. - `finance-contacts.tsx`: Adjusted import grouping, moved `react-redux` higher. - `finance-deposit-from-stripe.tsx`: Added comments for logical grouping of imports. - `finance-deposit-from-metamask.tsx`: Reorganized imports and annotated types more cleanly. - `finance-quick-transfer.tsx`: Properly categorized imports for maintainability. - `finance-deposit-from-smart-account.tsx`: Refactored import structure. - `finance-earn-tokens.tsx`: Improved grouping and consistency in import placement. - `finance-dialogs-actions.tsx`: Grouped and added comments for imports. - `finance-deposit.tsx`: Restructured and logically grouped imports. - `finance-change-wallet.tsx`: Consolidated and commented imports for better readability.
…efactor/finance # Conflicts: # src/sections/finance/components/finance-deposit-from-metamask.tsx # src/sections/finance/components/finance-quick-transfer.tsx
- Moved React and library imports to the top for better structure. - Grouped and reordered Redux imports for improved readability. - Removed duplicated import statements to avoid redundancy.
- Moved `redux` imports together for better grouping. - Added `lens-protocol` and `ethers` imports under a new `API Lens and ethers` comment section. - Reorganized project component imports for clarity and consistency.
- Introduced `internal-notifications.ts` to centralize notifications and remove repeated `enqueueSnackbar` calls across components. - Replaced `enqueueSnackbar` in `finance-withdraw`, `finance-withdraw-from-metamask`, and `finance-deposit-from-metamask` with the new functions `notifyError`, `notifySuccess`, and `notifyWarning`. - Updated `finance-deposit` to utilize centralized notifications and success/error definitions. - Updated `finance-transfer-accounts` by adding placeholder comments for review. - Replaced `setGlobalErrorNotifier` with `setGlobalNotifier` for generalized handling. Reduced code duplication, enhanced maintainability, and ensured consistent notification handling throughout the project.
- `src/sections/user/profile-header.tsx`: Replaced snackbar with notification utilities for success/error; adjusted import order. - `src/sections/finance/components/*`: Standardized imports (quotes, formatting), improved readability with better indentation, and refactored JSX code alignment. - Updated key wallet/modal components (e.g., `finance-deposit-from-metamask`) with consistent spacing and organized props structure.
- Added 'info' type to `NotificationType` for broader support. - Removed unused `options` parameter in `notify()` function and updated its usage. - Improved error message in case of missing `globalEnqueueSnackbar`. - Updated internal references of `type` to `typeNotification` for clarity. - Fixed outdated comments to align with the latest notification logic.
- Updated `finance-deposit-from-metamask.tsx` to wrap `LoadingScreen` with a `Box` component from Material-UI and added a margin (`m:2`) for improved spacing. - This enhances the UI by creating more visual separation and better layout consistency.
- Updated import path for `setGlobalNotifier` in `snackbar-provider.tsx` from `@src/utils/notifications/internal-notifications.ts` to `@notifications/internal-notifications.ts`. - This improves module resolution consistency and maintains cleaner imports.
- Updated `handleAction` in `follow-unfollow-button.tsx` to support detailed notification messages with `profileName` and `actionLbl`. - Replaced `getFollowMessage` helper function with direct use of `notifySuccess`. - Adjusted success message template in `success.ts` for dynamic `actionLbl` and `profileName`.
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR integrate several changes