Filter & sorting proposals in pool page #757

Mati0x · 2025-12-05T20:49:28Z

Filter and Sorting UX/UI. -> Clean and quick status filters with sort by 5 options aside. Active status and sort by most conviction as defaults.

When there are NO proposal yet in pool, this component is not shown.

Also I group: download proposals conviction button with add create proposal next to a ". . . " icon to keep UI cleaner

…ol page - cleaned up code and tested on Arbitrum Sepolia + 1Hive community

- upgrade layout and modal open/close logic - apply small tweaks to ProposalCard

…ponent

…pport

…er & Proposal component.

…sals

…dropdpwn option and state update

…nhance UI + add WIP loading state

…date

…icon to improve UI

…ionally + improve overall + small tweaks

vercel · 2025-12-05T20:49:33Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
gardens-v2	Ready	Preview	💬 6 unresolved	Dec 9, 2025 2:31am

Copilot

Pull request overview

This PR implements a filter and sorting UI/UX for proposals in the pool page. It introduces status filters (all, active, disputed, executed, cancelled) and sort options (newest, oldest, most supported, most requested, most conviction), with active status and most conviction as defaults. The UI is reorganized to show filters/sorting only when proposals exist, and the "Manage Support" allocation view is moved to a modal.

Key Changes

New ProposalsModalSupport component for handling proposal support allocation in a modal interface
useProposalFilter custom hook for managing filter and sort state with loading transitions
Refactored layout with filters/sorting UI component and repositioned action buttons
PoolGovernance and related components moved to the right sidebar alongside PoolMetrics

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 18 comments.

Show a summary per file

File	Description
ProposalsModalSupport.tsx	New component for managing proposal support in a modal view
Proposals.tsx	Major refactor: adds filtering/sorting UI, moves allocation view to modal, introduces useProposalFilter hook
ProposalCard.tsx	Simplified to remove allocation view logic, now only displays proposal information
PoolMetrics.tsx	Layout adjustments to remove wrapper div and simplify z-index handling
PoolHeader.tsx	Layout width adjustments for consistent grid sizing
PoolGovernance.tsx	Added wrapper div with z-index adjustment for proper layering
client-page.tsx	Restructured layout to include PoolGovernance in sidebar, added "Have an idea?" section

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2025-12-09T02:22:22Z

apps/web/components/Proposals.tsx

