wip

proposals-app · Jan 21, 2025 · 68e9994 · 68e9994
1 parent 1836539
commit 68e9994
Show file tree

Hide file tree

Showing 13 changed files with 68 additions and 46 deletions.
diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/feed/actions.ts b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/feed/actions.ts
@@ -423,12 +423,12 @@ export async function getDelegate(
         topicEndTimes = topics.map((topic) => topic.lastPostedAt.getTime());
       }
 
-      // // Determine the start and end times based on proposals and topics
-      // const startTime = new Date(
-      //   Math.min(...proposalStartTimes, ...topicStartTimes)
-      // );
+      // Determine the start and end times based on proposals and topics
+      const startTime = new Date(
+        Math.min(...proposalStartTimes, ...topicStartTimes)
+      );
 
-      // const endTime = new Date(Math.max(...proposalEndTimes, ...topicEndTimes));
+      const endTime = new Date(Math.max(...proposalEndTimes, ...topicEndTimes));
 
       // Fetch the delegate with all related data in one query
       const delegateData = await db
@@ -451,8 +451,8 @@ export async function getDelegate(
         .leftJoin('voter', 'voter.id', 'delegateToVoter.voterId')
         .where('delegateToVoter.voterId', '=', voter.id)
         .where('delegate.daoId', '=', dao.id)
-        // .where('delegateToVoter.periodStart', '<=', startTime)
-        // .where('delegateToVoter.periodEnd', '>=', endTime)
+        .where('delegateToVoter.periodStart', '<=', startTime)
+        .where('delegateToVoter.periodEnd', '>=', endTime)
         .select([
           'delegate.id as delegateId',
           'discourseUser.name as discourseName',

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/feed/items/VoteItem.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/feed/items/VoteItem.tsx
@@ -202,7 +202,6 @@ const AuthorInfo = ({
   authorName,
   authorPicture,
   voterAddress,
-  isDelegate,
 }: {
   authorName: string;
   authorPicture: string | null;

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/menubar/FullViewBar.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/menubar/FullViewBar.tsx
@@ -2,8 +2,7 @@
 
 import { ViewEnum, VotesFilterEnum } from '@/app/searchParams';
 import * as Popover from '@radix-ui/react-popover';
-import * as Switch from '@radix-ui/react-switch';
-import { ArrowDown, ArrowUp, Check, ChevronsUpDown } from 'lucide-react';
+import { ArrowDown, Check, ChevronsUpDown } from 'lucide-react';
 import { parseAsBoolean, parseAsStringEnum, useQueryState } from 'nuqs';
 import { useEffect, useRef } from 'react';
 import { voteFilters } from './MenuBar';

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/BasicEvent.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/BasicEvent.tsx
@@ -11,12 +11,15 @@ interface BasicEventProps {
 export function BasicEvent({ content, url, last }: BasicEventProps) {
   return (
     <div className='relative mr-4 flex h-8 w-full items-center py-2'>
-      <div className='flex w-full items-center justify-between rounded-full border px-4 py-1'>
-        <div className='absolute left-3 top-3 z-20 h-[7px] w-[7px] rounded-full bg-gray-500' />
+      <div
+        className='flex w-full items-center justify-between rounded-full border border-neutral-300
+          bg-white px-4 py-1 dark:border-neutral-700 dark:bg-neutral-950'
+      >
+        <div className='absolute left-3 top-3 z-20 h-[7px] w-[7px] rounded-full bg-neutral-500' />
         {!last && (
           <div
             className='absolute left-3 top-[1px] z-10 h-[15px] max-h-[15px] w-0.5 translate-x-[2.5px]
-              bg-gray-500'
+              bg-neutral-500'
           />
         )}
         <div className='ml-2 text-xs'>{content}</div>

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/CommentsVolumeEvent.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/CommentsVolumeEvent.tsx
@@ -9,7 +9,7 @@ export function CommentsVolumeEvent({ volume }: CommentsVolumeEventProps) {
   return (
     <div className='flex h-full w-full items-center'>
       <div
-        className='ml-4 h-1 bg-gray-500 opacity-50'
+        className='ml-4 h-1 bg-neutral-200 dark:bg-neutral-700'
         style={{
           width: `${Math.max(volume * 80, 1)}%`,
         }}

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ResultEvent.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ResultEvent.tsx
@@ -74,12 +74,15 @@ export function ResultEvent({
       prefetch={true}
     >
       <div className='relative flex w-full items-center py-2'>
-        <div className='flex w-full flex-col gap-1 rounded-l-xl border px-4 py-2 pr-8'>
-          <div className='absolute left-3 top-5 z-20 h-[7px] w-[7px] rounded-full bg-gray-500' />
+        <div
+          className='flex w-full flex-col gap-1 rounded-l-xl border border-neutral-300 bg-white px-4
+            py-2 pr-8 dark:border-neutral-700 dark:bg-neutral-950'
+        >
+          <div className='absolute left-3 top-5 z-20 h-[7px] w-[7px] rounded-full bg-neutral-500' />
           {!last && (
             <div
               className='absolute left-3 top-[7px] z-10 h-[15px] max-h-[15px] w-0.5 translate-x-[2.5px]
-                bg-gray-500'
+                bg-neutral-500'
             />
           )}
           <div className='ml-2 flex w-full items-center justify-between'>

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/Timeline.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/Timeline.tsx
@@ -36,7 +36,7 @@ export async function Timeline({
         pt-24'
     >
       <div className='relative h-[calc(100vh-96px)] w-full'>
-        <div className='absolute bottom-5 left-[14px] top-5 w-0.5 translate-x-[0.5px] bg-gray-500' />
+        <div className='absolute bottom-5 left-[14px] top-5 w-0.5 translate-x-[0.5px] bg-neutral-500' />
         <div className='flex h-full flex-col justify-between'>
           {events.map((event, index) => {
             // Determine visibility based on filters and metadata
@@ -135,7 +135,7 @@ export function LoadingTimeline() {
     >
       <div className='relative h-[calc(100vh-96px)] w-full'>
         {/* Top SVG Placeholder */}
-        <div className='bg-muted-foreground absolute left-[14px] top-5 w-0.5 translate-x-[0.5px]'>
+        <div className='absolute left-[14px] top-5 w-0.5 translate-x-[0.5px] bg-neutral-500'>
           <svg
             width='21'
             height='21'
@@ -145,23 +145,23 @@ export function LoadingTimeline() {
             className='absolute -left-[10px] -top-[10px]'
           >
             <rect
+              className='dark:fill-bg-neutral-700 fill-neutral-300'
               x='0.5'
               y='0.5'
               width='20'
               height='20'
               rx='10'
-              fill='white'
               stroke='#D3D3D3'
             />
-            <circle cx='10.5' cy='10.5' r='3' fill='#737373' />
+            <circle cx='10.5' cy='10.5' r='3' className='fill-neutral-500' />
           </svg>
         </div>
 
         {/* Vertical Line Placeholder */}
-        <div className='bg-muted-foreground absolute bottom-5 left-[14px] top-5 w-0.5' />
+        <div className='absolute bottom-5 left-[14px] top-5 w-0.5 bg-neutral-500' />
 
         {/* Bottom SVG Placeholder */}
-        <div className='bg-muted-foreground absolute bottom-5 left-[14px] w-0.5 translate-x-[0.5px]'>
+        <div className='absolute bottom-5 left-[14px] w-0.5 translate-x-[0.5px] bg-neutral-500'>
           <svg
             width='21'
             height='21'
@@ -171,15 +171,15 @@ export function LoadingTimeline() {
             className='absolute -bottom-[10px] -left-[10px]'
           >
             <rect
+              className='dark:fill-bg-neutral-700 fill-neutral-300'
               x='0.5'
               y='0.5'
               width='20'
               height='20'
               rx='10'
-              fill='white'
               stroke='#D3D3D3'
             />
-            <circle cx='10.5' cy='10.5' r='3' fill='#737373' />
+            <circle cx='10.5' cy='10.5' r='3' className='fill-neutral-500' />
           </svg>
         </div>
       </div>

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/VotesVolumeEvent.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/VotesVolumeEvent.tsx
@@ -9,7 +9,7 @@ export function VotesVolumeEvent({ volume }: VotesVolumeEventProps) {
   return (
     <div className='flex h-full w-full items-center'>
       <div
-        className='ml-4 h-1 bg-gray-500 opacity-25'
+        className='ml-4 h-1 bg-neutral-300 dark:bg-neutral-600'
         style={{
           width: `${Math.max(volume * 80, 1)}%`,
         }}

diff --git a/...eb-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/ApprovalVote.tsx b/...eb-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/ApprovalVote.tsx
@@ -78,10 +78,13 @@ export const ApprovalVote = ({ proposal, votes }: ApprovalVoteProps) => {
   }
 
   return (
-    <div className='flex-col items-center justify-between space-y-1'>
-      <div className='flex h-4 w-full overflow-hidden rounded-md'>
+    <div className='flex-col items-center justify-between space-y-1 text-black'>
+      <div
+        className='flex h-4 w-full overflow-hidden rounded-md border border-neutral-350
+          dark:border-neutral-300'
+      >
         <div
-          className='h-full bg-green-500'
+          className='h-full bg-for-600'
           style={{ width: `${winningPercentage}%` }}
         />
       </div>

diff --git a/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/BasicVote.tsx b/apps/web-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/BasicVote.tsx
@@ -28,10 +28,10 @@ type VotesByChoice = Record<
 >;
 
 const VOTE_COLORS = {
-  For: 'bg-green-500',
-  Against: 'bg-red-500',
-  Abstain: 'bg-yellow-500',
-  Unknown: 'bg-gray-500',
+  For: 'bg-for-600',
+  Against: 'bg-against-600',
+  Abstain: 'bg-abstain-600',
+  Unknown: 'bg-neutral-600',
 } as const;
 
 const MIN_VISIBLE_WIDTH_PERCENT = 1; // Minimum width for a vote to be visible (0.5% of total width)
@@ -225,16 +225,20 @@ export const BasicVote = ({ proposal, votes }: BasicVoteProps) => {
     tooltip,
     isAggregated = false,
   }: {
-    color: 'bg-green-500' | 'bg-red-500' | 'bg-yellow-500' | 'bg-gray-500'; // Explicitly define the allowed CSS class names
+    color:
+      | 'bg-for-600'
+      | 'bg-against-600'
+      | 'bg-abstain-600'
+      | 'bg-neutral-600'; // Explicitly define the allowed CSS class names
     width: number;
     tooltip: string;
     isAggregated?: boolean;
   }) => {
     const colorMap = {
-      'bg-green-500': '#22c55e',
-      'bg-red-500': '#ef4444',
-      'bg-yellow-500': '#eab308',
-      'bg-gray-500': '#6b7280',
+      'bg-for-600': '#56B200',
+      'bg-against-600': '#FF4242',
+      'bg-abstain-600': '#FFBC1F',
+      'bg-neutral-600': '#6b7280',
     } as const;
 
     const cssColor = colorMap[color] || '#6b7280';
@@ -243,7 +247,9 @@ export const BasicVote = ({ proposal, votes }: BasicVoteProps) => {
       <Tooltip.Root>
         <Tooltip.Trigger asChild>
           <div
-            className={'h-full border-r hover:opacity-90'}
+            className={
+              'h-full border-r border-white hover:opacity-90 dark:border-neutral-950'
+            }
             style={{
               width: `${width}%`,
               ...(isAggregated
@@ -298,7 +304,7 @@ export const BasicVote = ({ proposal, votes }: BasicVoteProps) => {
   return (
     <Tooltip.Provider>
       <div className='space-y-1'>
-        <div className='flex h-4 w-full overflow-hidden rounded'>
+        <div className='rounde flex h-4 w-full overflow-hidden rounded'>
           {(['For', 'Abstain', 'Against', 'Unknown'] as const).map((choice) => {
             const voteData = votesByChoice[choice];
             if (!voteData) return null;

diff --git a/...rbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/RankedChoiceVote.tsx b/...rbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/RankedChoiceVote.tsx
@@ -125,9 +125,12 @@ export const RankedChoiceVote = ({
 
   return (
     <div className='flex-col items-center justify-between space-y-1'>
-      <div className='flex h-4 w-full overflow-hidden rounded-md'>
+      <div
+        className='flex h-4 w-full overflow-hidden rounded-md border border-neutral-350
+          dark:border-neutral-300'
+      >
         <div
-          className='h-full bg-green-500'
+          className='h-full bg-for-600'
           style={{ width: `${winningPercentage}%` }}
         />
       </div>

diff --git a/...rbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/SingleChoiceVote.tsx b/...rbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/SingleChoiceVote.tsx
@@ -89,9 +89,12 @@ export const SingleChoiceVote = ({
 
   return (
     <div className='flex-col items-center justify-between space-y-1'>
-      <div className='flex h-4 w-full overflow-hidden rounded-md'>
+      <div
+        className='flex h-4 w-full overflow-hidden rounded-md border border-neutral-350
+          dark:border-neutral-300'
+      >
         <div
-          className='h-full bg-green-500'
+          className='h-full bg-for-600'
           style={{ width: `${winningPercentage}%` }}
         />
       </div>

diff --git a/...eb-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/WeightedVote.tsx b/...eb-arbitrum/app/[daoSlug]/[groupId]/components/timeline/ended_vote_types/WeightedVote.tsx
@@ -95,9 +95,12 @@ export const WeightedVote = ({ proposal, votes }: WeightedVoteProps) => {
 
   return (
     <div className='flex-col items-center justify-between space-y-1'>
-      <div className='flex h-4 w-full overflow-hidden rounded-md'>
+      <div
+        className='flex h-4 w-full overflow-hidden rounded-md border border-neutral-350
+          dark:border-neutral-300'
+      >
         <div
-          className='h-full bg-green-500'
+          className='h-full bg-for-600'
           style={{ width: `${winningPercentage}%` }}
         />
       </div>