Draft
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
Contributor
|
Important Review skippedDraft detected. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughAdds a per-address DAO list preference hook (localStorage + cross-tab sync), a draggable/editable ProfileDaoList UI with persistent hide/order, integrates preference-driven ordering/hidden toggles into ProfileMenu, Dashboard and profile page, and introduces an Changes
Sequence DiagramsequenceDiagram
participant User
participant UI as ProfileDaoList
participant Drag as Drag System
participant Pref as useDaoListPreferences
participant Storage as localStorage
User->>UI: Click "Edit"
UI->>UI: enable edit controls, show drag handles
User->>Drag: PointerDown on row
Drag->>UI: read row refs & metrics
Drag->>Drag: create overlay (portal), capture pointer
User->>Drag: Move pointer
Drag->>Drag: update overlay position, compute insert index
Drag->>UI: auto-scroll container if needed
User->>Drag: PointerUp (drop)
Drag->>UI: compute from/to indices → new order
UI->>Pref: persistOrderedDaos(newOrder)
Pref->>Storage: write ordered keys to localStorage
Pref->>Pref: dispatch custom preference event
Storage-->>Pref: storage persisted
Pref-->>UI: hook state updates
UI->>User: render list in new order
Estimated code review effort🎯 4 (Complex) | ⏱️ ~75 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
📝 Coding Plan
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 Tip You can disable sequence diagrams in the walkthrough.Disable the |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (2)
apps/web/src/components/ProfileDaoList.tsx (1)
68-178: Consider adding a display name for debugging.The memoized
ProfileDaoListRowcomponent doesn't have an explicit display name, which can make debugging in React DevTools harder.Add displayName for better debugging
const ProfileDaoListRow = React.memo( ({ chainIcon, ... }: ProfileDaoListRowProps) => { ... } ) + +ProfileDaoListRow.displayName = 'ProfileDaoListRow'🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/web/src/components/ProfileDaoList.tsx` around lines 68 - 178, The memoized component ProfileDaoListRow lacks an explicit displayName which hurts React DevTools debugging; after the React.memo(...) declaration, set ProfileDaoListRow.displayName = 'ProfileDaoListRow' so the component shows a readable name in DevTools (target the ProfileDaoListRow symbol that wraps the arrow function passed to React.memo).apps/web/src/styles/profile.css.ts (1)
106-117: Consider using design tokens for color consistency.The
daoEditorDoneButtonstyle uses hardcoded hex colors (#2563eb,#1d4ed8) which may not adapt to theme changes. If the design system supports it, consider using color tokens from@buildeross/zordfor consistency.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/web/src/styles/profile.css.ts` around lines 106 - 117, The daoEditorDoneButton style is using hardcoded hex colors; update the style to use color tokens from `@buildeross/zord` instead: import the design tokens (e.g., color or palette exports) and replace the hardcoded values in daoEditorDoneButton (including the '&:hover' nested selector) with the appropriate token names so theme changes propagate consistently.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@apps/web/src/components/ProfileDaoList.tsx`:
- Around line 68-178: The memoized component ProfileDaoListRow lacks an explicit
displayName which hurts React DevTools debugging; after the React.memo(...)
declaration, set ProfileDaoListRow.displayName = 'ProfileDaoListRow' so the
component shows a readable name in DevTools (target the ProfileDaoListRow symbol
that wraps the arrow function passed to React.memo).
In `@apps/web/src/styles/profile.css.ts`:
- Around line 106-117: The daoEditorDoneButton style is using hardcoded hex
colors; update the style to use color tokens from `@buildeross/zord` instead:
import the design tokens (e.g., color or palette exports) and replace the
hardcoded values in daoEditorDoneButton (including the '&:hover' nested
selector) with the appropriate token names so theme changes propagate
consistently.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: bf2e4140-5f94-4cd3-a03c-0355c286d713
📒 Files selected for processing (8)
apps/web/src/components/ProfileDaoList.tsxapps/web/src/layouts/DefaultLayout/NavMenu/ProfileMenu.tsxapps/web/src/modules/dashboard/AuctionPaused.tsxapps/web/src/modules/dashboard/DaoAuctionCard.tsxapps/web/src/modules/dashboard/Dashboard.tsxapps/web/src/pages/profile/[user].tsxapps/web/src/styles/profile.css.tsapps/web/src/utils/useDaoListPreferences.ts
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/web/package.json`:
- Line 95: The "dev" npm script currently runs "pnpm clean && node
--max-old-space-size=4096 ./node_modules/next/dist/bin/next dev", which deletes
.next on every start and uses a brittle internal Next path; remove the "pnpm
clean &&" prefix so the "dev" script only starts Next (use a stable invocation
like "pnpm exec next dev" or just "next dev" so incremental builds are
preserved), and keep "clean" as a separate script that developers can run
manually when needed; also replace the internal path
"./node_modules/next/dist/bin/next" with the stable invocation via pnpm exec or
the local node_modules/.bin entry to avoid breaking on Next.js upgrades.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: e918c158-7a50-472d-bd01-b273ebb1c8ca
📒 Files selected for processing (2)
apps/web/package.jsonpackages/types/package.json
apps/web/package.json
Outdated
| "clean": "rm -rf .next .turbo", | ||
| "dev": "pnpm clean && NODE_OPTIONS='--max-old-space-size=4096' next dev", | ||
| "clean": "node -e \"require('fs').rmSync('.next', { recursive: true, force: true }); require('fs').rmSync('.turbo', { recursive: true, force: true });\"", | ||
| "dev": "pnpm clean && node --max-old-space-size=4096 ./node_modules/next/dist/bin/next dev", |
Contributor
There was a problem hiding this comment.
Running clean before every dev invocation degrades developer experience.
Prefixing the dev command with pnpm clean removes the .next directory on every startup, eliminating Next.js's incremental compilation cache. This forces a full rebuild each time, significantly slowing down development iteration.
Additionally, the internal path ./node_modules/next/dist/bin/next is brittle and may break on Next.js upgrades.
Proposed fix
- "dev": "pnpm clean && node --max-old-space-size=4096 ./node_modules/next/dist/bin/next dev",
+ "dev": "node --max-old-space-size=4096 ./node_modules/.bin/next dev",If a clean dev start is occasionally needed, developers can run pnpm clean && pnpm dev manually. Using ./node_modules/.bin/next is more stable than referencing internal dist/bin/next paths.
📝 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.
Suggested change
| "dev": "pnpm clean && node --max-old-space-size=4096 ./node_modules/next/dist/bin/next dev", | |
| "dev": "node --max-old-space-size=4096 ./node_modules/.bin/next dev", |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@apps/web/package.json` at line 95, The "dev" npm script currently runs "pnpm
clean && node --max-old-space-size=4096 ./node_modules/next/dist/bin/next dev",
which deletes .next on every start and uses a brittle internal Next path; remove
the "pnpm clean &&" prefix so the "dev" script only starts Next (use a stable
invocation like "pnpm exec next dev" or just "next dev" so incremental builds
are preserved), and keep "clean" as a separate script that developers can run
manually when needed; also replace the internal path
"./node_modules/next/dist/bin/next" with the stable invocation via pnpm exec or
the local node_modules/.bin entry to avoid breaking on Next.js upgrades.
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/web/src/layouts/DefaultLayout/Nav.styles.css.ts (1)
168-175: Keep hover animation behavior consistent with other DAO buttons.
hiddenDaoButtondoesn’t include the transition used bydaoButton, so hover changes will feel abrupt in this state. Consider reusing the same transition (or a shared base style) for consistent interaction.Proposed tweak
export const hiddenDaoButton = style({ background: color.background2, + transition: + 'border 0.1s ease-in-out, background 0.1s ease-in-out, transform 0.1s ease-out', selectors: { '&:hover': { background: color.ghostHover, }, }, })🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/web/src/layouts/DefaultLayout/Nav.styles.css.ts` around lines 168 - 175, hiddenDaoButton lacks the transition that daoButton uses, causing abrupt hover visuals; update hiddenDaoButton (or extract a shared base style) to include the same transition property used by daoButton so its background change uses the same easing/duration as daoButton's hover, ensuring consistent interaction behavior across both components.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@apps/web/src/layouts/DefaultLayout/Nav.styles.css.ts`:
- Around line 168-175: hiddenDaoButton lacks the transition that daoButton uses,
causing abrupt hover visuals; update hiddenDaoButton (or extract a shared base
style) to include the same transition property used by daoButton so its
background change uses the same easing/duration as daoButton's hover, ensuring
consistent interaction behavior across both components.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 3c65532c-516f-4ce3-8412-d16de1a6c68f
📒 Files selected for processing (2)
apps/web/src/layouts/DefaultLayout/Nav.styles.css.tsapps/web/src/modules/dashboard/dashboard.css.ts
xSatori
force-pushed
the
codex/dao-list-preferences
branch
from
468dff6 to
831cc11
Compare
xSatori
force-pushed
the
codex/dao-list-preferences
branch
from
831cc11 to
b88338b
Compare
Alias React Native AsyncStorage to a web shim so SDKs (e.g. MetaMask) that reference @react-native-async-storage/async-storage won't pull RN-specific modules into the web bundle. Adds path import and resolve.alias in apps/web/next.config.js, and creates apps/web/src/shims/reactNativeAsyncStorage.js — a simple Map-backed AsyncStorage implementation with multi* helpers and a useAsyncStorage hook. Attempting to resolve vercel build error: nouns-builder:build: Module not found: Can't resolve '@react-native-async-storage/async-storage' in '/vercel/path0/node_modules/.pnpm/@MetaMask[email protected][email protected][email protected][email protected]/node_modules/@metamask/sdk/dist/browser/es'
Cleanup: remove an unused BASE_URL import from profile/[user].tsx and delete a redundant comment in the API OG dao handler. These minor edits eliminate an unused-import lint warning and tidy up the getTreasuryBalance implementation.
Introduce a reusable daoVisibilityToggleButton style in profile.css.ts (minHeight, fontSize, padding, alignSelf) and apply it to the ProfileDaoList toggle button instead of the previous inline style. Also adjust the Dashboard toggle button to match the same visual sizing via inline style. This centralizes styling for the "Show/Hide hidden DAOs" controls and fixes alignment/size inconsistencies across components.
Introduce a new HiddenDaoDisclosure component and corresponding styles to show/hide hidden DAOs across the app. Replace previous inline "show hidden" buttons in ProfileDaoList, ProfileMenu and Dashboard with the disclosure component; split ordered DAOs into visible/hidden arrays and use isHiddenDaosOpen state. Improve drag-and-drop robustness: track pointerId, use pointer capture, prevent touch scrolling during drag (touchmove cancelable + touchAction/overscroll toggles), clamp autoscroll to the list bounds, and adjust autoscroll threshold/speed. Also add listRef, row pointer handling and cleanup listeners; remove the old daoVisibilityToggleButton style.
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Description
Adds DAO order and hidden-state preferences across the profile page, profile menu, and dashboard.
This removes pinning from the profile menu and dashboard, and adds an owner-only edit mode on the profile page for reordering DAOs and hiding/showing them.
Motivation & context
This change makes the profile page the place where users manage DAO visibility and order, and persists those preferences across all DAO list views.
Code review
Main files:
apps/web/src/utils/useDaoListPreferences.tsapps/web/src/components/ProfileDaoList.tsxType of change
Summary by CodeRabbit
New Features
Improvements
Style