Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughReplaces prior home/info pages with a new client-side HomePage and typing animation, adds a RebalanceAnimation, removes several info modules, centralizes USD threshold parsing and market filters, updates routing/risk links, adds animation deps, and aligns loading flags across multiple data-fetching hooks. (50 words) Changes
Sequence Diagram(s)sequenceDiagram
participant Browser
participant HomePage
participant TypingAnim as CustomTypingAnimation
participant Rebalance as RebalanceAnimation
participant Theme
Browser->>HomePage: mount
HomePage->>Theme: resolve theme & assets
HomePage->>TypingAnim: mount (phrases)
Note over TypingAnim: interval-driven typing/rewriting\n(per-phrase timers, caret)
TypingAnim-->>HomePage: render updates
HomePage->>Rebalance: mount
Note over Rebalance: 3s interval randomly selects\n1–3 slots to spin, animate nextIndex, then commit
Rebalance-->>HomePage: animated slots render
Browser->>HomePage: user scroll / CTA click
HomePage->>Browser: scroll-to-section / navigation
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~35 minutes
Possibly related PRs
Poem
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: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
app/autovault/[chainId]/[vaultAddress]/content.tsx (1)
191-191: Change line 191 to usevault.vaultDataLoadingfor consistency.The "Start setup" button uses
vault.isLoadingwhile the Refresh button (line 154), the banner conditions (lines 178, 198, 218), and all other components (lines 273, 284, 296, 324) usevault.vaultDataLoading. Since the button only opens a modal and the banner is already gated by vault data loading state, it should align with the rest of the component:isDisabled={vault.vaultDataLoading}
🧹 Nitpick comments (1)
src/components/common/MarketsTableWithSameLoanAsset.tsx (1)
498-498: Memoize effectiveMinSupply.Since
effectiveMinSupplyis used in theprocessedMarketsdependency array (line 665), wrap it inuseMemoto prevent unnecessary recomputation ofprocessedMarketswhen unrelated state changes.Based on coding guidelines.
- const effectiveMinSupply = parseNumericThreshold(usdFilters.minSupply); + const effectiveMinSupply = useMemo( + () => parseNumericThreshold(usdFilters.minSupply), + [usdFilters.minSupply] + );
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (4)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yamlsrc/imgs/intro/morpho-logo-darkmode.svgis excluded by!**/*.svgsrc/imgs/intro/morpho-logo-lightmode.svgis excluded by!**/*.svgsrc/imgs/intro/vaults.pngis excluded by!**/*.png
📒 Files selected for processing (18)
app/HomePage.tsx(1 hunks)app/autovault/[chainId]/[vaultAddress]/content.tsx(3 hunks)app/home/HomePage.tsx(0 hunks)app/info/components/info.tsx(0 hunks)app/info/components/sectionData.tsx(0 hunks)app/info/page.tsx(0 hunks)app/markets/components/markets.tsx(2 hunks)app/page.tsx(1 hunks)app/risks/RiskContent.tsx(3 hunks)app/risks/page.tsx(1 hunks)package.json(2 hunks)src/components/RiskNotificationModal.tsx(4 hunks)src/components/animations/RebalanceAnimation.tsx(1 hunks)src/components/common/MarketsTableWithSameLoanAsset.tsx(3 hunks)src/hooks/useAllocations.ts(2 hunks)src/hooks/useMorphoMarketV1Adapters.ts(2 hunks)src/hooks/useVaultV2Data.ts(1 hunks)src/utils/markets.ts(1 hunks)
💤 Files with no reviewable changes (4)
- app/info/page.tsx
- app/info/components/sectionData.tsx
- app/info/components/info.tsx
- app/home/HomePage.tsx
🧰 Additional context used
📓 Path-based instructions (14)
src/components/**
📄 CodeRabbit inference engine (AGENTS.md)
Place UI components under
src/components/
Files:
src/components/RiskNotificationModal.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxsrc/components/animations/RebalanceAnimation.tsx
**/*.{ts,tsx,js,jsx,css,md,json,yml,yaml}
📄 CodeRabbit inference engine (AGENTS.md)
Run Prettier via
pnpm formatwith the repository profile (100-char width, 2-space indent, single quotes, trailing commas, Tailwind-aware ordering)
Files:
src/components/RiskNotificationModal.tsxsrc/hooks/useVaultV2Data.tsapp/HomePage.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxapp/risks/page.tsxpackage.jsonsrc/utils/markets.tssrc/hooks/useAllocations.tsapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsxsrc/components/animations/RebalanceAnimation.tsxsrc/hooks/useMorphoMarketV1Adapters.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Adhere to ESLint (Airbnb + Next.js) rules for hook safety and import hygiene
Files:
src/components/RiskNotificationModal.tsxsrc/hooks/useVaultV2Data.tsapp/HomePage.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxapp/risks/page.tsxsrc/utils/markets.tssrc/hooks/useAllocations.tsapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsxsrc/components/animations/RebalanceAnimation.tsxsrc/hooks/useMorphoMarketV1Adapters.ts
src/components/**/[A-Z][A-Za-z0-9]*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Use PascalCase filenames for React components (e.g.,
VaultBanner.tsx)
Files:
src/components/RiskNotificationModal.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxsrc/components/animations/RebalanceAnimation.tsx
{app,src/components}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Keep Tailwind class lists purposeful and lean; consolidate repeating patterns with
tailwind-merge
Files:
src/components/RiskNotificationModal.tsxapp/HomePage.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxapp/risks/page.tsxapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsxsrc/components/animations/RebalanceAnimation.tsx
{app,src}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
When using the shared
Spinnercomponent, pass numeric pixel values tosize(e.g.,size={12}), not semantic strings
Files:
src/components/RiskNotificationModal.tsxapp/HomePage.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxapp/risks/page.tsxapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsxsrc/components/animations/RebalanceAnimation.tsx
src/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Do not define utility/business logic inside components; extract to
src/utils/
Files:
src/components/RiskNotificationModal.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxsrc/components/animations/RebalanceAnimation.tsx
{src/hooks/**/*.ts,src/hooks/**/*.tsx,src/components/**/*.tsx,app/**/*.tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Memoize arrays/objects passed to hooks that trigger network requests (or pass a stable key) to avoid unnecessary re-fetches and effect retriggers
Files:
src/components/RiskNotificationModal.tsxsrc/hooks/useVaultV2Data.tsapp/HomePage.tsxsrc/components/common/MarketsTableWithSameLoanAsset.tsxapp/risks/page.tsxsrc/hooks/useAllocations.tsapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsxsrc/components/animations/RebalanceAnimation.tsxsrc/hooks/useMorphoMarketV1Adapters.ts
src/hooks/**
📄 CodeRabbit inference engine (AGENTS.md)
Place React hooks under
src/hooks/
Files:
src/hooks/useVaultV2Data.tssrc/hooks/useAllocations.tssrc/hooks/useMorphoMarketV1Adapters.ts
src/hooks/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Do not define utility/business logic inside hooks; extract to
src/utils/
Files:
src/hooks/useVaultV2Data.tssrc/hooks/useAllocations.tssrc/hooks/useMorphoMarketV1Adapters.ts
src/hooks/use*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
For new on-chain hooks, mirror
useERC20Approval/useTransactionWithToastpatterns: compute context early, reuseuseTransactionWithToast, and expose a minimal surface ({ action, isLoading }) with refetch callbacks
Files:
src/hooks/useVaultV2Data.tssrc/hooks/useAllocations.tssrc/hooks/useMorphoMarketV1Adapters.ts
app/**
📄 CodeRabbit inference engine (AGENTS.md)
Place Next.js route files under
app/
Files:
app/HomePage.tsxapp/risks/page.tsxapp/autovault/[chainId]/[vaultAddress]/content.tsxapp/markets/components/markets.tsxapp/page.tsxapp/risks/RiskContent.tsx
src/utils/**
📄 CodeRabbit inference engine (AGENTS.md)
Place reusable utility functions under
src/utils/
Files:
src/utils/markets.ts
src/utils/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
src/utils/**/*.{ts,tsx}: Use camelCase for helper function names (e.g.,formatApr)
Keep utilities pure and reusable; host business/utility logic insrc/utils/
Files:
src/utils/markets.ts
🧠 Learnings (6)
📚 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:
src/components/RiskNotificationModal.tsxapp/HomePage.tsxapp/risks/page.tsxapp/page.tsxapp/risks/RiskContent.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:
src/components/common/MarketsTableWithSameLoanAsset.tsx
📚 Learning: 2025-10-24T16:25:14.182Z
Learnt from: CR
Repo: antoncoding/monarch PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-10-24T16:25:14.182Z
Learning: Applies to {src/hooks/**/*.ts,src/hooks/**/*.tsx,src/components/**/*.tsx,app/**/*.tsx} : Memoize arrays/objects passed to hooks that trigger network requests (or pass a stable key) to avoid unnecessary re-fetches and effect retriggers
Applied to files:
src/components/common/MarketsTableWithSameLoanAsset.tsxapp/markets/components/markets.tsx
📚 Learning: 2025-10-24T16:25:14.182Z
Learnt from: CR
Repo: antoncoding/monarch PR: 0
File: AGENTS.md:0-0
Timestamp: 2025-10-24T16:25:14.182Z
Learning: Applies to src/hooks/use*.{ts,tsx} : For new on-chain hooks, mirror `useERC20Approval`/`useTransactionWithToast` patterns: compute context early, reuse `useTransactionWithToast`, and expose a minimal surface (`{ action, isLoading }`) with refetch callbacks
Applied to files:
app/markets/components/markets.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:
app/risks/RiskContent.tsx
📚 Learning: 2024-10-07T14:38:04.384Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 57
File: src/hooks/useRebalance.ts:112-114
Timestamp: 2024-10-07T14:38:04.384Z
Learning: In `src/hooks/useRebalance.ts`, adding a delay is necessary because Rabby wallet cannot handle sequential requests.
Applied to files:
src/components/animations/RebalanceAnimation.tsx
🧬 Code graph analysis (4)
app/HomePage.tsx (3)
src/components/common/Button.tsx (1)
Button(4-54)src/components/common/Badge.tsx (1)
Badge(31-33)src/utils/external.ts (1)
EXTERNAL_LINKS(45-49)
src/components/common/MarketsTableWithSameLoanAsset.tsx (2)
src/utils/markets.ts (1)
parseNumericThreshold(7-18)src/utils/balance.ts (1)
formatReadable(25-46)
app/markets/components/markets.tsx (1)
src/utils/markets.ts (1)
parseNumericThreshold(7-18)
app/page.tsx (2)
app/risks/page.tsx (1)
metadata(4-9)app/autovault/[chainId]/[vaultAddress]/page.tsx (1)
generateMetadata(5-18)
🔇 Additional comments (10)
app/autovault/[chainId]/[vaultAddress]/content.tsx (1)
177-238: Loading guards correctly prevent premature banner display.The
!vault.vaultDataLoadingconditions ensure the setup banners only appear after vault data is fetched, avoiding false positives during initial load.package.json (1)
45-45: LGTM!Animation dependencies added to support the new landing page features.
Also applies to: 66-66
src/hooks/useVaultV2Data.ts (1)
55-55: LGTM!Loading state lifecycle improved: initializes to
true, resets tofalseon early exit, and properly manages loading during fetch operations. Consistent with the pattern applied across other hooks in this PR.Also applies to: 61-61, 65-66
src/utils/markets.ts (1)
1-18: LGTM!Clean utility function with clear documentation and defensive handling of edge cases. Centralizes threshold parsing logic that was previously duplicated.
src/components/common/MarketsTableWithSameLoanAsset.tsx (1)
15-15: LGTM!Successfully replaced local threshold parsing with the centralized
parseNumericThresholdutility. Display formatting withformatReadableis cleaner than the previoustoLocaleStringapproach.Also applies to: 498-498, 753-753
src/components/RiskNotificationModal.tsx (1)
23-23: LGTM!Route references consistently updated from
/info*paths to root (/) and/risks. Modal logic correctly prevents display on the landing page and risk assessment page.Also applies to: 35-35, 50-51, 68-68
src/hooks/useMorphoMarketV1Adapters.ts (1)
15-15: LGTM!Loading state lifecycle improved with the same pattern applied across other hooks in this PR. Initializes to
true, resets on early exit, and properly manages state during fetch operations.Also applies to: 33-33, 37-38
src/hooks/useAllocations.ts (2)
34-34: LGTM!Loading state lifecycle improved consistently with other hooks in this PR.
Also applies to: 45-45, 49-50
38-40: Good optimization with capsKey.Using a stable
capsKeyderived from cap IDs prevents unnecessary refetches when thecapsarray reference changes but content remains the same. Aligns with the coding guideline to avoid effect retriggers from unstable dependencies.Based on learnings.
Also applies to: 77-77
app/risks/RiskContent.tsx (1)
53-53: LGTM!Component renamed to
RiskContentand navigation updated to point to the root home page. Consistent with the broader routing changes in this PR.Also applies to: 94-94, 63-64
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (3)
src/components/animations/RebalanceAnimation.tsx (3)
14-17: ReplaceanywithStaticImageData.Import and use
StaticImageDatafromnext/imagefor proper type safety with imported images.import { useState, useEffect } from 'react'; -import Image from 'next/image'; +import Image, { type StaticImageData } from 'next/image'; // Import token images ... type Token = { name: string; - image: any; + image: StaticImageData; };
43-43: MoveSLOT_COUNToutside the interval callback.Defining
SLOT_COUNTinside the interval callback recreates it every 3 seconds. Extract it as a top-level constant for efficiency.+const SLOT_COUNT = 4; + function RebalanceAnimation() { const [slots, setSlots] = useState<SlotState[]>([ ... useEffect(() => { const interval = setInterval(() => { - const SLOT_COUNT = 4 - // Randomly decide how many slots to change (1-3)
102-108: Remove unnecessary type casting.Next.js
ImageacceptsStaticImageDatadirectly. Theas stringcasts are unnecessary and can hide type errors.<Image - src={tokens[slot.currentIndex].image as string} + src={tokens[slot.currentIndex].image} alt={tokens[slot.currentIndex].name} width={40} height={40} className="h-8 w-8 object-contain sm:h-9 sm:w-9" /> </div> {/* Next token - slides up from bottom when spinning */} <div className={`absolute inset-0 flex items-center justify-center ${ slot.isSpinning ? 'transition-transform duration-500 ease-in-out translate-y-0' : 'translate-y-full' }`} > <Image - src={tokens[slot.nextIndex].image as string} + src={tokens[slot.nextIndex].image} alt={tokens[slot.nextIndex].name}Also applies to: 116-122
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/components/animations/RebalanceAnimation.tsx(1 hunks)
🧰 Additional context used
📓 Path-based instructions (8)
src/components/**
📄 CodeRabbit inference engine (AGENTS.md)
Place UI components under
src/components/
Files:
src/components/animations/RebalanceAnimation.tsx
**/*.{ts,tsx,js,jsx,css,md,json,yml,yaml}
📄 CodeRabbit inference engine (AGENTS.md)
Run Prettier via
pnpm formatwith the repository profile (100-char width, 2-space indent, single quotes, trailing commas, Tailwind-aware ordering)
Files:
src/components/animations/RebalanceAnimation.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Adhere to ESLint (Airbnb + Next.js) rules for hook safety and import hygiene
Files:
src/components/animations/RebalanceAnimation.tsx
src/components/**/[A-Z][A-Za-z0-9]*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Use PascalCase filenames for React components (e.g.,
VaultBanner.tsx)
Files:
src/components/animations/RebalanceAnimation.tsx
{app,src/components}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Keep Tailwind class lists purposeful and lean; consolidate repeating patterns with
tailwind-merge
Files:
src/components/animations/RebalanceAnimation.tsx
{app,src}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
When using the shared
Spinnercomponent, pass numeric pixel values tosize(e.g.,size={12}), not semantic strings
Files:
src/components/animations/RebalanceAnimation.tsx
src/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Do not define utility/business logic inside components; extract to
src/utils/
Files:
src/components/animations/RebalanceAnimation.tsx
{src/hooks/**/*.ts,src/hooks/**/*.tsx,src/components/**/*.tsx,app/**/*.tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Memoize arrays/objects passed to hooks that trigger network requests (or pass a stable key) to avoid unnecessary re-fetches and effect retriggers
Files:
src/components/animations/RebalanceAnimation.tsx
🧠 Learnings (1)
📚 Learning: 2024-10-07T14:38:04.384Z
Learnt from: antoncoding
Repo: antoncoding/monarch PR: 57
File: src/hooks/useRebalance.ts:112-114
Timestamp: 2024-10-07T14:38:04.384Z
Learning: In `src/hooks/useRebalance.ts`, adding a delay is necessary because Rabby wallet cannot handle sequential requests.
Applied to files:
src/components/animations/RebalanceAnimation.tsx
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
app/markets/components/MarketSettingsModal.tsx(3 hunks)app/markets/components/markets.tsx(7 hunks)src/components/animations/RebalanceAnimation.tsx(1 hunks)src/components/common/MarketsTableWithSameLoanAsset.tsx(6 hunks)src/constants/markets.ts(1 hunks)src/utils/marketFilters.ts(1 hunks)src/utils/storageKeys.ts(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- src/components/animations/RebalanceAnimation.tsx
🧰 Additional context used
📓 Path-based instructions (13)
src/constants/**
📄 CodeRabbit inference engine (AGENTS.md)
Place shared constants under
src/constants/
Files:
src/constants/markets.ts
**/*.{ts,tsx,js,jsx,css,md,json,yml,yaml}
📄 CodeRabbit inference engine (AGENTS.md)
Run Prettier via
pnpm formatwith the repository profile (100-char width, 2-space indent, single quotes, trailing commas, Tailwind-aware ordering)
Files:
src/constants/markets.tssrc/components/common/MarketsTableWithSameLoanAsset.tsxsrc/utils/storageKeys.tsapp/markets/components/MarketSettingsModal.tsxsrc/utils/marketFilters.tsapp/markets/components/markets.tsx
**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Adhere to ESLint (Airbnb + Next.js) rules for hook safety and import hygiene
Files:
src/constants/markets.tssrc/components/common/MarketsTableWithSameLoanAsset.tsxsrc/utils/storageKeys.tsapp/markets/components/MarketSettingsModal.tsxsrc/utils/marketFilters.tsapp/markets/components/markets.tsx
src/constants/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Use SCREAMING_SNAKE_CASE for shared constants
Files:
src/constants/markets.ts
src/components/**
📄 CodeRabbit inference engine (AGENTS.md)
Place UI components under
src/components/
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsx
src/components/**/[A-Z][A-Za-z0-9]*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Use PascalCase filenames for React components (e.g.,
VaultBanner.tsx)
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsx
{app,src/components}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Keep Tailwind class lists purposeful and lean; consolidate repeating patterns with
tailwind-merge
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsxapp/markets/components/MarketSettingsModal.tsxapp/markets/components/markets.tsx
{app,src}/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
When using the shared
Spinnercomponent, pass numeric pixel values tosize(e.g.,size={12}), not semantic strings
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsxapp/markets/components/MarketSettingsModal.tsxapp/markets/components/markets.tsx
src/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Do not define utility/business logic inside components; extract to
src/utils/
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsx
{src/hooks/**/*.ts,src/hooks/**/*.tsx,src/components/**/*.tsx,app/**/*.tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Memoize arrays/objects passed to hooks that trigger network requests (or pass a stable key) to avoid unnecessary re-fetches and effect retriggers
Files:
src/components/common/MarketsTableWithSameLoanAsset.tsxapp/markets/components/MarketSettingsModal.tsxapp/markets/components/markets.tsx
src/utils/**
📄 CodeRabbit inference engine (AGENTS.md)
Place reusable utility functions under
src/utils/
Files:
src/utils/storageKeys.tssrc/utils/marketFilters.ts
src/utils/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
src/utils/**/*.{ts,tsx}: Use camelCase for helper function names (e.g.,formatApr)
Keep utilities pure and reusable; host business/utility logic insrc/utils/
Files:
src/utils/storageKeys.tssrc/utils/marketFilters.ts
app/**
📄 CodeRabbit inference engine (AGENTS.md)
Place Next.js route files under
app/
Files:
app/markets/components/MarketSettingsModal.tsxapp/markets/components/markets.tsx
🧠 Learnings (2)
📚 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:
src/components/common/MarketsTableWithSameLoanAsset.tsxsrc/utils/storageKeys.tsapp/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:
src/components/common/MarketsTableWithSameLoanAsset.tsxapp/markets/components/markets.tsx
🧬 Code graph analysis (4)
src/components/common/MarketsTableWithSameLoanAsset.tsx (5)
src/hooks/useLocalStorage.ts (1)
useLocalStorage(4-78)src/constants/markets.ts (1)
DEFAULT_MIN_LIQUIDITY_USD(2-2)src/utils/markets.ts (1)
parseNumericThreshold(7-18)src/utils/marketFilters.ts (3)
filterMarkets(260-309)sortMarkets(322-328)createPropertySort(343-364)src/utils/balance.ts (1)
formatReadable(25-46)
app/markets/components/MarketSettingsModal.tsx (1)
src/components/Input/Input.tsx (1)
Input(17-97)
src/utils/marketFilters.ts (4)
src/utils/types.ts (1)
Market(268-315)src/utils/tokens.ts (2)
ERC20Token(19-32)findToken(714-714)src/utils/oracle.ts (2)
parsePriceFeedVendors(255-340)getOracleType(233-253)src/utils/markets.ts (1)
parseNumericThreshold(7-18)
app/markets/components/markets.tsx (5)
src/hooks/useLocalStorage.ts (1)
useLocalStorage(4-78)src/constants/markets.ts (2)
DEFAULT_MIN_SUPPLY_USD(1-1)DEFAULT_MIN_LIQUIDITY_USD(2-2)src/utils/markets.ts (1)
parseNumericThreshold(7-18)src/utils/marketFilters.ts (4)
filterMarkets(260-309)sortMarkets(322-328)createStarredSort(369-377)createPropertySort(343-364)src/utils/types.ts (1)
Market(268-315)
| const sortPropertyMap: Record<SortColumn, string> = { | ||
| [SortColumn.Starred]: 'uniqueKey', | ||
| [SortColumn.LoanAsset]: 'loanAsset.name', | ||
| [SortColumn.CollateralAsset]: 'collateralAsset.name', | ||
| [SortColumn.LLTV]: 'lltv', | ||
| [SortColumn.Supply]: 'state.supplyAssetsUsd', | ||
| [SortColumn.Borrow]: 'state.borrowAssetsUsd', | ||
| [SortColumn.SupplyAPY]: 'state.supplyApy', | ||
| }; | ||
| const propertyPath = sortPropertyMap[sortColumn]; | ||
| if (propertyPath) { | ||
| sorted = sortMarkets(filtered, createPropertySort(propertyPath), sortDirection as 1 | -1); |
There was a problem hiding this comment.
Fix Loan/Collateral sort keys
Sorting by the Loan Asset or Collateral columns never changes the order because both property paths resolve to undefined. Our token objects expose symbol (see how MarketsTableWithSameLoanAsset maps to collateralAsset.symbol), so the comparator always returns 0 and the sort column is broken. Point these entries at .symbol instead.
Apply this diff:
- [SortColumn.LoanAsset]: 'loanAsset.name',
- [SortColumn.CollateralAsset]: 'collateralAsset.name',
+ [SortColumn.LoanAsset]: 'loanAsset.symbol',
+ [SortColumn.CollateralAsset]: 'collateralAsset.symbol',📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const sortPropertyMap: Record<SortColumn, string> = { | |
| [SortColumn.Starred]: 'uniqueKey', | |
| [SortColumn.LoanAsset]: 'loanAsset.name', | |
| [SortColumn.CollateralAsset]: 'collateralAsset.name', | |
| [SortColumn.LLTV]: 'lltv', | |
| [SortColumn.Supply]: 'state.supplyAssetsUsd', | |
| [SortColumn.Borrow]: 'state.borrowAssetsUsd', | |
| [SortColumn.SupplyAPY]: 'state.supplyApy', | |
| }; | |
| const propertyPath = sortPropertyMap[sortColumn]; | |
| if (propertyPath) { | |
| sorted = sortMarkets(filtered, createPropertySort(propertyPath), sortDirection as 1 | -1); | |
| const sortPropertyMap: Record<SortColumn, string> = { | |
| [SortColumn.Starred]: 'uniqueKey', | |
| [SortColumn.LoanAsset]: 'loanAsset.symbol', | |
| [SortColumn.CollateralAsset]: 'collateralAsset.symbol', | |
| [SortColumn.LLTV]: 'lltv', | |
| [SortColumn.Supply]: 'state.supplyAssetsUsd', | |
| [SortColumn.Borrow]: 'state.borrowAssetsUsd', | |
| [SortColumn.SupplyAPY]: 'state.supplyApy', | |
| }; | |
| const propertyPath = sortPropertyMap[sortColumn]; | |
| if (propertyPath) { | |
| sorted = sortMarkets(filtered, createPropertySort(propertyPath), sortDirection as 1 | -1); |
🤖 Prompt for AI Agents
In app/markets/components/markets.tsx around lines 247 to 258 the
sortPropertyMap entries for SortColumn.LoanAsset and SortColumn.CollateralAsset
point to 'loanAsset.name' and 'collateralAsset.name' which resolve to undefined
on our token objects; update those two entries to use the token symbol paths
('loanAsset.symbol' and 'collateralAsset.symbol') so the comparator sees a valid
property and sorting works as expected.
1 participant
Summary by CodeRabbit
New Features
Bug Fixes
Refactor
Chores