af6387bbf3
* basic working payments * Select funds amount and prettier funds button / dialog * Add funds page and nav menu option * Format funds amount. Use ghost button for back. * Add mantic dollars description * Improve styles of add funds page * about styling * change faq => about * change default font to Courier * header sign out menu item; remove user card * keep logo font * fix header issue * stripe webhook: handle repeat events * Make add funds button a gradient * add funds referer url * Fix add funds page after merge * Slight VisD tweaks * Update add funds button position. Mantic => Manifold * Remove Add funds menu option for now. * Set up product ids and endpoint for stripe prod * Swap back order in profile menu Co-authored-by: mantikoros <sgrugett@gmail.com> Co-authored-by: Austin Chen <akrolsmir@gmail.com>
81 lines
1.8 KiB
TypeScript
81 lines
1.8 KiB
TypeScript
import Image from 'next/image'
|
|
import { firebaseLogout, User } from '../lib/firebase/users'
|
|
import { formatMoney } from '../lib/util/format'
|
|
import { Row } from './layout/row'
|
|
import { MenuButton } from './menu'
|
|
|
|
export function ProfileMenu(props: { user: User }) {
|
|
const { user } = props
|
|
|
|
return (
|
|
<>
|
|
<MenuButton
|
|
className="hidden md:block"
|
|
menuItems={getNavigationOptions(user, { mobile: false })}
|
|
buttonContent={<ProfileSummary user={user} />}
|
|
/>
|
|
|
|
<MenuButton
|
|
className="md:hidden"
|
|
menuItems={getNavigationOptions(user, { mobile: true })}
|
|
buttonContent={<ProfileSummary user={user} />}
|
|
/>
|
|
</>
|
|
)
|
|
}
|
|
|
|
function getNavigationOptions(user: User, options: { mobile: boolean }) {
|
|
const { mobile } = options
|
|
return [
|
|
{
|
|
name: 'Home',
|
|
href: '/',
|
|
},
|
|
...(mobile
|
|
? [
|
|
{ name: 'About', href: '/about' },
|
|
{
|
|
name: 'Create a market',
|
|
href: '/create',
|
|
},
|
|
]
|
|
: []),
|
|
{
|
|
name: 'Your trades',
|
|
href: '/trades',
|
|
},
|
|
{
|
|
name: 'Your markets',
|
|
href: `/${user.username}`,
|
|
},
|
|
// {
|
|
// name: 'Add funds',
|
|
// href: '/add-funds',
|
|
// },
|
|
{
|
|
name: 'Discord',
|
|
href: 'https://discord.gg/eHQBNBqXuh',
|
|
},
|
|
{
|
|
name: 'Sign out',
|
|
href: '#',
|
|
onClick: () => firebaseLogout(),
|
|
},
|
|
]
|
|
}
|
|
|
|
function ProfileSummary(props: { user: User }) {
|
|
const { user } = props
|
|
return (
|
|
<Row className="avatar items-center">
|
|
<div className="rounded-full w-10 h-10 mr-4">
|
|
<Image src={user.avatarUrl} width={40} height={40} />
|
|
</div>
|
|
<div className="truncate text-left" style={{ maxWidth: 170 }}>
|
|
{user.name}
|
|
<div className="text-gray-700 text-sm">{formatMoney(user.balance)}</div>
|
|
</div>
|
|
</Row>
|
|
)
|
|
}
|