show content only with ?demo

This commit is contained in:
mantikoros 2021-12-10 18:19:35 -06:00
parent 3a5b59abc3
commit 52addd2eb3

View File

@ -1,6 +1,9 @@
import { useEffect, useState } from 'react'
import clsx from 'clsx' import clsx from 'clsx'
import { Popover } from '@headlessui/react' import Image from 'next/image'
import Link from 'next/link' import Link from 'next/link'
import { Popover } from '@headlessui/react'
import { useUser } from '../hooks/use-user' import { useUser } from '../hooks/use-user'
import { firebaseLogin } from '../lib/firebase/users' import { firebaseLogin } from '../lib/firebase/users'
@ -9,7 +12,7 @@ const navigation = [
name: 'About', name: 'About',
href: 'https://mantic.notion.site/About-Mantic-Markets-46a1a0fb6e294011a8b6b582e276359f', href: 'https://mantic.notion.site/About-Mantic-Markets-46a1a0fb6e294011a8b6b582e276359f',
}, },
{ name: 'Simulator', href: '/simulator' }, // { name: 'Simulator', href: '/simulator' },
] ]
function SignInLink(props: { darkBackground?: boolean }) { function SignInLink(props: { darkBackground?: boolean }) {
@ -21,9 +24,17 @@ function SignInLink(props: { darkBackground?: boolean }) {
? 'text-white hover:text-gray-300' ? 'text-white hover:text-gray-300'
: 'hover:text-gray-500' : 'hover:text-gray-500'
const [showLogin, setShowLogin] = useState(false)
useEffect(() => {
setShowLogin(location.search.includes('demo'))
}, [])
return ( return (
<> <>
{user ? ( {user
? (
<> <>
<Link href="/contract"> <Link href="/contract">
<a className={clsx('text-base', themeClasses)}> <a className={clsx('text-base', themeClasses)}>
@ -37,14 +48,18 @@ function SignInLink(props: { darkBackground?: boolean }) {
</a> </a>
</Link> </Link>
</> </>
) : ( )
<button
: showLogin
? <button
className={clsx('text-base', themeClasses)} className={clsx('text-base', themeClasses)}
onClick={() => firebaseLogin()} onClick={() => firebaseLogin()}
> >
Sign In Sign In
</button> </button>
)}
: <></>
}
</> </>
) )
} }
@ -96,6 +111,7 @@ export function Header(props: { darkBackground?: boolean }) {
</a> </a>
</Link> </Link>
))} ))}
<SignInLink darkBackground={darkBackground} /> <SignInLink darkBackground={darkBackground} />
</div> </div>
</div> </div>