Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughRefactors Button usage project-wide: removed the old common Button, introduced a new UI Button at Changes
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes
Possibly related PRs
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 9
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/components/Borrow/WithdrawCollateralAndRepay.tsx (1)
220-226: Fix BigInt comparisons in LTV progress bar
withdrawAmountandrepayAssetsarebigint, but they’re compared to0(anumber), which will throw at runtime and/or fail TS type-checking. Use0nconsistently:- className={`h-2 rounded-full transition-all duration-500 ease-in-out ${getLTVProgressColor( - withdrawAmount > 0 || repayAssets > 0 ? newLTV : currentLTV, - lltv, - )}`} + className={`h-2 rounded-full transition-all duration-500 ease-in-out ${getLTVProgressColor( + withdrawAmount > 0n || repayAssets > 0n ? newLTV : currentLTV, + lltv, + )}`} ... - width: `${Math.min(100, (Number(withdrawAmount > 0 || repayAssets > 0 ? newLTV : currentLTV) / Number(lltv)) * 100)}%`, + width: `${Math.min( + 100, + (Number(withdrawAmount > 0n || repayAssets > 0n ? newLTV : currentLTV) / Number(lltv)) * 100, + )}%`,app/autovault/[chainId]/[vaultAddress]/components/settings/GeneralTab.tsx (1)
88-136: HeroUIInputprops are invalid (variant="ghost"anddisabled)The
@heroui/reactInput component (v2.4.2) does not supportvariant="ghost"or thedisabledprop. The documented variants areflat | bordered | faded | underlined, and the correct prop isisDisabled(boolean).There are no custom type augmentations in this repository that would make these props valid.
Fix both Input instances to use:
- <Input - variant="ghost" + <Input + variant="flat" - disabled={!isOwner} + isDisabled={!isOwner}and similarly for the symbol field.
🧹 Nitpick comments (10)
app/markets/components/MarketRowDetail.tsx (1)
12-44: Responsive layout looks good.The three-panel flex layout with consistent
lg:w-1/3widths is clean. One minor note: withlg:gap-6, each panel will be slightly less than 1/3 width since gaps consume space. If precise widths matter, CSS Grid withgrid-cols-3would maintain exact thirds.app/autovault/components/VaultListV2.tsx (1)
134-139: Button variant change is fine; consider aligning import with new Button APIUsing
variant="surface"for the Manage button looks fine; if the broader refactor is standardizing on@/components/ui/button, consider switching this file off@/components/commonfor consistency.app/autovault/components/deployment/DeploymentModal.tsx (1)
107-119: Deploy button wiring matches new Button APIVariant,
onClick, anddisabledconditions all look consistent with the previous behavior; if you want to make the handler a bit clearer, you could writeonClick={needSwitchChain ? switchToNetwork : () => { void createVault(); }}instead.app/rewards/components/RewardTable.tsx (1)
9-10: Reward action buttons correctly migrated and guardedThe switch to
@/components/ui/buttonwithvariant="surface"plusdisabledchecks on zero-claimable and missingdistributionlook correct; the existing async claim flow (network switch +sendTransaction) remains intact, though you could optionally extract that handler out of JSX later for readability.Also applies to: 188-238
app/positions/components/PositionsSummaryTable.tsx (1)
420-435: Redundant owner check.The
onClickguard (lines 425-428) is unreachable whendisabled={!isOwner}prevents the click. Either remove the inline check or removedisabledif you want to show the toast.<Button size="sm" variant="surface" className="text-xs" onClick={() => { - if (!isOwner) { - toast.error('No authorization', 'You can only rebalance your own positions'); - return; - } setSelectedGroupedPosition(groupedPosition); setShowRebalanceModal(true); }} disabled={!isOwner} >src/components/SupplyModalContent.tsx (1)
14-14: Import order is inconsistent.The Button import is placed after the component-level imports. Consider grouping it with other
@/imports (lines 5-13).import { formatBalance } from '@/utils/balance'; import { getNativeTokenSymbol } from '@/utils/networks'; import { isWrappedNativeToken } from '@/utils/tokens'; import type { Market } from '@/utils/types'; +import { Button } from '@/components/ui/button'; import { SupplyProcessModal } from './SupplyProcessModal'; -import { Button } from '@/components/ui/button';src/components/ui/button.tsx (1)
27-28: Duplicate size definitions.
mdanddefaulthave identical styles. Consider removing one to avoid confusion.sm: 'h-8 px-1.5 py-1 text-xs min-w-[64px]', - md: 'h-10 px-4 py-2 text-sm min-w-[80px]', default: 'h-10 px-4 py-2 text-sm min-w-[80px]', + md: 'h-10 px-4 py-2 text-sm min-w-[80px]', // alias for default lg: 'h-12 px-6 py-3 text-base min-w-[96px]',Or just use
mdeverywhere and dropdefault.app/autovault/[chainId]/[vaultAddress]/components/VaultInitializationModal.tsx (1)
6-365: Standardize Button import to@/components/ui/buttonThe step CTAs and Back/Skip/Complete buttons now use
onClick/disabledcorrectly and keep the previous flow. To stay consistent with the rest of this PR, consider switching the import to the new UI Button module:-import { Button } from '@/components/common'; +import { Button } from '@/components/ui/button';app/positions/components/onboarding/AssetSelection.tsx (1)
6-6: Align Button props with the new Button APIEverywhere else the new Button uses
variant, but this usage still passescolor="primary". To avoid relying on a possibly unused prop and to stay consistent:- <Link href="/markets"> - <Button - color="primary" - className="rounded" - > + <Link href="/markets"> + <Button + variant="primary" + className="rounded" + >Also applies to: 99-104
app/markets/components/markets.tsx (1)
580-591: Icon toolbar Buttons look good; add an aria-label for RefreshThe switch to
variant="ghost"/size="icon"with span-wrapped Buttons underTooltipis clean and consistent. For accessibility, consider labeling the Refresh button like the others:- <span> - <Button - disabled={loading || isRefetching} - variant="ghost" - size="icon" - className="text-secondary" - onClick={handleRefresh} - > + <span> + <Button + disabled={loading || isRefetching} + variant="ghost" + size="icon" + className="text-secondary" + aria-label="Refresh" + onClick={handleRefresh} + > <ReloadIcon className={isRefetching ? 'animate-spin' : ''} /> </Button> </span>Also applies to: 612-623, 638-648
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (2)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/fonts/KodeMono/KodeMono-VariableFont_wght.ttfis excluded by!**/*.ttf
📒 Files selected for processing (63)
.claude/settings.local.json(1 hunks).prettierignore(0 hunks)app/HomePage.tsx(10 hunks)app/admin/stats/page.tsx(5 hunks)app/autovault/[chainId]/[vaultAddress]/components/DepositToVaultModal.tsx(2 hunks)app/autovault/[chainId]/[vaultAddress]/components/VaultInitializationModal.tsx(5 hunks)app/autovault/[chainId]/[vaultAddress]/components/settings/AgentsTab.tsx(5 hunks)app/autovault/[chainId]/[vaultAddress]/components/settings/CurrentCaps.tsx(2 hunks)app/autovault/[chainId]/[vaultAddress]/components/settings/EditCaps.tsx(3 hunks)app/autovault/[chainId]/[vaultAddress]/components/settings/GeneralTab.tsx(4 hunks)app/autovault/[chainId]/[vaultAddress]/content.tsx(6 hunks)app/autovault/components/AutovaultContent.tsx(2 hunks)app/autovault/components/VaultListV2.tsx(1 hunks)app/autovault/components/deployment/DeploymentModal.tsx(1 hunks)app/error.tsx(2 hunks)app/global-error.tsx(2 hunks)app/history/components/HistoryTable.tsx(1 hunks)app/market/[chainId]/[marketid]/components/BorrowsTable.tsx(2 hunks)app/market/[chainId]/[marketid]/components/CampaignModal.tsx(2 hunks)app/market/[chainId]/[marketid]/components/SuppliesTable.tsx(2 hunks)app/market/[chainId]/[marketid]/components/TransactionFiltersModal.tsx(2 hunks)app/market/[chainId]/[marketid]/content.tsx(3 hunks)app/markets/components/BlacklistConfirmationModal.tsx(2 hunks)app/markets/components/MarketActionsDropdown.tsx(2 hunks)app/markets/components/MarketRowDetail.tsx(3 hunks)app/markets/components/MarketSettingsModal.tsx(4 hunks)app/markets/components/markets.tsx(4 hunks)app/positions/components/FromMarketsTable.tsx(2 hunks)app/positions/components/PositionsContent.tsx(3 hunks)app/positions/components/PositionsSummaryTable.tsx(5 hunks)app/positions/components/RebalanceActionRow.tsx(2 hunks)app/positions/components/RebalanceModal.tsx(2 hunks)app/positions/components/SuppliedMarketsDetail.tsx(3 hunks)app/positions/components/onboarding/AssetSelection.tsx(1 hunks)app/positions/components/onboarding/MarketSelectionOnboarding.tsx(3 hunks)app/positions/components/onboarding/SetupPositions.tsx(2 hunks)app/positions/components/onboarding/SuccessPage.tsx(2 hunks)app/positions/report/components/ReportContent.tsx(2 hunks)app/rewards/components/RewardContent.tsx(1 hunks)app/rewards/components/RewardTable.tsx(2 hunks)app/settings/page.tsx(3 hunks)app/tools/page.tsx(2 hunks)docs/Styling.md(7 hunks)package.json(2 hunks)src/components/Borrow/AddCollateralAndBorrow.tsx(3 hunks)src/components/Borrow/WithdrawCollateralAndRepay.tsx(3 hunks)src/components/BorrowModal.tsx(2 hunks)src/components/Info/info.tsx(1 hunks)src/components/Input/Input.tsx(2 hunks)src/components/RiskNotificationModal.tsx(2 hunks)src/components/SupplyModalContent.tsx(2 hunks)src/components/WithdrawModalContent.tsx(2 hunks)src/components/common/Button.tsx(0 hunks)src/components/common/MarketSelectionModal.tsx(3 hunks)src/components/common/MarketsTableWithSameLoanAsset.tsx(3 hunks)src/components/common/SuppliedAssetFilterCompactSwitch.tsx(3 hunks)src/components/common/index.ts(0 hunks)src/components/layout/header/AccountConnect.tsx(2 hunks)src/components/settings/BlacklistedMarketsModal.tsx(6 hunks)src/components/settings/CustomRpcSettings.tsx(5 hunks)src/components/settings/TrustedVaultsModal.tsx(3 hunks)src/components/ui/button.tsx(2 hunks)tailwind.config.ts.deprecated(0 hunks)
💤 Files with no reviewable changes (4)
- .prettierignore
- src/components/common/index.ts
- src/components/common/Button.tsx
- tailwind.config.ts.deprecated
🧰 Additional context used
🧠 Learnings (9)
📓 Common learnings
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 94
File: src/components/supplyModal.tsx:449-452
Timestamp: 2024-12-08T12:10:17.127Z
Learning: The 'solid' variant is defined in the new `Button` component and is a valid variant.
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 97
File: app/positions/components/onboarding/OnboardingContext.tsx:36-43
Timestamp: 2024-12-16T02:01:51.219Z
Learning: In `app/positions/components/onboarding/OnboardingContext.tsx`, the `defaultStep` variable is no longer needed and can be removed.
📚 Learning: 2024-12-08T12:10:17.127Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 94
File: src/components/supplyModal.tsx:449-452
Timestamp: 2024-12-08T12:10:17.127Z
Learning: The 'solid' variant is defined in the new `Button` component and is a valid variant.
Applied to files:
app/history/components/HistoryTable.tsxapp/tools/page.tsxapp/markets/components/MarketActionsDropdown.tsxapp/HomePage.tsxsrc/components/common/SuppliedAssetFilterCompactSwitch.tsxsrc/components/settings/CustomRpcSettings.tsxsrc/components/ui/button.tsxapp/positions/components/SuppliedMarketsDetail.tsxapp/market/[chainId]/[marketid]/components/CampaignModal.tsxdocs/Styling.md
📚 Learning: 2024-12-17T10:51:07.277Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 99
File: src/components/AgentSetupProcessModal.tsx:38-51
Timestamp: 2024-12-17T10:51:07.277Z
Learning: In `src/components/AgentSetupProcessModal.tsx`, the modal is intentionally designed without a close button.
Applied to files:
src/components/BorrowModal.tsxapp/autovault/[chainId]/[vaultAddress]/components/VaultInitializationModal.tsxsrc/components/common/MarketSelectionModal.tsxapp/autovault/components/deployment/DeploymentModal.tsxsrc/components/settings/BlacklistedMarketsModal.tsxsrc/components/common/SuppliedAssetFilterCompactSwitch.tsxapp/market/[chainId]/[marketid]/components/TransactionFiltersModal.tsxsrc/components/WithdrawModalContent.tsxapp/autovault/[chainId]/[vaultAddress]/components/settings/AgentsTab.tsxapp/positions/components/onboarding/SuccessPage.tsxapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/BlacklistConfirmationModal.tsxsrc/components/settings/TrustedVaultsModal.tsxapp/market/[chainId]/[marketid]/components/CampaignModal.tsxapp/markets/components/MarketSettingsModal.tsxdocs/Styling.mdapp/positions/components/RebalanceModal.tsx
📚 Learning: 2024-12-16T02:01:51.219Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 97
File: app/positions/components/onboarding/OnboardingContext.tsx:36-43
Timestamp: 2024-12-16T02:01:51.219Z
Learning: In `app/positions/components/onboarding/OnboardingContext.tsx`, the `defaultStep` variable is no longer needed and can be removed.
Applied to files:
src/components/BorrowModal.tsxapp/autovault/[chainId]/[vaultAddress]/components/VaultInitializationModal.tsxapp/tools/page.tsxapp/HomePage.tsxapp/positions/components/onboarding/SetupPositions.tsxapp/positions/components/onboarding/AssetSelection.tsxsrc/components/WithdrawModalContent.tsxapp/positions/components/onboarding/MarketSelectionOnboarding.tsxapp/positions/components/onboarding/SuccessPage.tsxapp/positions/components/FromMarketsTable.tsxapp/settings/page.tsxapp/positions/components/PositionsContent.tsx
📚 Learning: 2025-12-09T10:06:39.848Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 231
File: src/hooks/useDeployMorphoMarketV1Adapter.ts:3-3
Timestamp: 2025-12-09T10:06:39.848Z
Learning: In Wagmi v3, useConnection is the correct hook to obtain the connected wallet address, chainId, and connection status (isConnected). This replaces the useAccount hook from Wagmi v2. Usage: const { address, chainId, isConnected } = useConnection() from 'wagmi'.
Applied to files:
app/autovault/[chainId]/[vaultAddress]/components/DepositToVaultModal.tsxapp/tools/page.tsxapp/positions/components/PositionsSummaryTable.tsxapp/autovault/components/AutovaultContent.tsxsrc/components/Borrow/WithdrawCollateralAndRepay.tsxapp/autovault/[chainId]/[vaultAddress]/components/settings/AgentsTab.tsxapp/rewards/components/RewardTable.tsxapp/autovault/[chainId]/[vaultAddress]/content.tsxsrc/components/layout/header/AccountConnect.tsx
📚 Learning: 2024-10-12T09:23:16.495Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 63
File: app/markets/components/MarketRowDetail.tsx:49-52
Timestamp: 2024-10-12T09:23:16.495Z
Learning: When rendering oracle feeds in `ExpandedMarketDetail` (`app/markets/components/MarketRowDetail.tsx`), prefer explicit rendering over iterating keys when dealing with a small number of feeds.
Applied to files:
app/markets/components/MarketRowDetail.tsxapp/markets/components/markets.tsx
📚 Learning: 2024-11-25T09:39:42.148Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 87
File: app/home/HomePage.tsx:17-39
Timestamp: 2024-11-25T09:39:42.148Z
Learning: In `app/home/HomePage.tsx`, the `useEffect` hook depends on `[showCustomized]` because changing `showCustomized` triggers updates to the yield and risk terms.
Applied to files:
app/market/[chainId]/[marketid]/content.tsxapp/rewards/components/RewardContent.tsxsrc/components/RiskNotificationModal.tsxapp/positions/components/PositionsSummaryTable.tsxsrc/components/Borrow/WithdrawCollateralAndRepay.tsxapp/positions/components/FromMarketsTable.tsxapp/positions/components/PositionsContent.tsx
📚 Learning: 2025-11-13T20:32:48.908Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 183
File: app/positions/components/RebalanceModal.tsx:301-308
Timestamp: 2025-11-13T20:32:48.908Z
Learning: The TokenIcon component in the codebase accepts a `symbol` prop as part of its valid interface, in addition to `address`, `chainId`, `width`, `height`, and other props.
Applied to files:
app/autovault/[chainId]/[vaultAddress]/components/settings/CurrentCaps.tsxapp/autovault/[chainId]/[vaultAddress]/components/settings/EditCaps.tsxapp/autovault/[chainId]/[vaultAddress]/components/settings/GeneralTab.tsxsrc/components/SupplyModalContent.tsx
📚 Learning: 2024-10-23T16:17:02.841Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 77
File: src/graphql/queries.ts:168-193
Timestamp: 2024-10-23T16:17:02.841Z
Learning: In `src/graphql/queries.ts`, handling only `MarketTransferTransactionData` is intentional at this time.
Applied to files:
app/positions/components/FromMarketsTable.tsx
🧬 Code graph analysis (14)
app/autovault/[chainId]/[vaultAddress]/components/DepositToVaultModal.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
app/tools/page.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
src/components/common/MarketSelectionModal.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
src/components/Borrow/AddCollateralAndBorrow.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
app/autovault/[chainId]/[vaultAddress]/components/settings/EditCaps.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
src/components/common/SuppliedAssetFilterCompactSwitch.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
app/positions/components/onboarding/SetupPositions.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
src/components/SupplyModalContent.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
app/positions/components/PositionsSummaryTable.tsx (2)
src/components/TooltipContent.tsx (1)
TooltipContent(16-71)src/components/ui/button.tsx (1)
Button(102-102)
app/markets/components/BlacklistConfirmationModal.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
src/components/ui/button.tsx (1)
src/lib/utils.ts (1)
cn(4-6)
app/admin/stats/page.tsx (2)
src/components/ui/button.tsx (1)
Button(102-102)src/utils/networks.ts (1)
getNetworkName(200-203)
app/positions/components/RebalanceModal.tsx (1)
src/components/ui/button.tsx (1)
Button(102-102)
app/positions/components/PositionsContent.tsx (2)
src/components/TooltipContent.tsx (1)
TooltipContent(16-71)src/components/ui/button.tsx (1)
Button(102-102)
🔇 Additional comments (55)
src/components/layout/header/AccountConnect.tsx (1)
4-4: Button refactor wiring looks correctNew Button import,
onClick={handleConnect}, andvariant="primary"all line up with the new UI Button API and the intended “Connect” CTA.useConnectionis already in place and consistent with the Wagmi v3 migration noted elsewhere. Based on learnings, ...Also applies to: 43-47
app/positions/components/SuppliedMarketsDetail.tsx (2)
2-2: Import path updated correctly.The Button import now points to the new component location.
107-126: Button migration applied correctly.Both action buttons updated with the new API:
onClickreplacesonPress, andsurfacevariant is consistent with the migration pattern.app/autovault/[chainId]/[vaultAddress]/components/settings/AgentsTab.tsx (5)
4-4: Button import update looks fineImporting
Buttonfrom@/components/ui/buttonmatches the new shared Button location and keeps the named import form.
101-107: Allocator edit toggle Button wiring is correct
onClicknow togglesisEditingAllocatorsanddisabled={!isOwner}keeps the owner-only guard;variant="surface"andsize="sm"are just styling.
125-130: Remove allocator Button props match previous behaviorSwitch to
variant="default",onClick={() => void handleRemoveAllocator(...)}anddisabled={isUpdatingAllocator && allocatorToRemove === ...}preserves the old logic while aligning with the new Button API.
158-163: Add allocator Button correctly uses new API
variant="surface", the asynconClick={() => void handleAddAllocator(...)}, and thedisabledcondition tied toisUpdatingAllocator+ address maintain the intended UX.
179-184: Done Button handler swap is consistentChanging to
onClick={() => setIsEditingAllocators(false)}cleanly closes edit mode with no behavior change.app/markets/components/MarketRowDetail.tsx (1)
49-49: Good spacing improvement.Using
flex flex-col gap-2ensures consistent vertical spacing between warnings.app/market/[chainId]/[marketid]/components/CampaignModal.tsx (1)
6-7: Campaign CTA migration to new Button API looks goodImporting from
@/components/ui/buttonand usingvariant="ghost"for the Merkl link keeps behavior intact and matches the new Button API.Also applies to: 62-69
src/components/BorrowModal.tsx (1)
5-6: Header toggle button migration is correctSwitching to
@/components/ui/buttonwithvariant="ghost"and usingonClickto flip between borrow/repay preserves the existing behavior.Also applies to: 93-102
app/positions/components/onboarding/SetupPositions.tsx (1)
6-7: Onboarding navigation buttons correctly migratedBack/Execute buttons now use the new Button component, with sensible
ghost/primaryvariants and a cleardisabledcondition tied toerror,totalAmountBigInt, andsupplies.length; the asynchandleSupplycall is wired correctly.Also applies to: 373-390
app/rewards/components/RewardContent.tsx (1)
135-135: ExplicitshowLegacyboolean is cleanerUsing
morphoBalanceLegacy !== undefined && morphoBalanceLegacy !== 0nmakesshowLegacyexplicitly boolean while keeping the same display conditions for the Legacy MORPHO card.app/markets/components/MarketSettingsModal.tsx (1)
4-4: LGTM on the Button migration.Import path and prop updates are consistent with the new Button API. Variant mappings (
flat→ghost,light→ghost) are correct.Also applies to: 218-223, 252-257, 263-268
app/positions/components/FromMarketsTable.tsx (1)
147-161: LGTM on the Max button refactor.The consolidated
onClickhandler withstopPropagationis cleaner than a separate no-op. Variant and prop updates align with the new API.app/positions/components/PositionsSummaryTable.tsx (2)
207-230: Nice addition of tooltip on refresh.The
<span>wrapper is necessary for tooltips on disabled buttons. Implementation is correct.
186-205: Dropdown trigger buttons look good.Variant and event handler updates are consistent with the new API.
Also applies to: 231-239
src/components/Info/info.tsx (1)
63-73: Layout improvements are solid.The
min-w-0 flex-1pattern fixes common flex overflow issues. The conditional title render is a nice touch.Minor: Tailwind has
break-wordsclass, but inline styles work fine too.src/components/SupplyModalContent.tsx (1)
148-174: Button migrations are correct.Variant mappings (
secondary→default,cta→primary) andonPress→onClickchanges are properly applied.src/components/ui/button.tsx (1)
7-23: Overall structure is clean.Good use of cva for variant composition. The
asChildpattern with Radix Slot is correctly implemented.Also applies to: 87-99
app/global-error.tsx (1)
3-18: GlobalError Button wiring matches new APIImport path and
onClick={reset}look consistent with the new Button component; behavior should be unchanged from the oldonPressversion.app/positions/components/onboarding/SuccessPage.tsx (1)
2-28: SuccessPage Button refactor looks consistentNew import,
variant="primary", andonClick={handleFinished}align with the updated Button API; flow (close then reset) is preserved.app/market/[chainId]/[marketid]/components/TransactionFiltersModal.tsx (1)
4-115: TransactionFiltersModal close Button migrated correctlyUsing the new Button import with
variant="ghost"andonClick={onClose}keeps the modal footer behavior intact.src/components/RiskNotificationModal.tsx (1)
4-78: RiskNotificationModal Button/Checkbox wiring is coherentLocal Button import,
onClick={handleConfirm}, anddisabled={!isChecked}line up with the modal logic and existingisCheckedguard inhandleConfirm.app/error.tsx (1)
4-16: AppError retry Button updated cleanlyButton now comes from the new module and uses
onClick={reset}; error boundary behavior should be unchanged.src/components/WithdrawModalContent.tsx (1)
15-162: Withdraw buttons respect new API and state guardsBoth Buttons use the new import, appropriate
variants, anddisabledlogic (!isConnected || isConfirming || !withdrawAmount) mirrors the prior behavior;onClick={() => void withdraw()}is a safe async pattern.src/components/common/SuppliedAssetFilterCompactSwitch.tsx (1)
6-225: Filter compact switch Buttons aligned with new Button componentAll three Buttons now use the shared Button component; trigger and “Customize Filters” use
variant="ghost"while “Done” keepscolor="primary"withonClick={close}, preserving existing UX.app/autovault/[chainId]/[vaultAddress]/components/DepositToVaultModal.tsx (1)
5-127: Deposit buttons correctly migrated and guardedNew Button import,
variant="primary", and thedisabledpredicates around connection, pending state, input error, and amount all look consistent with the original intent.src/components/Borrow/WithdrawCollateralAndRepay.tsx (1)
304-342: Button migration here looks goodNew
Buttonusage (onClick,disabled,variant="surface"/"primary") preserves the previous conditions and async flows; nothing concerning from the refactor itself.app/autovault/[chainId]/[vaultAddress]/components/settings/CurrentCaps.tsx (1)
4-146: Edit caps button refactor looks correctImport path,
variant="default", andonClick={onStartEdit}all align with the new Button API; existing owner gating remains intact.src/components/Input/Input.tsx (1)
5-119: Ignore button migration is fineUsing the new
Buttonimport withvariant="default"and the existinghandleDismissErrorclick handler preserves prior behavior.app/autovault/[chainId]/[vaultAddress]/components/settings/EditCaps.tsx (1)
5-565: Edit caps buttons refactored cleanlyNew Button import plus
onClick/disabled/variant updates for “Add Market Cap”, “Cancel”, and “Save Changes” all keep the existing behavior and gating logic.app/positions/components/RebalanceActionRow.tsx (1)
4-236: Rebalance “Add” button migration looks goodSwapping to the new Button import with
onClick={onAddAction},variant="primary", anddisabled={isAddDisabled}matches the previous intent; nothing else to tweak here.package.json (1)
39-57: Dependency tweaks look reasonable; just re-run checksThe added
@reown/appkit*entries and thepino-prettybump are syntactically fine and align with the rest of the stack. Make sure your usual test/build pipeline passes after these version changes.src/components/Borrow/AddCollateralAndBorrow.tsx (1)
5-5: LGTM - Button API migration consistent.Import path, event handlers (
onClick), disabled prop, and variant mappings all correct.Also applies to: 318-357
src/components/common/MarketsTableWithSameLoanAsset.tsx (1)
9-9: LGTM - Button and Checkbox API updates consistent.Import, event handlers, and variant mapping all updated correctly.
Also applies to: 494-494, 1007-1014
src/components/common/MarketSelectionModal.tsx (1)
4-4: LGTM - Button API migration complete.Import, event handlers, disabled prop, and variant mappings all correct for both multi-select and single-select modes.
Also applies to: 143-168
app/positions/components/RebalanceModal.tsx (1)
4-4: LGTM - Button API migration correct.Import, event handlers, disabled prop, and variant mappings all updated. The
isLoadingprop on line 326 is supported by the new Button API.Also applies to: 315-330
src/components/settings/CustomRpcSettings.tsx (1)
5-5: LGTM - All Button instances migrated correctly.Import, event handlers, disabled props, and variant mappings consistent across Reset All, Save, Reset to Default, and Edit buttons.
Also applies to: 185-192, 263-292, 331-337
app/positions/report/components/ReportContent.tsx (1)
8-8: LGTM - Button API migration complete.Import, disabled prop, and variant mapping all correct.
Also applies to: 212-228
src/components/settings/BlacklistedMarketsModal.tsx (1)
7-7: LGTM - All Button instances updated correctly.Import, event handlers, disabled props, and variant mappings consistent across Remove, Add, pagination, and Close buttons.
Also applies to: 125-133, 193-200, 209-241
src/components/settings/TrustedVaultsModal.tsx (1)
8-8: LGTM - Button API migration complete.Import, event handlers, and variant mappings all correct for Select All, Deselect All, and Close buttons.
Also applies to: 164-177, 288-294
app/positions/components/PositionsContent.tsx (1)
114-127: Owner “New Position” button migration looks correctSwapping to
variant="primary"andonClick={() => setShowOnboardingModal(true)}matches the new Button API and keeps behavior.app/market/[chainId]/[marketid]/components/BorrowsTable.tsx (1)
7-7: Filter button migration is consistent and safeUsing the new ui
Buttonwithvariant="ghost",size="sm", andonClick={onOpenFiltersModal}keeps behavior and accessibility (aria-labelstill present).Also applies to: 71-77
app/history/components/HistoryTable.tsx (1)
349-356: Chip variant change is a harmless visual tweakSwitching the LLTV Chip to
variant="ghost"with the same classes only affects styling; data and behavior are unchanged.app/markets/components/MarketActionsDropdown.tsx (1)
10-10: Dropdown trigger Button migration looks fineUsing the new ui
Buttonwithsize="xs"andvariant="surface"for the ellipsis trigger keeps the interaction the same and matches the new design tokens.Also applies to: 69-75
app/markets/components/BlacklistConfirmationModal.tsx (1)
4-4: Modal action buttons correctly migrated to new Button API
CancelandBlacklist Marketnow usevariant="default"andvariant="primary"withonClickhandlers; this keeps the flow and clarifies primary vs secondary action.Also applies to: 62-75
app/market/[chainId]/[marketid]/content.tsx (1)
14-14: Market header buttons correctly switched to onClickAll header actions (
handleBackToMarkets, supply/borrow modal toggles, external Morpho link) now useonClickwith the new uiButton, preserving behavior under the updated API.Also applies to: 219-259
app/positions/components/onboarding/MarketSelectionOnboarding.tsx (1)
2-2: Onboarding navigation Buttons are correctly updatedBack/Continue now use the new Button with
variant="ghost"/variant="primary",onClickhandlers, anddisabled={!canGoNext}for gating. Flow and intent are preserved.Also applies to: 41-47, 87-101
app/settings/page.tsx (1)
5-5: Settings “Edit” Buttons migration looks goodNew
Buttonimport,variant="default", andonClickhandlers for both “Edit” Buttons are consistent with the updated Button API; behavior is preserved.Also applies to: 186-193, 244-250
app/tools/page.tsx (1)
6-6: Authorization Buttons correctly migrated to new Button API
Buttonimport,variant="default"/"primary",onClick, anddisabledlogic are all wired as before; the refactor doesn’t change behavior.Also applies to: 153-172
app/HomePage.tsx (1)
10-10: HomePage CTA Buttons are consistently updatedAll HomePage Buttons now use the new
Buttoncomponent withvariant="default"/"primary",onClickhandlers for scrolling, anddisabledwhere appropriate; behavior and layout are preserved.Also applies to: 226-235, 239-246, 295-303, 304-312, 358-366, 367-375, 442-449, 454-460, 523-525
app/admin/stats/page.tsx (1)
4-4: Dropdown trigger Buttons refactor looks correctUsing the shared
ButtonasDropdownTriggercontent (with custom classes and no explicit variant) keeps the existing behavior while aligning with the new Button implementation.Also applies to: 183-199, 269-279, 318-325
app/autovault/[chainId]/[vaultAddress]/content.tsx (1)
11-11: Vault page Buttons are properly migratedAll Buttons now come from
@/components/ui/buttonwith appropriatevariant,onClick, anddisabledprops; the flows for refresh, settings, and setup banners are preserved.Also applies to: 128-129, 153-162, 164-176, 189-197, 207-217, 229-239
app/market/[chainId]/[marketid]/components/SuppliesTable.tsx (1)
7-7: Supplies filter Button migration is consistentThe filter Button now uses the shared
Buttonwithvariant="ghost",size="sm",onClick, and anaria-label; behavior and styling stay intact.Also applies to: 66-77
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (4)
docs/Styling.md (4)
82-83: Update example variant names to match new Button API.These examples still use outdated variant names. Should be
'default'and'primary'.<ModalFooter> - <Button variant="secondary" onClick={onClose}>Cancel</Button> - <Button variant="cta" onClick={handleConfirm}>Confirm</Button> + <Button variant="default" onClick={onClose}>Cancel</Button> + <Button variant="primary" onClick={handleConfirm}>Confirm</Button> </ModalFooter>
118-119: Update example variant name from'light'to'ghost'.The
'light'variant no longer exists. Use'ghost'for icon buttons.actions={ - <Button variant="light" size="sm" onClick={handleRefresh}> + <Button variant="ghost" size="sm" onClick={handleRefresh}> <RefreshIcon /> Refresh </Button> }
156-157: Update compact modal example variant names.Same issue—should be
'default'and'primary'.<ModalFooter> - <Button variant="secondary" size="sm" onClick={onClose}>Cancel</Button> - <Button variant="cta" size="sm" onClick={handleApply}>Apply</Button> + <Button variant="default" size="sm" onClick={onClose}>Cancel</Button> + <Button variant="primary" size="sm" onClick={handleApply}>Apply</Button> </ModalFooter>
848-850: Update input example button variant.Should be
'primary'instead of'cta'.<Button - variant="cta" + variant="primary" size="sm" onClick={handleAction}
🧹 Nitpick comments (1)
app/autovault/components/AutovaultContent.tsx (1)
63-63: Consider using'default'variant instead of'surface'.Based on the documented variant guidelines (lines 295-296, 308 in Styling.md),
'surface'is for "Actions in cards, modals, table rows", while'default'is for "Navigation buttons, actions on main background". This button is on the main background, not in a card or modal.- variant={hasExistingVaults ? 'surface' : 'primary'} + variant={hasExistingVaults ? 'default' : 'primary'}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
app/autovault/[chainId]/[vaultAddress]/components/settings/GeneralTab.tsx(4 hunks)app/autovault/components/AutovaultContent.tsx(2 hunks)app/history/components/HistoryTable.tsx(1 hunks)docs/Styling.md(7 hunks)src/components/ui/pagination.tsx(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- app/autovault/[chainId]/[vaultAddress]/components/settings/GeneralTab.tsx
- app/history/components/HistoryTable.tsx
🧰 Additional context used
🧠 Learnings (4)
📓 Common learnings
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 94
File: src/components/supplyModal.tsx:449-452
Timestamp: 2024-12-08T12:10:17.127Z
Learning: The 'solid' variant is defined in the new `Button` component and is a valid variant.
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 97
File: app/positions/components/onboarding/OnboardingContext.tsx:36-43
Timestamp: 2024-12-16T02:01:51.219Z
Learning: In `app/positions/components/onboarding/OnboardingContext.tsx`, the `defaultStep` variable is no longer needed and can be removed.
📚 Learning: 2024-12-08T12:10:17.127Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 94
File: src/components/supplyModal.tsx:449-452
Timestamp: 2024-12-08T12:10:17.127Z
Learning: The 'solid' variant is defined in the new `Button` component and is a valid variant.
Applied to files:
app/autovault/components/AutovaultContent.tsxdocs/Styling.mdsrc/components/ui/pagination.tsx
📚 Learning: 2025-12-09T10:06:39.848Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 231
File: src/hooks/useDeployMorphoMarketV1Adapter.ts:3-3
Timestamp: 2025-12-09T10:06:39.848Z
Learning: In Wagmi v3, useConnection is the correct hook to obtain the connected wallet address, chainId, and connection status (isConnected). This replaces the useAccount hook from Wagmi v2. Usage: const { address, chainId, isConnected } = useConnection() from 'wagmi'.
Applied to files:
app/autovault/components/AutovaultContent.tsx
📚 Learning: 2024-12-17T10:51:07.277Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 99
File: src/components/AgentSetupProcessModal.tsx:38-51
Timestamp: 2024-12-17T10:51:07.277Z
Learning: In `src/components/AgentSetupProcessModal.tsx`, the modal is intentionally designed without a close button.
Applied to files:
docs/Styling.md
🪛 LanguageTool
docs/Styling.md
[style] ~354-~354: Consider using an extreme adjective for ‘small’.
Context: ...ooltip> ``` #### Button Sizes - xs: Extra small (h-6, 40px min-width) - Rare use - `sm`...
(EXTREME_ADJECTIVES)
🔇 Additional comments (7)
src/components/ui/pagination.tsx (1)
41-55: Active pagination variant change looks goodSwitching the active state to use
variant: isActive ? 'surface' : 'ghost'keeps behavior and a11y the same and just refines styling; no issues from this change.app/autovault/components/AutovaultContent.tsx (2)
6-6: LGTM!Import path correctly updated to the new Button component.
66-66: LGTM!Event handler correctly updated from
onPresstoonClick.docs/Styling.md (4)
7-7: LGTM!Import path correctly documented for the new Button component.
34-34: LGTM!Import path correctly documented in example.
290-315: LGTM!Variant documentation is clear and well-structured.
320-349: LGTM!Updated examples correctly demonstrate the new Button API.
1 participant
Summary by CodeRabbit
UI/UX Improvements
Chores
✏️ Tip: You can customize this high-level summary in your review settings.