Merge branch 'main' into show-comments-position

functions/src/create-contract.ts

@@ -1,7 +1,6 @@
 import * as functions from 'firebase-functions'
 import * as admin from 'firebase-admin'
 import * as _ from 'lodash'
-
 import { chargeUser, getUser } from './utils'
 import {
   Binary,
@@ -73,11 +72,19 @@ export const createContract = functions
         return { status: 'error', message: 'Invalid initial probability' }
 
       const ante = FIXED_ANTE // data.ante
+      // uses utc time on server:
+      const today = new Date().setHours(0, 0, 0, 0)
+      const userContractsCreatedTodaySnapshot = await firestore
+        .collection(`contracts`)
+        .where('creatorId', '==', userId)
+        .where('createdTime', '>=', today)
+        .get()
+      const isFree = userContractsCreatedTodaySnapshot.size === 0
 
       if (
         ante === undefined ||
         ante < MINIMUM_ANTE ||
-        ante > creator.balance ||
+        (ante > creator.balance && !isFree) ||
         isNaN(ante) ||
         !isFinite(ante)
       )
@@ -109,7 +116,7 @@ export const createContract = functions
         tags ?? []
       )
 
-      if (ante) await chargeUser(creator.id, ante)
+      if (!isFree && ante) await chargeUser(creator.id, ante)
 
       await contractRef.create(contract)
 

web/components/contract/contracts-list.tsx

