Skip to content

Commit 8201452

Browse files
0xdevcollins0xdevcollins
authored
Collins (#324)
* refactor: update project components and API for voting functionality - Adjust layout and styling in ProjectsPage and ProjectCard components. - Enhance ProjectSidebar to include crowdfund data and voting logic. - Implement new API methods for voting, retrieving votes, and removing votes. - Update types for vote handling in the API. - Clean up unused code and improve responsiveness across components. * chore: update project dependencies and enhance project details layout * feat: added static api for staging * fix: made few changes * fix: minor changes
1 parent 1037842 commit 8201452

2 files changed

Lines changed: 76 additions & 96 deletions

File tree

‎components/landing-page/project/CreateProjectModal/TransactionSigningScreen.tsx‎

Lines changed: 66 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,12 @@
11
import React from 'react';
22
import { Button } from '@/components/ui/button';
33
import {
4-
Card,
5-
CardContent,
6-
CardDescription,
7-
CardHeader,
8-
CardTitle,
9-
} from '@/components/ui/card';
10-
import { AlertCircle, CheckCircle, Loader2 } from 'lucide-react';
4+
Tooltip,
5+
TooltipContent,
6+
TooltipProvider,
7+
TooltipTrigger,
8+
} from '@/components/ui/tooltip';
9+
import { Info, Loader2 } from 'lucide-react';
1110

