Move share button back down, small spacing tweaks

This commit is contained in:
Ian Philips 2022-08-24 17:07:22 -06:00
parent b6e636cbc0
commit 8d1cebf4db
4 changed files with 23 additions and 57 deletions

View File

@ -1,9 +1,7 @@
import { import {
ClockIcon, ClockIcon,
DatabaseIcon, DatabaseIcon,
LinkIcon,
PencilIcon, PencilIcon,
ShareIcon,
TrendingUpIcon, TrendingUpIcon,
UserGroupIcon, UserGroupIcon,
} from '@heroicons/react/outline' } from '@heroicons/react/outline'
@ -11,11 +9,7 @@ import {
import { Row } from '../layout/row' import { Row } from '../layout/row'
import { formatMoney } from 'common/util/format' import { formatMoney } from 'common/util/format'
import { UserLink } from '../user-page' import { UserLink } from '../user-page'
import { import { Contract, updateContract } from 'web/lib/firebase/contracts'
Contract,
contractPath,
updateContract,
} from 'web/lib/firebase/contracts'
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { DateTimeTooltip } from '../datetime-tooltip' import { DateTimeTooltip } from '../datetime-tooltip'
import { fromNow } from 'web/lib/util/time' import { fromNow } from 'web/lib/util/time'
@ -39,10 +33,6 @@ import { insertContent } from '../editor/utils'
import clsx from 'clsx' import clsx from 'clsx'
import { contractMetrics } from 'common/contract-details' import { contractMetrics } from 'common/contract-details'
import { User } from 'common/user' import { User } from 'common/user'
import { copyToClipboard } from 'web/lib/util/copy'
import toast from 'react-hot-toast'
import { track } from 'web/lib/service/analytics'
import { ENV_CONFIG } from 'common/envs/constants'
export type ShowTime = 'resolve-date' | 'close-date' export type ShowTime = 'resolve-date' | 'close-date'
@ -158,11 +148,7 @@ export function ContractDetails(props: {
groupLinks?.sort((a, b) => a.createdTime - b.createdTime)[0] ?? null groupLinks?.sort((a, b) => a.createdTime - b.createdTime)[0] ?? null
const user = useUser() const user = useUser()
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
const shareUrl = `https://${ENV_CONFIG.domain}${contractPath(contract)}${
user?.username && contract.creatorUsername !== user?.username
? '?referrer=' + user?.username
: ''
}`
const groupInfo = ( const groupInfo = (
<Row> <Row>
<UserGroupIcon className="mx-1 inline h-5 w-5 shrink-0" /> <UserGroupIcon className="mx-1 inline h-5 w-5 shrink-0" />
@ -221,25 +207,7 @@ export function ContractDetails(props: {
/> />
</Col> </Col>
</Modal> </Modal>
{!user && (
<Row className={'items-center justify-end'}>
<Button
size="xs"
color="gray-white"
className={'flex'}
onClick={() => {
copyToClipboard(shareUrl)
toast('Link copied!', {
icon: <LinkIcon className="mr-2 h-6 w-6" aria-hidden="true" />,
})
track('copy share link')
}}
>
<ShareIcon className={clsx('mr-2 h-5 w-5')} aria-hidden="true" />
Share
</Button>
</Row>
)}
{(!!closeTime || !!resolvedDate) && ( {(!!closeTime || !!resolvedDate) && (
<Row className="items-center gap-1"> <Row className="items-center gap-1">
{resolvedDate && contract.resolutionTime ? ( {resolvedDate && contract.resolutionTime ? (

View File

@ -3,7 +3,6 @@ import clsx from 'clsx'
import { tradingAllowed } from 'web/lib/firebase/contracts' import { tradingAllowed } from 'web/lib/firebase/contracts'
import { Col } from '../layout/col' import { Col } from '../layout/col'
import { Spacer } from '../layout/spacer'
import { ContractProbGraph } from './contract-prob-graph' import { ContractProbGraph } from './contract-prob-graph'
import { useUser } from 'web/hooks/use-user' import { useUser } from 'web/hooks/use-user'
import { Row } from '../layout/row' import { Row } from '../layout/row'
@ -76,7 +75,7 @@ export const ContractOverview = (props: {
<Col> <Col>
<BetButton contract={contract as CPMMBinaryContract} /> <BetButton contract={contract as CPMMBinaryContract} />
{!user && ( {!user && (
<div className="text-sm text-gray-500"> <div className="mt-1 text-sm text-gray-500">
(Don't worry, it's play money!) (Don't worry, it's play money!)
</div> </div>
)} )}
@ -112,7 +111,7 @@ export const ContractOverview = (props: {
user={user} user={user}
/> />
</Col> </Col>
<Spacer h={4} /> <div className={'my-1 md:my-2'}></div>
{(isBinary || isPseudoNumeric) && ( {(isBinary || isPseudoNumeric) && (
<ContractProbGraph contract={contract} bets={bets} /> <ContractProbGraph contract={contract} bets={bets} />
)}{' '} )}{' '}

View File

@ -27,7 +27,6 @@ export function ShareRow(props: {
return ( return (
<Row className="mt-2"> <Row className="mt-2">
{user && (
<Button <Button
size="lg" size="lg"
color="gray-white" color="gray-white"
@ -45,7 +44,6 @@ export function ShareRow(props: {
user={user} user={user}
/> />
</Button> </Button>
)}
{showChallenge && ( {showChallenge && (
<Button <Button

View File

@ -109,6 +109,7 @@ export function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {
contract={contract} contract={contract}
bets={bets} bets={bets}
isCreator={false} isCreator={false}
user={null}
disabled disabled
/> />