@@ -25,15 +25,16 @@ export function ContractsGrid(props: {
   showCloseTime?: boolean
 }) {
   const { showCloseTime } = props
+  const PAGE_SIZE = 100
+  const [page, setPage] = useState(1)
 
   const [resolvedContracts, activeContracts] = _.partition(
     props.contracts,
     (c) => c.isResolved
   )
-  const contracts = [...activeContracts, ...resolvedContracts].slice(
-    0,
-    MAX_CONTRACTS_DISPLAYED
-  )
+  const allContracts = [...activeContracts, ...resolvedContracts]
+  const showMore = allContracts.length > PAGE_SIZE * page
+  const contracts = allContracts.slice(0, PAGE_SIZE * page)
 
   if (contracts.length === 0) {
     return (
@@ -47,16 +48,27 @@ export function ContractsGrid(props: {
   }
 
   return (
-    <ul className="grid w-full grid-cols-1 gap-6 md:grid-cols-2">
-      {contracts.map((contract) => (
-        <ContractCard
-          contract={contract}
-          key={contract.id}
-          // showHotVolume={showHotVolume}
-          showCloseTime={showCloseTime}
-        />
-      ))}
-    </ul>
+    <>
+      <ul className="grid w-full grid-cols-1 gap-6 md:grid-cols-2">
+        {contracts.map((contract) => (
+          <ContractCard
+            contract={contract}
+            key={contract.id}
+            // showHotVolume={showHotVolume}
+            showCloseTime={showCloseTime}
+          />
+        ))}
+      </ul>
+      {/* Show a link that increases the page num when clicked */}
+      {showMore && (
+        <button
+          className="btn btn-link float-right normal-case"
+          onClick={() => setPage(page + 1)}
+        >
+          Show more...
+        </button>
+      )}
+    </>
   )
 }
 

web/components/feed-create.tsx

@@ -141,7 +141,7 @@ export default function FeedCreate(props: {
       {/* Show a fake "Create Market" button, which gets replaced with the NewContract one*/}
       {!isExpanded && (
         <div className="flex justify-end sm:-mt-4">
-          <button className="btn btn-sm" disabled>
+          <button className="btn btn-sm capitalize" disabled>
             Create Market
           </button>
         </div>

web/components/nav/sidebar.tsx

@@ -19,6 +19,7 @@ import { firebaseLogin, firebaseLogout } from '../../lib/firebase/users'
 import { ManifoldLogo } from './manifold-logo'
 import { MenuButton } from './menu'
 import { getNavigationOptions, ProfileSummary } from './profile-menu'
+import { useHasCreatedContractToday } from '../../hooks/use-has-created-contract-today'
 
 const navigation = [
   { name: 'Home', href: '/home', icon: HomeIcon },
@@ -96,6 +97,7 @@ export default function Sidebar() {
   const user = useUser()
   let folds = useFollowedFolds(user) || []
   folds = _.sortBy(folds, 'followCount').reverse()
+  const deservesDailyFreeMarket = !useHasCreatedContractToday(user)
 
   const navigationOptions = user === null ? signedOutNavigation : navigation
   const mobileNavigationOptions =
@@ -159,10 +161,22 @@ export default function Sidebar() {
         />
       </div>
 
+      {deservesDailyFreeMarket ? (
+        <div className=" text-primary mt-4 text-center">
+          Use your daily free market! 🎉
+        </div>
+      ) : (
+        <div />
+      )}
+
       {user && (
-        <Link href={'/create'}>
-          <button className="btn btn-primary btn-md mt-4">Create Market</button>
-        </Link>
+        <div className={'aligncenter flex justify-center'}>
+          <Link href={'/create'}>
+            <button className="btn btn-primary btn-md mt-4 capitalize">
+              Create Market
+            </button>
+          </Link>
+        </div>
       )}
     </nav>
   )

web/hooks/use-has-created-contract-today.ts

@@ -0,0 +1,27 @@
+import { listContracts } from '../lib/firebase/contracts'
+import { useEffect, useState } from 'react'
+import { User } from '../../common/user'
+
+export const useHasCreatedContractToday = (user: User | null | undefined) => {
+  const [hasCreatedContractToday, setHasCreatedContractToday] = useState(true)
+
+  useEffect(() => {
+    // Uses utc time like the server.
+    const utcTimeString = new Date().toISOString()
+    const todayAtMidnight = new Date(utcTimeString).setUTCHours(0, 0, 0, 0)
+
+    async function listUserContractsForToday() {
+      if (!user) return
+
+      const contracts = await listContracts(user.id)
+      const todayContracts = contracts.filter(
+        (contract) => contract.createdTime > todayAtMidnight
+      )
+      setHasCreatedContractToday(todayContracts.length > 0)
+    }
+
+    listUserContractsForToday()
+  }, [user])
+
+  return hasCreatedContractToday
+}

web/lib/firebase/contracts.ts

@@ -115,6 +115,18 @@ export async function listContracts(creatorId: string): Promise<Contract[]> {
   return snapshot.docs.map((doc) => doc.data() as Contract)
 }
 
+export async function listTaggedContractsCaseInsensitive(
+  tag: string
+): Promise<Contract[]> {
+  const q = query(
+    contractCollection,
+    where('lowercaseTags', 'array-contains', tag.toLowerCase()),
+    orderBy('createdTime', 'desc')
+  )
+  const snapshot = await getDocs(q)
+  return snapshot.docs.map((doc) => doc.data() as Contract)
+}
+
 export async function listAllContracts(): Promise<Contract[]> {
   const q = query(contractCollection, orderBy('createdTime', 'desc'))
   const snapshot = await getDocs(q)

web/package.json

@@ -30,6 +30,7 @@
     "lodash": "4.17.21",
     "next": "12.1.2",
     "react": "17.0.2",
+    "react-confetti": "^6.0.1",
     "react-dom": "17.0.2",
     "react-expanding-textarea": "2.3.5"
   },

web/pages/[username]/[contractSlug].tsx

@@ -33,6 +33,8 @@ import { ContractTabs } from '../../components/contract/contract-tabs'
 import { FirstArgument } from '../../../common/util/types'
 import { DPM, FreeResponse, FullContract } from '../../../common/contract'
 import { contractTextDetails } from '../../components/contract/contract-details'
+import { useWindowSize } from '../../hooks/use-window-size'
+import Confetti from 'react-confetti'
 
 export const getStaticProps = fromPropz(getStaticPropz)
 export async function getStaticPropz(props: {
@@ -86,9 +88,21 @@ export function ContractPageContent(props: FirstArgument<typeof ContractPage>) {
   const { backToHome } = props
 
   const user = useUser()
+  const { width, height } = useWindowSize()
 
   const contract = useContractWithPreload(props.contract)
   const { bets, comments } = props
+  const [showConfetti, setShowConfetti] = useState(false)
+
+  useEffect(() => {
+    const shouldSeeConfetti = !!(
+      user &&
+      contract &&
+      contract.creatorId === user.id &&
+      Date.now() - contract.createdTime < 10 * 1000
+    )
+    setShowConfetti(shouldSeeConfetti)
+  }, [contract, user])
 
   // Sort for now to see if bug is fixed.
   comments.sort((c1, c2) => c1.createdTime - c2.createdTime)
@@ -119,6 +133,15 @@ export function ContractPageContent(props: FirstArgument<typeof ContractPage>) {
 
   return (
     <Page rightSidebar={rightSidebar}>
+      {showConfetti && (
+        <Confetti
+          width={width ? width : 500}
+          height={height ? height : 500}
+          recycle={false}
+          numberOfPieces={300}
+        />
+      )}
+
       {ogCardProps && (
         <SEO
           title={question}

web/pages/create.tsx

@@ -18,6 +18,7 @@ import { TagsList } from '../components/tags-list'
 import { Row } from '../components/layout/row'
 import { MAX_DESCRIPTION_LENGTH, outcomeType } from '../../common/contract'
 import { formatMoney } from '../../common/util/format'
+import { useHasCreatedContractToday } from '../hooks/use-has-created-contract-today'
 
 export default function Create() {
   const [question, setQuestion] = useState('')
@@ -70,6 +71,9 @@ export function NewContract(props: { question: string; tag?: string }) {
   const tags = parseWordsAsTags(tagText)
 
   const [ante, setAnte] = useState(FIXED_ANTE)
+
+  const deservesDailyFreeMarket = !useHasCreatedContractToday(creator)
+
   // useEffect(() => {
   //   if (ante === null && creator) {
   //     const initialAnte = creator.balance < 100 ? MINIMUM_ANTE : 100
@@ -95,7 +99,7 @@ export function NewContract(props: { question: string; tag?: string }) {
     ante !== undefined &&
     ante !== null &&
     ante >= MINIMUM_ANTE &&
-    ante <= balance &&
+    (ante <= balance || deservesDailyFreeMarket) &&
     // closeTime must be in the future
     closeTime &&
     closeTime > Date.now()
@@ -246,10 +250,14 @@ export function NewContract(props: { question: string; tag?: string }) {
             text={`Cost to create your market. This amount is used to subsidize trading.`}
           />
         </label>
-
-        <div className="label-text text-neutral pl-1">{formatMoney(ante)}</div>
-
-        {ante > balance && (
+        {deservesDailyFreeMarket ? (
+          <div className="label-text text-primary pl-1">FREE</div>
+        ) : (
+          <div className="label-text text-neutral pl-1">
+            {formatMoney(ante)}
+          </div>
+        )}
+        {!deservesDailyFreeMarket && ante > balance && (
           <div className="mb-2 mt-2 mr-auto self-center whitespace-nowrap text-xs font-medium tracking-wide">
             <span className="mr-2 text-red-500">Insufficient balance</span>
             <button
@@ -278,7 +286,7 @@ export function NewContract(props: { question: string; tag?: string }) {
         <button
           type="submit"
           className={clsx(
-            'btn btn-primary',
+            'btn btn-primary capitalize',
             isSubmitting && 'loading disabled'
           )}
           disabled={isSubmitting || !isValid}

web/pages/tag/[tag].tsx

@@ -1,39 +1,33 @@
+import { useEffect, useState } from 'react'
 import { useRouter } from 'next/router'
 import { SearchableGrid } from '../../components/contract/contracts-list'
 import { Page } from '../../components/page'
 import { Title } from '../../components/title'
 import { useContracts } from '../../hooks/use-contracts'
-import { Contract, listAllContracts } from '../../lib/firebase/contracts'
-
-export async function getStaticProps() {
-  const contracts = await listAllContracts().catch((_) => [])
-  return {
-    props: {
-      contracts,
-    },
-
-    revalidate: 60, // regenerate after a minute
-  }
-}
-
-export async function getStaticPaths() {
-  return { paths: [], fallback: 'blocking' }
-}
+import {
+  Contract,
+  listTaggedContractsCaseInsensitive,
+} from '../../lib/firebase/contracts'
 
 export default function TagPage(props: { contracts: Contract[] }) {
   const router = useRouter()
   const { tag } = router.query as { tag: string }
 
-  const contracts = useContracts()
+  // mqp: i wrote this in a panic to make the page literally work at all so if you
+  // want to e.g. listen for new contracts you may want to fix it up
+  const [contracts, setContracts] = useState<Contract[] | 'loading'>('loading')
+  useEffect(() => {
+    if (tag != null) {
+      listTaggedContractsCaseInsensitive(tag).then(setContracts)
+    }
+  }, [tag])
 
-  const taggedContracts = (contracts ?? props.contracts).filter((contract) =>
-    contract.lowercaseTags.includes(tag.toLowerCase())
-  )
+  if (contracts === 'loading') return <></>
 
   return (
     <Page>
       <Title text={`#${tag}`} />
-      <SearchableGrid contracts={taggedContracts} />
+      <SearchableGrid contracts={contracts} />
     </Page>
   )
 }

yarn.lock

@@ -4441,6 +4441,13 @@ raw-body@2.4.2, raw-body@^2.2.0:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
+react-confetti@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/react-confetti/-/react-confetti-6.0.1.tgz#d4f57b5a021dd908a6243b8f63b6009b00818d10"
+  integrity sha512-ZpOTBrqSNhWE4rRXCZ6E6U+wGd7iYHF5MGrqwikoiBpgBq9Akdu0DcLW+FdFnLjyZYC+VfAiV2KeFgYRMyMrkA==
+  dependencies:
+    tween-functions "^1.2.0"
+
 react-dom@17.0.2:
   version "17.0.2"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
@@ -5154,6 +5161,11 @@ tsutils@^3.21.0:
   dependencies:
     tslib "^1.8.1"
 
+tween-functions@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/tween-functions/-/tween-functions-1.2.0.tgz#1ae3a50e7c60bb3def774eac707acbca73bbc3ff"
+  integrity sha1-GuOlDnxguz3vd06scHrLynO7w/8=
+
 type-check@^0.4.0, type-check@~0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1"