Skip to content

Commit 7d35220

Browse files
committed
removed token list for now, let program remain on devnet
1 parent 424bea1 commit 7d35220

File tree

9 files changed

+59
-337
lines changed

9 files changed

+59
-337
lines changed

src/app/globals.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,3 +80,8 @@ body {
8080
@apply bg-background text-foreground;
8181
}
8282
}
83+
84+
.glow-effect-text {
85+
text-shadow: 0 0 7px rgba(255, 255, 255, 0.6);
86+
transition: box-shadow 0.3s ease-in-out;
87+
}

src/components/ui/ui-layout.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ export function AppHero({
106106
subtitle: ReactNode
107107
}) {
108108
return (
109-
<div className="hero pb-16">
109+
<div className="hero">
110110
<div className="hero-content text-center">
111111
<div className="max-w-3xl">
112112
{typeof title === 'string' ?
@@ -115,7 +115,7 @@ export function AppHero({
115115
</h1>
116116
: title}
117117
{typeof subtitle === 'string' ?
118-
<p className="text-xl mb-8 tracking-tight text-white opacity-60 drop-shadow-md text-shadow-md">
118+
<p className="text-[1.1rem] font-normal glow-effect-text tracking-tight text-white opacity-80 drop-shadow-md text-shadow-md">
119119
{subtitle}
120120
</p>
121121
: subtitle}
@@ -161,7 +161,7 @@ export function useTransactionToast() {
161161
</h3>
162162
</div>
163163
<a
164-
href={`https://explorer.solana.com/tx/${signature}?cluster=devnet`}
164+
href={`https://explorer.solana.com/tx/${signature}`}
165165
target="_blank"
166166
rel="noopener noreferrer"
167167
className="flex items-center justify-center gap-2 px-4 py-2 bg-blue-900/30 hover:bg-blue-900/50 text-blue-400 text-sm font-medium rounded-md transition-colors duration-200"

src/components/vesting/employee-allocations-list.tsx

Lines changed: 7 additions & 185 deletions
Original file line numberDiff line numberDiff line change
@@ -5,26 +5,13 @@ import { PublicKey } from '@solana/web3.js'
55
import { BN } from "@coral-xyz/anchor"
66
import { ExternalLink } from 'lucide-react'
77
import useTokenDecimals from '../../hooks/useTokenDecimals';
8+
import { AllocationCardParamsT } from '@/types';
89
import { formatDate, compressPublicKey } from '@/app/lib/utils';
910
import { progressPercentageCalc } from '@/app/lib/utils';
1011
import { useWallet } from '@solana/wallet-adapter-react';
1112

12-
interface AllocationCardParamsT{
13-
ownerOfVestingAccountForGivenEmployee: string,
14-
start_time: BN,
15-
end_time: BN,
16-
cliff: number,
17-
total_allocation_amount: BN,
18-
withdrawn_amount: BN,
19-
actualTotalAllocationAmount: number,
20-
actualWithdrawnAmount: number,
21-
beneficiary: string,
22-
companyName: string,
23-
token_mint: string
24-
}
25-
2613
export function AllocationList(){
27-
const { getProgramAccount, employeeAccounts, employeeAccountsWithMetadata } = useVestingProgram();
14+
const { getProgramAccount, employeeAccountsWithMetadata } = useVestingProgram();
2815
const wallet = useWallet();
2916

3017
if (getProgramAccount.isLoading) {
@@ -92,159 +79,6 @@ export function AllocationList(){
9279
</div>
9380
)
9481
}
95-
96-
// export function CompanyList(){
97-
// const { getProgramAccount, vestingAccounts } = useVestingProgram()
98-
// const [selectedCompany, setSelectedCompany] = useState<{account: string, companyName: string} | null>(null);
99-
100-
101-
// // Get unique companies
102-
// const uniqueCompanies = useMemo(() => {
103-
// const companyMap = new Map<string, {account: string, companyName: string}>();
104-
// vestingAccounts.data?.forEach((vestingAccount) => {
105-
// const companyName = vestingAccount.account.companyName ?? "Unknown Company";
106-
// if (!companyMap.has(companyName)) {
107-
// companyMap.set(companyName, {
108-
// account: vestingAccount.publicKey.toBase58(),
109-
// companyName: companyName
110-
// });
111-
// }
112-
// });
113-
// return Array.from(companyMap.values());
114-
// }, [vestingAccounts.data]);
115-
116-
// if (getProgramAccount.isLoading) {
117-
// return (
118-
// <div className="flex justify-center items-center h-24">
119-
// <span className="loading loading-spinner loading-lg" />
120-
// </div>
121-
// );
122-
// }
123-
124-
// if (!getProgramAccount.data?.value) {
125-
// return (
126-
// <div className="flex justify-center p-2">
127-
// <div className="bg-blue-50 text-black px-4 py-2 rounded-lg max-w-2xl">
128-
// <span>Program account not found. Make sure you have deployed the program and are on the correct cluster.</span>
129-
// </div>
130-
// </div>
131-
// );
132-
// }
133-
134-
// return(
135-
// <>
136-
// <div className="px-4 -mt-4">
137-
// <div className="max-w-7xl mx-auto rounded-xl shadow-sm p-4">
138-
// <div className='flex flex-col space-y-4'>
139-
// {uniqueCompanies.map((company) => (
140-
// <div
141-
// key={company.companyName}
142-
// className="w-full bg-gray-800 hover:bg-gray-700 transition-colors duration-200 rounded-lg cursor-pointer"
143-
// onClick={() => setSelectedCompany(company)}
144-
// >
145-
// <div className="px-6 py-4 text-white text-lg font-semibold">
146-
// {company.companyName}
147-
// </div>
148-
// </div>
149-
// ))}
150-
151-
// {selectedCompany && (
152-
// <div className="mt-6">
153-
// <EmployeeAllocationsListForGivenCompany
154-
// account={selectedCompany.account}
155-
// company_name={selectedCompany.companyName}
156-
// />
157-
// </div>
158-
// )}
159-
// </div>
160-
// </div>
161-
// </div>
162-
// </>
163-
// )
164-
// }
165-
166-
// export function CompanyList(){
167-
// const { vestingAccounts } = useVestingProgram()
168-
169-
// return(
170-
// <>
171-
// <div className='flex-flex col'>
172-
// {/* a company bars list(horizontally full screen width bars listed in vertical order showing company name ) */}
173-
// {vestingAccounts.data?.map((vestingAccount) => {
174-
// const company = vestingAccount.account.companyName ?? "Unknown Company";
175-
// return(
176-
// <>
177-
// {/* company bar(on click should change open the EmployeeAllocationsListForGivenCompany component) */}
178-
// </>)
179-
// })}
180-
// </div>
181-
// </>
182-
// )
183-
// }
184-
185-
// export function EmployeeAllocationsListForGivenCompany({account, company_name} : {account: string, company_name: string}) {
186-
// const { employeeAccounts } = useVestingProgram();
187-
// const provider = useAnchorProvider()
188-
// const clusterNetwork = "devnet";
189-
// const program = getVestingProgram(provider)
190-
191-
// // Explicitly type the state with the correct type
192-
// const [filteredEmployeeAccounts, setFilteredEmployeeAccounts] = useState<ProgramAccount<{
193-
// beneficiary: PublicKey;
194-
// tokenAllocationAmount: BN;
195-
// withdrawnAmount: BN;
196-
// vestingAccount: PublicKey;
197-
// startTime: BN;
198-
// endTime: BN;
199-
// cliff: BN;
200-
// bump: number;
201-
// }>[]>([]);
202-
203-
// useEffect(() => {
204-
// const filterEmployeeAccounts = async () => {
205-
// if (!employeeAccounts.data) return;
206-
207-
// const filtered = await Promise.all(
208-
// employeeAccounts.data.map(async (employeeAccount) => {
209-
// try {
210-
// const getVestingAccountStateQuery = await program.account.vestingAccount.fetch(
211-
// employeeAccount.account.vestingAccount,
212-
// "confirmed"
213-
// );
214-
215-
// return getVestingAccountStateQuery.companyName === company_name
216-
// ? employeeAccount
217-
// : null;
218-
// } catch (error) {
219-
// console.error("Error fetching vesting account:", error);
220-
// return null;
221-
// }
222-
// })
223-
// );
224-
225-
// // Remove null values and set the state
226-
// setFilteredEmployeeAccounts(
227-
// filtered.filter((acc) => acc !== null)
228-
// );
229-
// };
230-
231-
// filterEmployeeAccounts();
232-
// }, [company_name, employeeAccounts.data, program.account.vestingAccount]);
233-
234-
// return (
235-
// <div className='flex flex-col'>
236-
// {filteredEmployeeAccounts.map((acc) => (
237-
// <div
238-
// key={acc.publicKey.toString()}
239-
// className="transform transition-all duration-200 hover:scale-[1.02]"
240-
// >
241-
// <AllocationCard account={acc.publicKey.toBase58()} />
242-
// </div>
243-
// )
244-
// )}
245-
// </div>
246-
// );
247-
// }
24882

24983
export function AllocationCard({employeeAccount, allocationCardParams} : { employeeAccount: string, allocationCardParams: AllocationCardParamsT }){
25084
const employee = new PublicKey(employeeAccount);
@@ -259,22 +93,10 @@ export function AllocationCard({employeeAccount, allocationCardParams} : { emplo
25993
const token_mint = allocationCardParams.token_mint;
26094
const total_allocation_amount = allocationCardParams.total_allocation_amount;
26195
const withdrawn_amount = allocationCardParams.withdrawn_amount;
262-
// const decimals = useTokenDecimals(tokenMint.toString())
263-
264-
const actualTotalAllocationAmount = allocationCardParams.actualTotalAllocationAmount;
265-
// const actualTotalAllocationAmount = Math.floor(total_allocation_amount?.toNumber() /(10**decimals));
266-
// const actualWithdrawnAmount = Math.floor(withdrawn_amount?.toNumber() /(10**decimals));
267-
const actualWithdrawnAmount = allocationCardParams.actualWithdrawnAmount;
268-
const beneficiary = allocationCardParams.beneficiary;
26996

270-
// withdrawn amount progress bar
271-
// const progressPercentage = useMemo(() => {
272-
// const totalAllocation = parseFloat(total_allocation_amount.toString());
273-
// const withdrawn = parseFloat(withdrawn_amount.toString());
274-
// return totalAllocation > 0
275-
// ? Math.min((withdrawn / totalAllocation) * 100, 100)
276-
// : 0;
277-
// }, [total_allocation_amount, withdrawn_amount]);
97+
const actualTotalAllocationAmount = allocationCardParams.actualTotalAllocationAmount;
98+
const actualWithdrawnAmount = allocationCardParams.actualWithdrawnAmount;
99+
const beneficiary = allocationCardParams.beneficiary;
278100
const progressPercentage = progressPercentageCalc(total_allocation_amount, withdrawn_amount)
279101

280102
const isClaimExpired = (Date.now()/1000) > endTime.toNumber();
@@ -290,7 +112,7 @@ export function AllocationCard({employeeAccount, allocationCardParams} : { emplo
290112
Token allocation for{' '}
291113
<span className='ml-2 text-medium text-teal-400 z-40'>{compressPublicKey(beneficiary || 'yoben....') }</span>
292114
<a
293-
href={beneficiary ? `https://solscan.io/address/${beneficiary}?cluster=devnet` : '#'}
115+
href={beneficiary ? `https://solscan.io/address/${beneficiary}` : '#'}
294116
target="_blank"
295117
rel="noopener noreferrer"
296118
className="ml-2 z-40"
@@ -343,7 +165,7 @@ export function AllocationCard({employeeAccount, allocationCardParams} : { emplo
343165
{compressPublicKey(token_mint)}
344166
</p>
345167
<a
346-
href={`https://solscan.io/token/${token_mint}?cluster=devnet`}
168+
href={`https://solscan.io/token/${token_mint}`}
347169
target="_blank"
348170
rel="noopener noreferrer"
349171
className="text-blue-500 hover:text-blue-700 z-20"

src/components/vesting/vesting-data-access.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ const endpoint = process.env.NODE_ENV === 'development'
1818
? 'http://localhost:3000'
1919
: 'https://openvest.vercel.app';
2020

21+
const connection = new Connection(clusterApiUrl("devnet"), "confirmed");
22+
2123
//getting all the vesting accounts, program methods, and defining individual hooks for ops
2224
//useQuery for fetching Vesting Accounts associated with given programId, useMutation for creating vesting accounts/claiming tokens
2325
export function useVestingProgram() {
@@ -308,7 +310,6 @@ export function useVestingProgramAccount({ account }: { account: PublicKey }) {
308310
mutationFn: async () => {
309311
const employeeVestingAccount = await program.account.employeeVestingAccount.fetch(account); //fetching employee vesting account FROM company vesting account
310312
const vestingAccount = await program.account.vestingAccount.fetch(employeeVestingAccount.vestingAccount); // fetching relevant vesting account for the given employee account
311-
312313
return program.methods.claimTokens(vestingAccount.companyName)
313314
.accounts({
314315
tokenProgram: TOKEN_PROGRAM_ID

src/components/vesting/vesting-feature.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function VestingFeature() {
1212
const { publicKey } = useWallet()
1313

1414
return publicKey ? (
15-
<div className="flex flex-col z-40 w-full min-h-screen mt--16 bg-gradient-to-b from-gray-900 to-black relative overflow-hidden">
15+
<div className="flex flex-col z-40 w-full min-h-screen bg-gradient-to-b from-gray-900 to-black overflow-hidden">
1616
<div className="absolute inset-0 bg-grid-white/[0.05] pointer-events-none"></div>
1717
<div className="absolute inset-0 flex items-center justify-center bg-black [mask-image:radial-gradient(ellipse_at_center,transparent_20%,black)]"></div>
1818
<div

src/components/vesting/vesting-ui.tsx

Lines changed: 11 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,6 @@ export function VestingCreate() {
2424
const [newCompany, setNewCompany] = useState('')
2525
const [newMintAddress, setNewMintAddress] = useState('');
2626
const [treasuryAmount, setTreasuryAmount] = useState('');
27-
// const [tokenList, setTokenList] = useState<Token[]>([]);
2827
const { tokenList, isLoading, error } = useTokenList()
2928
const [selectedToken, setSelectedToken] = useState<Token>({
3029
address: "EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v",
@@ -68,27 +67,20 @@ export function VestingCreate() {
6867
autoComplete="off"
6968
/>
7069
</div>
71-
72-
{/* <div className="grid grid-cols-1 md:grid-cols-4 items-center gap-4">
73-
<Label htmlFor="mintAddress" className="text-right text-base text-gray-300 md:col-span-1">
74-
Token Mint
75-
</Label>
76-
<Input
77-
id="mintAddress"
78-
value={newMintAddress}
79-
onChange={(e) => setNewMintAddress(e.target.value)}
80-
className="md:col-span-3 rounded-full h-14 w-full px-4 py-3 text-base bg-gray-800 border border-gray-700 text-white placeholder-gray-500 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 transition-all duration-300"
81-
placeholder="Mint Address"
82-
autoComplete="off"
83-
/>
84-
</div> */}
8570

8671
<div className="grid grid-cols-1 md:grid-cols-4 items-center gap-4">
8772
<Label htmlFor="token" className="text-right text-base text-gray-300 md:col-span-1">
8873
Token
8974
</Label>
90-
<div className="md:col-span-3">
91-
<Select
75+
<Input
76+
id="mint"
77+
type="text"
78+
onChange={(e) => setNewMintAddress(e.target.value)}
79+
className="md:col-span-3 rounded-full h-14 w-full px-4 py-3 text-base bg-gray-800 border border-gray-700 text-white placeholder-gray-500 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 transition-all duration-300"
80+
placeholder={`Token Mint Address`}
81+
autoComplete="off"
82+
/>
83+
{/* <Select
9284
defaultValue="USDC"
9385
value={selectedToken.address}
9486
onValueChange={(val) => {
@@ -128,8 +120,7 @@ export function VestingCreate() {
128120
))}
129121
</SelectGroup>
130122
</SelectContent>
131-
</Select>
132-
</div>
123+
</Select> */}
133124
</div>
134125
<div className="grid grid-cols-1 md:grid-cols-4 items-center gap-4">
135126
<Label htmlFor="treasuryAmount" className="text-right text-base text-gray-300 md:col-span-1">
@@ -141,7 +132,7 @@ export function VestingCreate() {
141132
value={treasuryAmount}
142133
onChange={(e) => setTreasuryAmount(e.target.value)}
143134
className="md:col-span-3 rounded-full h-14 w-full px-4 py-3 text-base bg-gray-800 border border-gray-700 text-white placeholder-gray-500 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 transition-all duration-300"
144-
placeholder={`Amount of ${selectedToken.symbol} to lock in treasury`}
135+
placeholder={`Amount of tokens to lock in treasury`}
145136
autoComplete="off"
146137
/>
147138
</div>

0 commit comments

Comments
 (0)