From 33f593ebf7b726d8ab6ac8665e2274d1535427ea Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Wed, 24 Aug 2022 17:07:22 -0600
Subject: [PATCH] Move share button back down, small spacing tweaks

---
 web/components/contract/contract-details.tsx  | 38 ++-----------------
 web/components/contract/contract-overview.tsx |  5 +--
 web/components/contract/share-row.tsx         | 36 +++++++++---------
 web/pages/embed/[username]/[contractSlug].tsx |  1 +
 4 files changed, 23 insertions(+), 57 deletions(-)

diff --git a/web/components/contract/contract-details.tsx b/web/components/contract/contract-details.tsx
index 781cea59..7b6a6277 100644
--- a/web/components/contract/contract-details.tsx
+++ b/web/components/contract/contract-details.tsx
@@ -1,9 +1,7 @@
 import {
   ClockIcon,
   DatabaseIcon,
-  LinkIcon,
   PencilIcon,
-  ShareIcon,
   TrendingUpIcon,
   UserGroupIcon,
 } from '@heroicons/react/outline'
@@ -11,11 +9,7 @@ import {
 import { Row } from '../layout/row'
 import { formatMoney } from 'common/util/format'
 import { UserLink } from '../user-page'
-import {
-  Contract,
-  contractPath,
-  updateContract,
-} from 'web/lib/firebase/contracts'
+import { Contract, updateContract } from 'web/lib/firebase/contracts'
 import dayjs from 'dayjs'
 import { DateTimeTooltip } from '../datetime-tooltip'
 import { fromNow } from 'web/lib/util/time'
@@ -39,10 +33,6 @@ import { insertContent } from '../editor/utils'
 import clsx from 'clsx'
 import { contractMetrics } from 'common/contract-details'
 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'
 
@@ -158,11 +148,7 @@ export function ContractDetails(props: {
     groupLinks?.sort((a, b) => a.createdTime - b.createdTime)[0] ?? null
   const user = useUser()
   const [open, setOpen] = useState(false)
-  const shareUrl = `https://${ENV_CONFIG.domain}${contractPath(contract)}${
-    user?.username && contract.creatorUsername !== user?.username
-      ? '?referrer=' + user?.username
-      : ''
-  }`
+
   const groupInfo = (
     <Row>
       <UserGroupIcon className="mx-1 inline h-5 w-5 shrink-0" />
@@ -221,25 +207,7 @@ export function ContractDetails(props: {
           />
         </Col>
       </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) && (
         <Row className="items-center gap-1">
           {resolvedDate && contract.resolutionTime ? (
diff --git a/web/components/contract/contract-overview.tsx b/web/components/contract/contract-overview.tsx
index 4676f796..cebde4d6 100644
--- a/web/components/contract/contract-overview.tsx
+++ b/web/components/contract/contract-overview.tsx
@@ -3,7 +3,6 @@ import clsx from 'clsx'
 
 import { tradingAllowed } from 'web/lib/firebase/contracts'
 import { Col } from '../layout/col'
-import { Spacer } from '../layout/spacer'
 import { ContractProbGraph } from './contract-prob-graph'
 import { useUser } from 'web/hooks/use-user'
 import { Row } from '../layout/row'
@@ -76,7 +75,7 @@ export const ContractOverview = (props: {
               <Col>
                 <BetButton contract={contract as CPMMBinaryContract} />
                 {!user && (
-                  <div className="text-sm text-gray-500">
+                  <div className="mt-1 text-sm text-gray-500">
                     (Don't worry, it's play money!)
                   </div>
                 )}
@@ -112,7 +111,7 @@ export const ContractOverview = (props: {
           user={user}
         />
       </Col>
-      <Spacer h={4} />
+      <div className={'my-1 md:my-2'}></div>
       {(isBinary || isPseudoNumeric) && (
         <ContractProbGraph contract={contract} bets={bets} />
       )}{' '}
diff --git a/web/components/contract/share-row.tsx b/web/components/contract/share-row.tsx
index b4c3b4f3..0aa0c6b0 100644
--- a/web/components/contract/share-row.tsx
+++ b/web/components/contract/share-row.tsx
@@ -27,25 +27,23 @@ export function ShareRow(props: {
 
   return (
     <Row className="mt-2">
-      {user && (
-        <Button
-          size="lg"
-          color="gray-white"
-          className={'flex'}
-          onClick={() => {
-            setShareOpen(true)
-          }}
-        >
-          <ShareIcon className={clsx('mr-2 h-[24px] w-5')} aria-hidden="true" />
-          Share
-          <ShareModal
-            isOpen={isShareOpen}
-            setOpen={setShareOpen}
-            contract={contract}
-            user={user}
-          />
-        </Button>
-      )}
+      <Button
+        size="lg"
+        color="gray-white"
+        className={'flex'}
+        onClick={() => {
+          setShareOpen(true)
+        }}
+      >
+        <ShareIcon className={clsx('mr-2 h-[24px] w-5')} aria-hidden="true" />
+        Share
+        <ShareModal
+          isOpen={isShareOpen}
+          setOpen={setShareOpen}
+          contract={contract}
+          user={user}
+        />
+      </Button>
 
       {showChallenge && (
         <Button
diff --git a/web/pages/embed/[username]/[contractSlug].tsx b/web/pages/embed/[username]/[contractSlug].tsx
index 83d83871..7ec8daeb 100644
--- a/web/pages/embed/[username]/[contractSlug].tsx
+++ b/web/pages/embed/[username]/[contractSlug].tsx
@@ -109,6 +109,7 @@ export function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {
             contract={contract}
             bets={bets}
             isCreator={false}
+            user={null}
             disabled
           />