116 lines
3.7 KiB
TypeScript
116 lines
3.7 KiB
TypeScript
import { useRouter } from 'next/router'
|
|
import { useEffect, useState } from 'react'
|
|
import { firebaseLogout, listenForLogin, User } from '../lib/firebase/users'
|
|
import { Header } from '../components/header'
|
|
|
|
export default function Account() {
|
|
const [user, setUser] = useState<User | null>(null)
|
|
useEffect(() => listenForLogin(setUser), [])
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<div className="relative overflow-hidden h-screen bg-cover bg-gray-900">
|
|
<Header />
|
|
<div className="flex items-center w-full h-max px-4 py-10 bg-cover card">
|
|
<div className="card glass lg:card-side text-neutral-content bg-gray-800 m-10 transition-all">
|
|
<figure className="p-6">
|
|
<img src={user?.avatarUrl} className="rounded-lg shadow-lg" />
|
|
</figure>
|
|
<div className="max-w-md card-body">
|
|
<h2 className="card-title">{user?.name}</h2>
|
|
<p>{user?.email}</p>
|
|
<p>${user?.balanceUsd} USD</p>
|
|
<div className="card-actions">
|
|
<button
|
|
className="btn glass rounded-full"
|
|
onClick={() => {
|
|
firebaseLogout()
|
|
router.push('/')
|
|
}}
|
|
>
|
|
Sign Out
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Lorem ipsum table. TODO: fill in user's bets and markets */}
|
|
<h1 className="text-4xl text-neutral-content m-4">
|
|
{user?.username}'s Bets
|
|
</h1>
|
|
<div className="overflow-x-auto">
|
|
<table className="table table-compact">
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th>Name</th>
|
|
<th>Job</th>
|
|
<th>company</th>
|
|
<th>location</th>
|
|
<th>Last Login</th>
|
|
<th>Favorite Color</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<th>1</th>
|
|
<td>Cy Ganderton</td>
|
|
<td>Quality Control Specialist</td>
|
|
<td>Littel, Schaden and Vandervort</td>
|
|
<td>Canada</td>
|
|
<td>12/16/2020</td>
|
|
<td>Blue</td>
|
|
</tr>
|
|
<tr>
|
|
<th>2</th>
|
|
<td>Hart Hagerty</td>
|
|
<td>Desktop Support Technician</td>
|
|
<td>Zemlak, Daniel and Leannon</td>
|
|
<td>United States</td>
|
|
<td>12/5/2020</td>
|
|
<td>Purple</td>
|
|
</tr>
|
|
<tr>
|
|
<th>3</th>
|
|
<td>Brice Swyre</td>
|
|
<td>Tax Accountant</td>
|
|
<td>Carroll Group</td>
|
|
<td>China</td>
|
|
<td>8/15/2020</td>
|
|
<td>Red</td>
|
|
</tr>
|
|
<tr>
|
|
<th>4</th>
|
|
<td>Marjy Ferencz</td>
|
|
<td>Office Assistant I</td>
|
|
<td>Rowe-Schoen</td>
|
|
<td>Russia</td>
|
|
<td>3/25/2021</td>
|
|
<td>Crimson</td>
|
|
</tr>
|
|
<tr>
|
|
<th>5</th>
|
|
<td>Yancy Tear</td>
|
|
<td>Community Outreach Specialist</td>
|
|
<td>Wyman-Ledner</td>
|
|
<td>Brazil</td>
|
|
<td>5/22/2020</td>
|
|
<td>Indigo</td>
|
|
</tr>
|
|
<tr>
|
|
<th>6</th>
|
|
<td>Irma Vasilik</td>
|
|
<td>Editor</td>
|
|
<td>Wiza, Bins and Emard</td>
|
|
<td>Venezuela</td>
|
|
<td>12/8/2020</td>
|
|
<td>Purple</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|