diff --git a/.gitignore b/.gitignore index f936439..bedc90a 100644 --- a/.gitignore +++ b/.gitignore @@ -1,50 +1,9 @@ -# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. - -# dependencies -/node_modules -/blockchain/node_modules -/.pnp -.pnp.js - -# vscode -.vscode - -# hardhat -artifacts -cache -deployments -cache/ -coverage* -blockchain/typechain-types/@chainlink -blockchain/typechain-types/@openzeppelin -blockchain/typechain-types/factories/@chainlink -blockchain/typechain-types/factories/@openzeppelin - -# testing -/coverage - -# next.js -/.next/ -/out/ - -# production -/build - -# misc -.DS_Store -*.pem - -# debug -npm-debug.log* -yarn-debug.log* -yarn-error.log* - -# local env files +node_modules/ +.next/ +dist/ .env -.env.local -.env.development.local -.env.test.local -.env.production.local - -# vercel -.vercel +*.log +.DS_Store +coverage/ +.vitest +.turbo \ No newline at end of file diff --git a/components/LotteryHistory.tsx b/components/LotteryHistory.tsx new file mode 100644 index 0000000..4cdf168 --- /dev/null +++ b/components/LotteryHistory.tsx @@ -0,0 +1,50 @@ +import React from 'react'; +import styles from '../styles/LotteryHistory.module.css'; + +export interface LotteryRound { + id: number; + date: string; + potSize: string; + winner: string; + participants: number; +} + +interface LotteryHistoryProps { + rounds: LotteryRound[]; +} + +const LotteryHistory: React.FC = ({ rounds }) => { + if (!rounds || rounds.length === 0) { + return
No lottery history available
; + } + + return ( +
+

Lottery History

+ + + + + + + + + + + + {rounds.map((round) => ( + + + + + + + + ))} + +
RoundDatePot SizeWinnerParticipants
{round.id}{round.date}{round.potSize} ETH{round.winner.slice(0, 6)}...{round.winner.slice(-4)}{round.participants}
+
+ ); +}; + +export default LotteryHistory; \ No newline at end of file diff --git a/components/__tests__/LotteryHistory.test.tsx b/components/__tests__/LotteryHistory.test.tsx new file mode 100644 index 0000000..c042dee --- /dev/null +++ b/components/__tests__/LotteryHistory.test.tsx @@ -0,0 +1,29 @@ +import { describe, it, expect } from 'vitest'; +import { render, screen } from '@testing-library/react'; +import LotteryHistory from '../LotteryHistory'; + +describe('LotteryHistory Component', () => { + const mockRounds = [ + { + id: 1, + date: '2023-09-15', + potSize: '10.5', + winner: '0x1234567890123456789012345678901234567890', + participants: 250 + } + ]; + + it('renders lottery history table when rounds are provided', () => { + render(); + + expect(screen.getByText('Lottery History')).toBeInTheDocument(); + expect(screen.getByText('10.5 ETH')).toBeInTheDocument(); + expect(screen.getByText('2023-09-15')).toBeInTheDocument(); + }); + + it('shows empty state when no rounds are provided', () => { + render(); + + expect(screen.getByText('No lottery history available')).toBeInTheDocument(); + }); +}); \ No newline at end of file diff --git a/package.json b/package.json index 061bbf1..d94e3cf 100644 --- a/package.json +++ b/package.json @@ -1,33 +1,11 @@ { - "name": "lottery", - "version": "0.1.0", - "private": true, "scripts": { + "test": "vitest", "dev": "next dev", "build": "next build", - "start": "next start", - "lint": "next lint", - "deploy:sepolia": "cd blockchain && npx hardhat run scripts/deploy.ts --network sepolia && cd .." - }, - "dependencies": { - "@chainlink/contracts": "^0.6.1", - "@formkit/auto-animate": "^1.0.0-beta.6", - "@openzeppelin/contracts": "^4.8.2", - "dotenv": "^16.0.3", - "next": "12.2.5", - "react": "18.2.0", - "react-dom": "18.2.0", - "react-hot-toast": "^2.4.0", - "truncate-eth-address": "^1.0.2", - "web3": "^1.7.5" + "start": "next start" }, "devDependencies": { - "@nomicfoundation/hardhat-toolbox": "^2.0.2", - "@types/node": "^18.15.3", - "@types/react": "^18.0.28", - "eslint": "8.21.0", - "eslint-config-next": "12.2.5", - "hardhat": "^2.13.0", - "typescript": "^5.0.2" + "vitest": "^0.34.6" } -} +} \ No newline at end of file diff --git a/pages/index.tsx b/pages/index.tsx index b28ae51..2951752 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,16 +1,42 @@ -import Header from "../components/Header"; -import LotteryCard from "../components/LotteryCard"; -import Table from "../components/Table"; -import style from "../styles/Home.module.css"; +import React, { useState } from 'react'; +import Head from 'next/head'; +import Header from '../components/Header'; +import LotteryCard from '../components/LotteryCard'; +import LotteryHistory from '../components/LotteryHistory'; +import styles from '../styles/Home.module.css'; + +export default function Home() { + const [lotteryRounds] = useState([ + { + id: 1, + date: '2023-09-15', + potSize: '10.5', + winner: '0x1234567890123456789012345678901234567890', + participants: 250 + }, + { + id: 2, + date: '2023-09-22', + potSize: '15.2', + winner: '0x0987654321098765432109876543210987654321', + participants: 375 + } + ]); -const Home = () => { return ( -
+
+ + Lottery Dapp + + + +
- - + +
+ + +
); -}; - -export default Home; +} \ No newline at end of file diff --git a/styles/LotteryHistory.module.css b/styles/LotteryHistory.module.css new file mode 100644 index 0000000..22253a6 --- /dev/null +++ b/styles/LotteryHistory.module.css @@ -0,0 +1,29 @@ +.historyContainer { + background-color: #f9f9f9; + border-radius: 8px; + padding: 20px; + margin-top: 20px; +} + +.historyTable { + width: 100%; + border-collapse: collapse; +} + +.historyTable th, +.historyTable td { + border: 1px solid #ddd; + padding: 12px; + text-align: left; +} + +.historyTable th { + background-color: #f2f2f2; + font-weight: bold; +} + +.emptyState { + text-align: center; + color: #888; + padding: 20px; +} \ No newline at end of file