From 49a43488bebaedfa7209851266f89b93c2cb8deb Mon Sep 17 00:00:00 2001 From: jonniie Date: Thu, 23 Apr 2026 22:33:13 +0100 Subject: [PATCH 1/4] ci: add GitHub Actions workflow for lint, type-check, and build --- .github/workflows/ci.yml | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/ci.yml diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 0000000..bb27ee0 --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,34 @@ +name: CI + +on: + push: + branches: [main] + pull_request: + branches: [main] + +jobs: + ci: + name: Lint, Type-check & Build + runs-on: ubuntu-latest + + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Set up Node.js + uses: actions/setup-node@v4 + with: + node-version: 20 + cache: 'npm' + + - name: Install dependencies + run: npm ci + + - name: Lint + run: npm run lint + + - name: Type check + run: npx tsc --noEmit + + - name: Build + run: npm run build \ No newline at end of file From ae9480fbcec4448481b5c5047ee50b54e2bf90c8 Mon Sep 17 00:00:00 2001 From: jonniie Date: Thu, 23 Apr 2026 22:36:37 +0100 Subject: [PATCH 2/4] fix: update lint script to use eslint . for ESLint v9 flat config --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 930c7e9..dc7461f 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "dev": "next dev", "build": "next build", "start": "next start", - "lint": "eslint" + "lint": "eslint ." }, "dependencies": { "@radix-ui/react-checkbox": "^1.3.3", From 1e15fbe110df1ea27a1e8dd098aced7ad0e53dc9 Mon Sep 17 00:00:00 2001 From: jonniie Date: Thu, 23 Apr 2026 23:01:49 +0100 Subject: [PATCH 3/4] ci: add GitHub Actions workflow and fix lint/type errors --- app/(auth)/forgot-password/page.tsx | 4 +- app/(auth)/sign-in/page.tsx | 11 +- app/(auth)/verify-otp/page.tsx | 13 +- app/(dashboard)/transactions/page.tsx | 68 ++++---- app/api/exchange-rates/route.ts | 4 +- app/components/transactions/empty-state.tsx | 17 -- app/components/transactions/pagination.tsx | 93 ---------- .../transactions/transaction-details.tsx | 103 ----------- .../transactions/transaction-filters.tsx | 118 ------------- .../transactions/transaction-list.tsx | 94 ---------- .../transactions/transaction-table.tsx | 104 ----------- app/lib/utils/csv-export.ts | 2 +- components/admin/AdminGuard.tsx | 37 ++-- components/admin/RevenueChart.tsx | 8 +- components/dashboard/InstantDepositModal.tsx | 124 +++++--------- components/dashboard/convert/convert-form.tsx | 37 +--- components/dashboard/deposit.tsx | 11 +- components/dashboard/market-overview.tsx | 2 +- components/dashboard/notification.tsx | 5 +- .../dashboard/withdrawal/WithdrawalForm.tsx | 60 +++++-- .../notifications/notification-item.tsx | 2 +- .../swipeable-notification-item.tsx | 12 +- components/profile/personal-info.tsx | 21 ++- components/profile/profile-edit-form.tsx | 4 +- components/profile/profile-overview.tsx | 30 ++-- components/profile/verification-modal.tsx | 161 ++++++++---------- components/settings/info-avatar.tsx | 2 +- .../transactions/transaction-details.tsx | 23 ++- .../transactions/transaction-filters.tsx | 6 + hooks/use-focus-trap.ts | 2 +- hooks/use-notifications-store.ts | 4 +- lib/api-client.ts | 57 +++---- lib/api/transactions.ts | 88 +++++----- 33 files changed, 365 insertions(+), 962 deletions(-) delete mode 100644 app/components/transactions/empty-state.tsx delete mode 100644 app/components/transactions/pagination.tsx delete mode 100644 app/components/transactions/transaction-details.tsx delete mode 100644 app/components/transactions/transaction-filters.tsx delete mode 100644 app/components/transactions/transaction-list.tsx delete mode 100644 app/components/transactions/transaction-table.tsx diff --git a/app/(auth)/forgot-password/page.tsx b/app/(auth)/forgot-password/page.tsx index e05d935..28a0cc6 100644 --- a/app/(auth)/forgot-password/page.tsx +++ b/app/(auth)/forgot-password/page.tsx @@ -38,8 +38,8 @@ export default function ForgotPasswordPage() { `/reset-password?email=${encodeURIComponent(email)}`, ); }, 2000); - } catch (err: any) { - setError(err.message || "Something went wrong"); + } catch (err: unknown) { + setError(err instanceof Error ? err.message : 'Something went wrong'); } finally { setIsLoading(false); } diff --git a/app/(auth)/sign-in/page.tsx b/app/(auth)/sign-in/page.tsx index 9bdbb89..891bc26 100644 --- a/app/(auth)/sign-in/page.tsx +++ b/app/(auth)/sign-in/page.tsx @@ -3,13 +3,11 @@ import Image from 'next/image'; import Link from 'next/link'; import { login } from '@/lib/api/auth'; -import { useAuthStore } from '@/hooks/use-auth-store'; import { useRouter } from 'next/navigation'; import { useState } from 'react'; export default function SignInPage() { const router = useRouter(); - const [tempEmail, setTempEmail] = useState(null); const [email, setEmail] = useState(''); const [password, setPassword] = useState(''); const [showPassword, setShowPassword] = useState(false); @@ -28,14 +26,13 @@ export default function SignInPage() { setIsLoading(true); try { - const res = await login({ email, password }); + await login({ email, password }); setIsLoading(false); - setTempEmail(email); // store for OTP step - sessionStorage.setItem('login-email', email); // persist for OTP page + sessionStorage.setItem('login-email', email); router.push('/verify-otp'); - } catch (err: any) { + } catch (err: unknown) { setIsLoading(false); - setError(err.message || 'Login failed'); + setError(err instanceof Error ? err.message : 'Login failed'); } }; diff --git a/app/(auth)/verify-otp/page.tsx b/app/(auth)/verify-otp/page.tsx index 0da6906..b7602dd 100644 --- a/app/(auth)/verify-otp/page.tsx +++ b/app/(auth)/verify-otp/page.tsx @@ -12,15 +12,13 @@ export default function VerifyOtpPage() { const router = useRouter(); const setAuth = useAuthStore((s) => s.setAuth); const [email, setEmail] = useState(null); - useEffect(() => { - setEmail(sessionStorage.getItem('login-email')); - }, []); const [otp, setOtp] = useState(['', '', '', '', '', '']); const [isLoading, setIsLoading] = useState(false); const [error, setError] = useState(''); const inputRefs = useRef<(HTMLInputElement | null)[]>([]); useEffect(() => { + setEmail(sessionStorage.getItem('login-email')); inputRefs.current[0]?.focus(); }, []); @@ -75,14 +73,13 @@ export default function VerifyOtpPage() { setIsLoading(true); setError(''); try { - const res = (await verifyLoginOtp({ email, otp: otpCode })) as any; - // { accessToken, refreshToken, expiresIn, user } + const res = await verifyLoginOtp({ email, otp: otpCode }) as { user: { id: string; name: string; email: string; role: 'USER' | 'ADMIN' }; accessToken: string; refreshToken: string }; setAuth(res.user, res.accessToken, res.refreshToken); setIsLoading(false); router.push('/dashboard'); - } catch (err: any) { + } catch (err: unknown) { setIsLoading(false); - setError(err.message || 'Invalid or expired OTP'); + setError(err instanceof Error ? err.message : 'Invalid or expired OTP'); } }; @@ -96,7 +93,7 @@ export default function VerifyOtpPage() { } try { await resendLoginOtp({ email }); - } catch (err: any) { + } catch { setError('Failed to resend code'); } }; diff --git a/app/(dashboard)/transactions/page.tsx b/app/(dashboard)/transactions/page.tsx index 7e2a02e..49e8770 100644 --- a/app/(dashboard)/transactions/page.tsx +++ b/app/(dashboard)/transactions/page.tsx @@ -1,14 +1,14 @@ "use client"; import { useState, useEffect, useRef } from "react"; -import { Transaction, getTransactions } from "../../lib/api/transactions"; -import { TransactionFilters } from "../../components/transactions/transaction-filters"; -import { TransactionTable } from "../../components/transactions/transaction-table"; -import { TransactionList } from "../../components/transactions/transaction-list"; -import { TransactionPagination } from "../../components/transactions/pagination"; -import { TransactionEmptyState } from "../../components/transactions/empty-state"; -import { TransactionDetails } from "../../components/transactions/transaction-details"; -import { exportTransactionsToCSV, generateCSVFilename } from "../../lib/utils/csv-export"; +import { Transaction, getTransactions } from "@/lib/api/transactions"; +import { TransactionFilters } from "@/components/transactions/transaction-filters"; +import { TransactionTable } from "@/components/transactions/transaction-table"; +import { TransactionList } from "@/components/transactions/transaction-list"; +import { TransactionPagination } from "@/components/transactions/pagination"; +import { TransactionEmptyState } from "@/components/transactions/empty-state"; +import { TransactionDetails } from "@/components/transactions/transaction-details"; +import { exportTransactionsToCSV, generateCSVFilename } from "@/app/lib/utils/csv-export"; const ITEMS_PER_PAGE = 10; @@ -66,42 +66,42 @@ export default function TransactionsPage() { } }; - useEffect(() => { +useEffect(() => { let cancelled = false; - setIsLoading(true); - setError(null); - - const typeParam = - activeFilter === "Withdrawal" - ? "Withdraw" - : activeFilter !== "All" - ? activeFilter - : undefined; - - getTransactions({ - page: currentPage, - limit: ITEMS_PER_PAGE, - search: debouncedSearch || undefined, - type: typeParam, - from: dateFrom || undefined, - to: dateTo || undefined, - }) - .then((result) => { + + const fetchTransactions = async () => { + const typeParam = + activeFilter === 'Withdrawal' + ? 'Withdraw' + : activeFilter !== 'All' + ? activeFilter + : undefined; + + try { + const result = await getTransactions({ + page: currentPage, + limit: ITEMS_PER_PAGE, + search: debouncedSearch || undefined, + type: typeParam, + from: dateFrom || undefined, + to: dateTo || undefined, + }); if (!cancelled) { setTransactions(result.data); setTotalItems(result.total); } - }) - .catch((err) => { + } catch (err) { if (!cancelled) { setError( - err instanceof Error ? err.message : "Failed to load transactions" + err instanceof Error ? err.message : 'Failed to load transactions' ); } - }) - .finally(() => { + } finally { if (!cancelled) setIsLoading(false); - }); + } + }; + + fetchTransactions(); return () => { cancelled = true; diff --git a/app/api/exchange-rates/route.ts b/app/api/exchange-rates/route.ts index a937e74..ff960a2 100644 --- a/app/api/exchange-rates/route.ts +++ b/app/api/exchange-rates/route.ts @@ -30,9 +30,9 @@ export async function GET(req: NextRequest) { const data = await externalRes.json(); return NextResponse.json(data); - } catch (error: any) { +} catch (error: unknown) { return NextResponse.json( - { error: error.message || "Failed to fetch exchange rates" }, + { error: error instanceof Error ? error.message : 'Failed to fetch exchange rates' }, { status: 500 } ); } diff --git a/app/components/transactions/empty-state.tsx b/app/components/transactions/empty-state.tsx deleted file mode 100644 index a26dd9e..0000000 --- a/app/components/transactions/empty-state.tsx +++ /dev/null @@ -1,17 +0,0 @@ -"use client"; - -import { Receipt } from "lucide-react"; - -export function TransactionEmptyState() { - return ( -
-
- -
-

No transactions found

-

- No transactions match your current filters. Try adjusting your search criteria or date range. -

-
- ); -} \ No newline at end of file diff --git a/app/components/transactions/pagination.tsx b/app/components/transactions/pagination.tsx deleted file mode 100644 index e409c65..0000000 --- a/app/components/transactions/pagination.tsx +++ /dev/null @@ -1,93 +0,0 @@ -"use client"; - -import { ChevronLeft, ChevronRight } from "lucide-react"; - -interface TransactionPaginationProps { - currentPage: number; - totalPages: number; - onPageChange: (page: number) => void; - totalItems: number; - itemsPerPage: number; -} - -export function TransactionPagination({ - currentPage, - totalPages, - onPageChange, - totalItems, - itemsPerPage, -}: TransactionPaginationProps) { - const startItem = (currentPage - 1) * itemsPerPage + 1; - const endItem = Math.min(currentPage * itemsPerPage, totalItems); - - const getVisiblePages = () => { - const delta = 2; - const range = []; - const rangeWithDots = []; - - for (let i = Math.max(2, currentPage - delta); i <= Math.min(totalPages - 1, currentPage + delta); i++) { - range.push(i); - } - - if (currentPage - delta > 2) { - rangeWithDots.push(1, '...'); - } else { - rangeWithDots.push(1); - } - - rangeWithDots.push(...range); - - if (currentPage + delta < totalPages - 1) { - rangeWithDots.push('...', totalPages); - } else if (totalPages > 1) { - rangeWithDots.push(totalPages); - } - - return rangeWithDots; - }; - - if (totalPages <= 1) return null; - - return ( -
-
- Showing {startItem} to {endItem} of {totalItems} results -
- -
- - - {getVisiblePages().map((page, index) => ( - - ))} - - -
-
- ); -} \ No newline at end of file diff --git a/app/components/transactions/transaction-details.tsx b/app/components/transactions/transaction-details.tsx deleted file mode 100644 index ee759af..0000000 --- a/app/components/transactions/transaction-details.tsx +++ /dev/null @@ -1,103 +0,0 @@ -"use client"; - -import { Transaction } from "../../lib/api/transactions"; -import { X } from "lucide-react"; - -interface TransactionDetailsProps { - transaction: Transaction | null; - open: boolean; - onClose: () => void; -} - -export function TransactionDetails({ transaction, open, onClose }: TransactionDetailsProps) { - if (!open || !transaction) return null; - - const formatDate = (dateString: string) => { - return new Date(dateString).toLocaleDateString('en-US', { - year: 'numeric', - month: 'long', - day: 'numeric', - hour: '2-digit', - minute: '2-digit', - second: '2-digit' - }); - }; - - const formatAmount = (amount: number, currency: string) => { - return new Intl.NumberFormat('en-US', { - style: 'currency', - currency: currency - }).format(amount); - }; - - const getStatusColor = (status: string) => { - switch (status) { - case 'Completed': - return 'text-green-600 bg-green-50 border-green-200'; - case 'Pending': - return 'text-yellow-600 bg-yellow-50 border-yellow-200'; - case 'Failed': - return 'text-red-600 bg-red-50 border-red-200'; - case 'Cancelled': - return 'text-gray-600 bg-gray-50 border-gray-200'; - default: - return 'text-gray-600 bg-gray-50 border-gray-200'; - } - }; - - return ( -
-
-
-

Transaction Details

- -
- -
-
- Amount - - {formatAmount(transaction.amount, transaction.currency)} - -
- -
- Type - {transaction.type} -
- -
- Status - - {transaction.status} - -
- -
- Reference - {transaction.reference} -
- -
- Date - {formatDate(transaction.date)} -
- - {transaction.description && ( -
- Description -

- {transaction.description} -

-
- )} -
-
-
- ); -} \ No newline at end of file diff --git a/app/components/transactions/transaction-filters.tsx b/app/components/transactions/transaction-filters.tsx deleted file mode 100644 index 981f171..0000000 --- a/app/components/transactions/transaction-filters.tsx +++ /dev/null @@ -1,118 +0,0 @@ -"use client"; - -import { useState } from "react"; -import { Search, X, Download } from "lucide-react"; - -interface TransactionFiltersProps { - searchQuery: string; - onSearchChange: (query: string) => void; - activeFilter: string; - onFilterChange: (filter: string) => void; - totalCount: number; - dateFrom?: string; - dateTo?: string; - onDateFromChange: (date: string) => void; - onDateToChange: (date: string) => void; - onClearDateRange: () => void; - onExportCSV: () => void; -} - -const filterOptions = ["All", "Deposit", "Withdrawal", "Transfer", "Exchange"]; - -export function TransactionFilters({ - searchQuery, - onSearchChange, - activeFilter, - onFilterChange, - totalCount, - dateFrom, - dateTo, - onDateFromChange, - onDateToChange, - onClearDateRange, - onExportCSV, -}: TransactionFiltersProps) { - return ( -
- {/* Header with title and export button */} -
-
-

Transactions

-

- {totalCount} transaction{totalCount !== 1 ? 's' : ''} found -

-
- -
- - {/* Filters */} -
- {/* Search */} -
- - onSearchChange(e.target.value)} - className="w-full pl-10 pr-4 py-2 border border-border rounded-lg bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent" - /> -
- - {/* Date Range */} -
-
- - onDateFromChange(e.target.value)} - className="px-3 py-2 border border-border rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent text-sm" - /> -
-
- - onDateToChange(e.target.value)} - className="px-3 py-2 border border-border rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent text-sm" - /> -
- {(dateFrom || dateTo) && ( - - )} -
-
- - {/* Type Filters */} -
- {filterOptions.map((filter) => ( - - ))} -
-
- ); -} \ No newline at end of file diff --git a/app/components/transactions/transaction-list.tsx b/app/components/transactions/transaction-list.tsx deleted file mode 100644 index a888686..0000000 --- a/app/components/transactions/transaction-list.tsx +++ /dev/null @@ -1,94 +0,0 @@ -"use client"; - -import { Transaction } from "../../lib/api/transactions"; - -interface TransactionListProps { - transactions: Transaction[]; - onSelectTransaction: (transaction: Transaction) => void; -} - -export function TransactionList({ transactions, onSelectTransaction }: TransactionListProps) { - const formatDate = (dateString: string) => { - return new Date(dateString).toLocaleDateString('en-US', { - year: 'numeric', - month: 'short', - day: 'numeric', - hour: '2-digit', - minute: '2-digit' - }); - }; - - const formatAmount = (amount: number, currency: string) => { - return new Intl.NumberFormat('en-US', { - style: 'currency', - currency: currency - }).format(amount); - }; - - const getStatusColor = (status: string) => { - switch (status) { - case 'Completed': - return 'text-green-600 bg-green-50 border-green-200'; - case 'Pending': - return 'text-yellow-600 bg-yellow-50 border-yellow-200'; - case 'Failed': - return 'text-red-600 bg-red-50 border-red-200'; - case 'Cancelled': - return 'text-gray-600 bg-gray-50 border-gray-200'; - default: - return 'text-gray-600 bg-gray-50 border-gray-200'; - } - }; - - const getTypeColor = (type: string) => { - switch (type) { - case 'Deposit': - return 'text-green-700'; - case 'Withdraw': - return 'text-red-700'; - case 'Transfer': - return 'text-blue-700'; - case 'Exchange': - return 'text-purple-700'; - default: - return 'text-gray-700'; - } - }; - - return ( -
- {transactions.map((transaction) => ( -
onSelectTransaction(transaction)} - className="bg-card border border-border rounded-lg p-4 cursor-pointer hover:bg-muted/50 transition-colors" - > -
- - {transaction.type} - - - {transaction.status} - -
- -
- - {formatAmount(transaction.amount, transaction.currency)} - - - {transaction.reference} - -
- -
- {formatDate(transaction.date)} - {transaction.description && ( - {transaction.description} - )} -
-
- ))} -
- ); -} \ No newline at end of file diff --git a/app/components/transactions/transaction-table.tsx b/app/components/transactions/transaction-table.tsx deleted file mode 100644 index 5dca1d2..0000000 --- a/app/components/transactions/transaction-table.tsx +++ /dev/null @@ -1,104 +0,0 @@ -"use client"; - -import { Transaction } from "../../lib/api/transactions"; - -interface TransactionTableProps { - transactions: Transaction[]; - onSelectTransaction: (transaction: Transaction) => void; -} - -export function TransactionTable({ transactions, onSelectTransaction }: TransactionTableProps) { - const formatDate = (dateString: string) => { - return new Date(dateString).toLocaleDateString('en-US', { - year: 'numeric', - month: 'short', - day: 'numeric', - hour: '2-digit', - minute: '2-digit' - }); - }; - - const formatAmount = (amount: number, currency: string) => { - return new Intl.NumberFormat('en-US', { - style: 'currency', - currency: currency - }).format(amount); - }; - - const getStatusColor = (status: string) => { - switch (status) { - case 'Completed': - return 'text-green-600 bg-green-50 border-green-200'; - case 'Pending': - return 'text-yellow-600 bg-yellow-50 border-yellow-200'; - case 'Failed': - return 'text-red-600 bg-red-50 border-red-200'; - case 'Cancelled': - return 'text-gray-600 bg-gray-50 border-gray-200'; - default: - return 'text-gray-600 bg-gray-50 border-gray-200'; - } - }; - - const getTypeColor = (type: string) => { - switch (type) { - case 'Deposit': - return 'text-green-700'; - case 'Withdraw': - return 'text-red-700'; - case 'Transfer': - return 'text-blue-700'; - case 'Exchange': - return 'text-purple-700'; - default: - return 'text-gray-700'; - } - }; - - return ( -
-
- - - - - - - - - - - - {transactions.map((transaction) => ( - onSelectTransaction(transaction)} - className="border-b border-border hover:bg-muted/50 cursor-pointer transition-colors" - > - - - - - - - ))} - -
DateTypeAmountStatusReference
- {formatDate(transaction.date)} - - - {transaction.type} - - - {formatAmount(transaction.amount, transaction.currency)} - - - {transaction.status} - - - {transaction.reference} -
-
-
- ); -} \ No newline at end of file diff --git a/app/lib/utils/csv-export.ts b/app/lib/utils/csv-export.ts index 86ac9f7..78f075b 100644 --- a/app/lib/utils/csv-export.ts +++ b/app/lib/utils/csv-export.ts @@ -1,4 +1,4 @@ -import { Transaction } from "../api/transactions"; +import { Transaction } from "@/lib/api/transactions"; export function exportTransactionsToCSV(transactions: Transaction[], filename?: string) { // Define CSV headers diff --git a/components/admin/AdminGuard.tsx b/components/admin/AdminGuard.tsx index a60285c..7b7441f 100644 --- a/components/admin/AdminGuard.tsx +++ b/components/admin/AdminGuard.tsx @@ -1,43 +1,36 @@ -"use client"; +'use client'; -import { useEffect, useState } from "react"; -import { useRouter } from "next/navigation"; -import { useAuthStore } from "@/hooks/use-auth-store"; +import { useEffect } from 'react'; +import { useRouter } from 'next/navigation'; +import { useAuthStore } from '@/hooks/use-auth-store'; export function AdminGuard({ children }: { children: React.ReactNode }) { const router = useRouter(); - const [isMounted, setIsMounted] = useState(false); const { user, isAuthenticated, accessToken } = useAuthStore(); useEffect(() => { - setIsMounted(true); - }, []); - - useEffect(() => { - if (!isMounted) return; - - if (!accessToken || !isAuthenticated) { - router.push("/sign-in"); - } else if (user?.role !== "ADMIN") { - router.push("/dashboard"); + if (!isAuthenticated) { + router.push('/sign-in'); + } else if (user?.role !== 'ADMIN') { + router.push('/dashboard'); } - }, [isMounted, accessToken, isAuthenticated, user, router]); + }, [isAuthenticated, user, router]); - if (!isMounted) { + if (!accessToken || !isAuthenticated) { return ( -
-
+
+
); } - if (accessToken && isAuthenticated && user?.role === "ADMIN") { + if (user?.role === 'ADMIN') { return <>{children}; } return ( -
-
+
+
); } diff --git a/components/admin/RevenueChart.tsx b/components/admin/RevenueChart.tsx index 6069ddb..5c25f42 100644 --- a/components/admin/RevenueChart.tsx +++ b/components/admin/RevenueChart.tsx @@ -58,11 +58,11 @@ export function RevenueChart() { tick={{ fontSize: 10, fill: "#9CA3AF" }} width={44} /> - [ + [ `$${(Number(value) || 0).toLocaleString()}`, - "Revenue", + 'Revenue', ]} contentStyle={{ borderRadius: "8px", diff --git a/components/dashboard/InstantDepositModal.tsx b/components/dashboard/InstantDepositModal.tsx index 69aea3a..4888e55 100644 --- a/components/dashboard/InstantDepositModal.tsx +++ b/components/dashboard/InstantDepositModal.tsx @@ -1,30 +1,9 @@ -"use client"; +'use client'; -import React, { useState, useRef } from "react"; -import { - ArrowLeft, - ArrowUp, - Wallet, - ArrowLeftRight, - RefreshCw, - ExternalLink, - X, - Copy, - Share2, - ChevronRight, -} from "lucide-react"; -import { QRCodeSVG } from "qrcode.react"; -import { useFocusTrap } from "@/hooks/use-focus-trap"; -import { DepositNotification } from "./notification"; - -interface DepositMethod { - id: string; - title: string; - description: string; - fee: string; - icon: React.ReactNode; - hasExternalLink?: boolean; -} +import React, { useState, useRef } from 'react'; +import { X, Copy, ChevronRight } from 'lucide-react'; +import { QRCodeSVG } from 'qrcode.react'; +import { useFocusTrap } from '@/hooks/use-focus-trap'; type InstantDepositModalType = { onClose: () => void; @@ -34,17 +13,12 @@ type InstantDepositModalType = { const InstantModalDeposit: React.FC = ({ onClose, }) => { - const [isDepositModalOpen, setIsDepositModalOpen] = useState(false); - const [isQRModalOpen, setIsQRModalOpen] = useState(false); const [copied, setCopied] = useState(false); - const [showNotification, setShowNotification] = useState(false); const modalRef = useRef(null); - // Use focus trap for modal useFocusTrap(true, onClose, modalRef); - // Sample wallet address - const walletAddress = "0x5A08FcdBEA516Cf086572157791dB12CA3beF1B32"; + const walletAddress = '0x5A08FcdBEA516Cf086572157791dB12CA3beF1B32'; const handleCopyAddress = () => { navigator.clipboard.writeText(walletAddress); @@ -52,109 +26,87 @@ const InstantModalDeposit: React.FC = ({ setTimeout(() => setCopied(false), 2000); }; - const handleShareAddress = () => { - if (navigator.share) { - navigator.share({ - title: "NEXA FX - Deposit", - text: `Wallet Address: ${walletAddress}`, - }); - } - }; - return ( <> - {" "} -
+
- {showNotification && ( - alert("View Transaction")} - onClose={() => setShowNotification(false)} - /> - )}

NEXA FX - Deposit

- {/* QR Code */} -
+
{walletAddress ? ( -
- {/* Mobile: 152px, Desktop: 232px */} +
) : ( -
+
No wallet address available
)}
- {/* Wallet Address */} -
-