diff --git a/web/components/header.tsx b/web/components/header.tsx
index 44509685..a7aeb0f4 100644
--- a/web/components/header.tsx
+++ b/web/components/header.tsx
@@ -5,7 +5,7 @@ import Image from 'next/image'
import { useUser } from '../hooks/use-user'
import { formatMoney } from '../lib/util/format'
import { Row } from './layout/row'
-import { firebaseLogin, User } from '../lib/firebase/users'
+import { firebaseLogin, firebaseLogout, User } from '../lib/firebase/users'
import { MenuButton } from './menu'
const hoverClasses =
@@ -39,6 +39,10 @@ function getNavigationOptions(user: User, options: { mobile: boolean }) {
name: 'Add funds',
href: '/add-funds',
},
+ {
+ name: 'Sign out',
+ onClick: () => firebaseLogout(),
+ },
]
}
diff --git a/web/components/menu.tsx b/web/components/menu.tsx
index e8555874..b07c9719 100644
--- a/web/components/menu.tsx
+++ b/web/components/menu.tsx
@@ -4,7 +4,7 @@ import clsx from 'clsx'
export function MenuButton(props: {
buttonContent: any
- menuItems: { name: string; href: string }[]
+ menuItems: { name: string; href: string; onClick?: () => void }[]
className?: string
}) {
const { buttonContent, menuItems, className } = props
@@ -34,6 +34,7 @@ export function MenuButton(props: {
{({ active }) => (
-