+  return {
+    filter,
+    setFilter: setFilterWithLoading,
+    sortBy: sortBy,


The return value sortBy: sortBy is redundant. Consider simplifying to just sortBy in the object shorthand.

Suggested change

sortBy: sortBy,

sortBy,

Copilot · 2025-12-09T02:22:22Z

apps/web/components/Proposals.tsx

+      <div className="flex gap-2 sm:justify-between flex-wrap ">
+        {FILTERS.map((f) => (
+          <Button
+            onClick={() => setFilter(f === filter ? null : f)}


The onClick handler toggles the filter to null when the same filter is clicked again, but the logic filter === f ? null : f means clicking "all" when "all" is already selected would set the filter to null. This could lead to unexpected behavior. Consider whether filter should never be null or if "all" should remain selected when clicked again.

Suggested change

onClick={() => setFilter(f === filter ? null : f)}

onClick={() => { if (f !== filter) setFilter(f); }}

Copilot · 2025-12-09T02:22:23Z

apps/web/app/(app)/gardens/[chain]/[garden]/[community]/[poolId]/client-page.tsx

+          </>
+        )}
+
+        <div className="section-layout flex flex-col items-start xl:items-center gap-4 -z-50">


The class -z-50 is used here as well. Applying such a low z-index to a section-layout component could cause visibility issues. Verify this is intentional and document why it's needed, or consider a more targeted approach.

Suggested change

<div className="section-layout flex flex-col items-start xl:items-center gap-4 -z-50">

<div className="section-layout flex flex-col items-start xl:items-center gap-4">

Here is why these sections are not interactable nnow

apps/web/components/Proposals.tsx

Copilot · 2025-12-09T02:22:25Z

apps/web/app/(app)/gardens/[chain]/[garden]/[community]/[poolId]/client-page.tsx

+
+  const chainId = useChainIdFromPath();
+
+  //New querys and logic for PoolGovernance component


Comment "New querys and logic for PoolGovernance component" contains a typo: "querys" should be "queries".

Suggested change

//New querys and logic for PoolGovernance component

//New queries and logic for PoolGovernance component

Copilot · 2025-12-09T02:22:25Z

apps/web/components/Proposals.tsx

+  const filteredProposals = useMemo(() => {
+    if (!filter || filter == "all") return proposals;
+
+    const status = FILTER_STATUS[filter];
+    return proposals.filter((p) => Number(p.proposalStatus) === status);
+  }, [filter, proposals]);


The useMemo dependency array is missing FILTER_STATUS. If FILTER_STATUS changes between renders (though it's defined as a constant in the function), it won't trigger a recomputation. Consider moving FILTER_STATUS outside the hook or including it in the dependency array.

apps/web/components/Proposals.tsx

Copilot · 2025-12-09T02:22:26Z

apps/web/components/ProposalsModalSupport.tsx

+/* eslint-disable jsx-a11y/click-events-have-key-events */
+"use client";
+
+import { forwardRef, useEffect, useImperativeHandle } from "react";


Unused import useEffect.

Suggested change

import { forwardRef, useEffect, useImperativeHandle } from "react";

import { forwardRef, useImperativeHandle } from "react";

Copilot · 2025-12-09T02:22:26Z

apps/web/components/ProposalsModalSupport.tsx

+      thresholdPct,
+      totalSupportPct,
+      timeToPass,
+      triggerConvictionRefetch,


Unused variable triggerConvictionRefetch.

Suggested change

triggerConvictionRefetch,

Mati0x added 19 commits November 13, 2025 17:35

refactor: extract PoolGovernance component and relocate queries to po…

3b83d74

…ol page - cleaned up code and tested on Arbitrum Sepolia + 1Hive community

refactor: isolate ProposalSupport into its own component

619b543

- upgrade layout and modal open/close logic - apply small tweaks to ProposalCard

refacttor: WIP ProposalsModalSuport

e7b12bd

Merge remote-tracking branch 'origin/dev' into refactor-Proposals-com…

bae3a36

…ponent

refactor: finalize abstractions and cleanup.

9e19acf

Merge remote-tracking branch 'origin/dev' into refactor-Proposals-com…

46e0e39

…ponent

fix typo + remove sliders from proposalCard + enhance proposalModalSu…

db633af

…pport

feat: enhance pool page layout

75335c6

abstract createProposal and add it top pool layout + upgrade PoolHead…

816cf1d

…er & Proposal component.

fix in poolpage layout when pool header is small

96a2bf0

feat: WIP filter proposal by status + test state

2089b69

fix: code cleanup and small fixes

cf70561

Merge branch 'refactor-Proposals-component' into filter-sorting-propo…

80b192f

…sals

feat: WI: create filter and sorting proposal logic + display UI with …

d0bc80b

…dropdpwn option and state update

Merge remote-tracking branch 'origin/dev' into filter-sorting-proposals

a4636df

feat: fully upgrade in proposals filter and sorting: improve logic, e…

bc3729c

…nhance UI + add WIP loading state

feat: enhance filters ui + add proposals by status count + overall up…

8fc512f

…date

featt: mobile vertsion filtering and sorting + encapsulate button in …

d2a37d0

…icon to improve UI

feat: improve non proposal yet in pool section+ render filters condic…

04ed2bc

…ionally + improve overall + small tweaks

Mati0x changed the title ~~Filter sorting proposals~~ Filter & sorting proposals in pool page Dec 8, 2025

feat: remove Cancel button in ModalSupport + small tweaks

d886a2f

vercel bot deployed to Preview December 8, 2025 23:34 View deployment

Corantin requested a review from Copilot December 9, 2025 02:04

Copilot started reviewing on behalf of Corantin December 9, 2025 02:04 View session

Copilot AI reviewed Dec 9, 2025

View reviewed changes

	onClick={() => setFilter(f === filter ? null : f)}
	onClick={() => { if (f !== filter) setFilter(f); }}

	<div className="section-layout flex flex-col items-start xl:items-center gap-4 -z-50">
	<div className="section-layout flex flex-col items-start xl:items-center gap-4">


		const chainId = useChainIdFromPath();

		//New querys and logic for PoolGovernance component

	//New querys and logic for PoolGovernance component
	//New queries and logic for PoolGovernance component

	import { forwardRef, useEffect, useImperativeHandle } from "react";
	import { forwardRef, useImperativeHandle } from "react";

Uh oh!

Filter & sorting proposals in pool page #757

Are you sure you want to change the base?

Filter & sorting proposals in pool page #757

Uh oh!

Conversation

Mati0x commented Dec 5, 2025

Uh oh!

vercel bot commented Dec 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Key Changes

Reviewed changes

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Corantin Dec 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Dec 9, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

vercel bot commented Dec 5, 2025 •

edited

Loading

Corantin Dec 9, 2025 •

edited

Loading