1211
interface TransactionSigningScreenProps {
1312
onSign: () => void;
@@ -27,36 +26,13 @@ const TransactionSigningScreen: React.FC<TransactionSigningScreenProps> = ({
2726
errorMessage,
2827
}) => {
2928
return (
30-
<div className='flex h-full items-center justify-center'>
31-
<Card className='w-full max-w-md'>
32-
<CardHeader className='text-center'>
33-
<div className='mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-blue-500/10'>
34-
{isSigning ? (
35-
<Loader2 className='h-8 w-8 animate-spin text-blue-500' />
36-
) : (
37-
<AlertCircle className='h-8 w-8 text-blue-500' />
38-
)}
39-
</div>
40-
<CardTitle className='text-xl'>
41-
{flowStep === 'confirming'
42-
? 'Creating Your Project...'
43-
: isSigning
44-
? 'Signing Transaction...'
45-
: 'Sign Transaction Required'}
46-
</CardTitle>
47-
<CardDescription>
48-
{flowStep === 'confirming'
49-
? 'Please wait while we finalize your project creation.'
50-
: isSigning
51-
? 'Please confirm the transaction in your wallet to complete project creation.'
52-
: 'Your project has been prepared and requires a transaction signature to be finalized.'}
53-
</CardDescription>
54-
</CardHeader>
55-
<CardContent className='space-y-4'>
29+
<TooltipProvider>
30+
<div className='flex h-full items-center justify-center'>
31+
<div className='flex flex-col items-center space-y-4'>
5632
{hasError && errorMessage && (
57-
<div className='rounded-lg border border-red-500/40 bg-red-500/10 p-4'>
33+
<div className='max-w-md rounded-lg border border-red-500/40 bg-red-500/10 p-4'>
5834
<div className='flex items-start gap-2'>
59-
<AlertCircle className='mt-0.5 h-4 w-4 flex-shrink-0 text-red-500' />
35+
<Info className='mt-0.5 h-4 w-4 flex-shrink-0 text-red-500' />
6036
<div>
6137
<h4 className='text-sm font-medium text-red-300'>Error</h4>
6238
<p className='text-sm text-red-200'>{errorMessage}</p>
@@ -65,73 +41,68 @@ const TransactionSigningScreen: React.FC<TransactionSigningScreenProps> = ({
6541
</div>
6642
)}
6743

68-
<div className='rounded-lg bg-gray-800/50 p-4'>
69-
<h4 className='mb-2 text-sm font-medium text-gray-300'>
70-
What happens next?
71-
</h4>
72-
<ul className='space-y-2 text-sm text-gray-400'>
73-
<li className='flex items-start gap-2'>
74-
<CheckCircle className='mt-0.5 h-4 w-4 flex-shrink-0 text-green-500' />
75-
<span>Your project details have been prepared</span>
76-
</li>
77-
<li className='flex items-start gap-2'>
78-
<CheckCircle className='mt-0.5 h-4 w-4 flex-shrink-0 text-green-500' />
79-
<span>Escrow contract is ready for funding</span>
80-
</li>
81-
<li className='flex items-start gap-2'>
82-
{flowStep === 'confirming' ? (
83-
<Loader2 className='mt-0.5 h-4 w-4 animate-spin text-blue-500' />
84-
) : isSigning ? (
85-
<Loader2 className='mt-0.5 h-4 w-4 animate-spin text-blue-500' />
86-
) : (
87-
<AlertCircle className='mt-0.5 h-4 w-4 text-yellow-500' />
88-
)}
89-
<span>
44+
<div className='flex items-center gap-2'>
45+
<Button
46+
onClick={onSign}
47+
className='w-full max-w-md'
48+
size='lg'
49+
disabled={isSigning || flowStep === 'confirming'}
50+
>
51+
{isSigning || flowStep === 'confirming' ? (
52+
<>
53+
<Loader2 className='mr-2 h-4 w-4 animate-spin' />
9054
{flowStep === 'confirming'
91-
? 'Finalizing project creation...'
92-
: isSigning
93-
? 'Waiting for transaction signature...'
94-
: 'Sign the transaction to activate your project'}
95-
</span>
96-
</li>
97-
</ul>
55+
? 'Creating Project...'
56+
: 'Signing...'}
57+
</>
58+
) : (
59+
'Sign Transaction'
60+
)}
61+
</Button>
62+
63+
{!isSigning && flowStep === 'signing' && (
64+
<Tooltip>
65+
<TooltipTrigger asChild>
66+
<Button variant='ghost' size='icon' className='h-10 w-10'>
67+
<Info className='h-4 w-4' />
68+
</Button>
69+
</TooltipTrigger>
70+
<TooltipContent className='w-80' align='end'>
71+
<div className='space-y-2'>
72+
<h4 className='font-medium'>What happens when you sign?</h4>
73+
<div className='space-y-2 text-sm text-gray-600'>
74+
<p>• Your project will be created on the blockchain</p>
75+
<p>• An escrow contract will be set up for funding</p>
76+
<p>• Team members will receive invitations</p>
77+
<p>• Your project will be visible to the community</p>
78+
</div>
79+
</div>
80+
</TooltipContent>
81+
</Tooltip>
82+
)}
9883
</div>
9984

100-
{flowStep === 'signing' && !isSigning && (
101-
<div className='space-y-2'>
102-
<Button onClick={onSign} className='w-full' size='lg'>
103-
Sign Transaction
104-
</Button>
105-
{hasError && onRetry && (
106-
<Button
107-
onClick={onRetry}
108-
variant='outline'
109-
className='w-full'
110-
size='lg'
111-
>
112-
Try Again
113-
</Button>
114-
)}
115-
</div>
85+
{hasError && onRetry && (
86+
<Button
87+
onClick={onRetry}
88+
variant='outline'
89+
className='w-full max-w-md'
90+
size='lg'
91+
>
92+
Try Again
93+
</Button>
11694
)}
11795

11896
{(isSigning || flowStep === 'confirming') && (
119-
<div className='text-center text-sm text-gray-400'>
120-
<p>
121-
{flowStep === 'confirming'
122-
? 'Please wait while we create your project...'
123-
: 'Please check your wallet for the transaction prompt.'}
124-
</p>
125-
<p className='mt-1'>
126-
{flowStep === 'confirming'
127-
? 'This may take a few moments...'
128-
: 'This may take a few moments...'}
129-
</p>
130-
</div>
97+
<p className='max-w-md text-center text-sm text-gray-400'>
98+
{flowStep === 'confirming'
99+
? 'Please wait while we create your project...'
100+
: 'Please check your wallet for the transaction prompt.'}
101+
</p>
131102
)}
132-
</CardContent>
133-
</Card>
134-
</div>
103+
</div>
104+
</div>
105+
</TooltipProvider>
135106
);
136107
};
137108

‎components/landing-page/project/CreateProjectModal/index.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
} from '@/lib/api/types';
2222
import { useWalletInfo, useWalletSigning } from '@/hooks/use-wallet';
2323
import { useWalletProtection } from '@/hooks/use-wallet-protection';
24+
import { cn } from '@/lib/utils';
2425

2526
type StepHandle = { validate: () => boolean; markSubmitted?: () => void };
2627

@@ -694,7 +695,15 @@ Our development is structured in clear phases with measurable milestones and com
694695
)}
695696
<div
696697
ref={contentRef}
697-
className={`min-h-[calc(55vh)] px-4 transition-opacity duration-100 md:px-[50px] lg:px-[75px] xl:px-[150px]`}
698+
className={cn(
699+
'min-h-[calc(55vh)] px-4 transition-opacity duration-100 md:px-[50px] lg:px-[75px] xl:px-[150px]',
700+
flowStep === 'confirming' ||
701+
isSigningTransaction ||
702+
(flowStep === 'signing' &&
703+
unsignedTransaction &&
704+
!isSigningTransaction),
705+
'flex h-full items-center justify-center'
706+
)}
698707
>
699708
{flowStep !== 'form' ? (
700709
<div className='flex h-full items-center justify-center'>

0 commit comments

Comments
 (0)