+
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index c695d39..b6acba4 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,7 +1,24 @@
import type { NextPage } from 'next'
import Head from 'next/head'
+import Image from 'next/image'
+import { useEffect, useState } from 'react'
+import { BillValue } from 'types/types'
+import { getBillImage } from 'utils/images'
+import { formatNumber } from 'utils/number'
const Home: NextPage = () => {
+ const [count, setCount] = useState(12089654)
+
+ useEffect(() => {
+ const interval = setInterval(() => {
+ if (Math.random() > 0.35) {
+ setCount((prev) => prev + 1)
+ }
+ }, 1000)
+
+ return () => clearInterval(interval)
+ }, [])
+
return (
<>
@@ -10,9 +27,70 @@ const Home: NextPage = () => {
-
+
+
+
+
${formatNumber(count)}
+ in crypto-backed cash
+
+
)
}
+const BillsGrid = ({ count }: { count: number }) => {
+ const [randomBills, setRandomBills] = useState
([])
+ const rows = 6
+ const columns = 6
+ const positions = ['2', '4', '6', '8', '10', '4']
+
+ const billValues = [
+ BillValue.Five,
+ BillValue.Ten,
+ BillValue.Twenty,
+ BillValue.Fifty,
+ BillValue.OneHundred,
+ BillValue.FiveHundred
+ ]
+
+ const generateRandomBills = () => {
+ const bills = []
+ for (let i = 0; i < rows; i++) {
+ const col = []
+
+ for (let j = 0; j < columns; j++) {
+ const randomIndex = Math.floor(Math.random() * billValues.length)
+ const bill = billValues[randomIndex]
+ col.push(bill)
+ }
+
+ bills.push(col)
+ }
+
+ setRandomBills(bills)
+ }
+
+ useEffect(() => {
+ generateRandomBills()
+ }, [])
+
+ return (
+
+ {randomBills.map((row, i) => (
+
+
+ {row.map((col, j) => (
+
+ {}
+
+ ))}
+
+
+ ))}
+