diff --git a/common/util/parse.ts b/common/util/parse.ts
index 79419ae1..5f78125e 100644
--- a/common/util/parse.ts
+++ b/common/util/parse.ts
@@ -8,3 +8,14 @@ export function parseTags(text: string) {
tagSet.forEach((tag) => uniqueTags.push(tag))
return uniqueTags
}
+
+export function parseWordsAsTags(text: string) {
+ const regex = /(?:^|\s)(?:[a-z0-9_]+)/gi
+ const matches = (text.match(regex) || [])
+ .map((match) => match.trim())
+ .filter((tag) => tag)
+ const tagSet = new Set(matches)
+ const uniqueTags: string[] = []
+ tagSet.forEach((tag) => uniqueTags.push(tag))
+ return uniqueTags
+}
diff --git a/web/pages/fold/[foldSlug]/index.tsx b/web/pages/fold/[foldSlug]/index.tsx
index b38cd2e8..07408fec 100644
--- a/web/pages/fold/[foldSlug]/index.tsx
+++ b/web/pages/fold/[foldSlug]/index.tsx
@@ -6,7 +6,11 @@ import { Title } from '../../../components/title'
import { Bet, listAllBets } from '../../../lib/firebase/bets'
import { listAllComments } from '../../../lib/firebase/comments'
import { Contract } from '../../../lib/firebase/contracts'
-import { getFoldBySlug, getFoldContracts } from '../../../lib/firebase/folds'
+import {
+ foldPath,
+ getFoldBySlug,
+ getFoldContracts,
+} from '../../../lib/firebase/folds'
import { ActivityFeed, findActiveContracts } from '../../activity'
import { TagsList } from '../../../components/tags-list'
import { Row } from '../../../components/layout/row'
@@ -85,29 +89,29 @@ export default function FoldPage(props: {
-
+
{isCurator && (
<>
-
+
Edit
- •
+ •
>
)}
-
+
Leaderboards
- •
- Curated by
-
+ •
+
+ Curated by
+
+
+
`#${tag}`)} />
diff --git a/web/pages/folds.tsx b/web/pages/folds.tsx
index 847d0173..d8414845 100644
--- a/web/pages/folds.tsx
+++ b/web/pages/folds.tsx
@@ -1,9 +1,14 @@
import _ from 'lodash'
+import { useState } from 'react'
import { Fold } from '../../common/fold'
+import { parseWordsAsTags } from '../../common/util/parse'
+import { ConfirmationButton } from '../components/confirmation-button'
import { Col } from '../components/layout/col'
import { Row } from '../components/layout/row'
+import { Spacer } from '../components/layout/spacer'
import { Page } from '../components/page'
import { SiteLink } from '../components/site-link'
+import { TagsList } from '../components/tags-list'
import { Title } from '../components/title'
import { UserLink } from '../components/user-page'
import { foldPath, listAllFolds } from '../lib/firebase/folds'
@@ -31,21 +36,97 @@ export default function Folds(props: { folds: Fold[]; curators: User[] }) {
return (
-
+
+
+
+
+ {}}
+ >
+
-
- {folds.map((fold, index) => (
-
- {fold.name}
- Curated by
-
+
+
A fold is a view of markets that match selected tags.
+
+ You can further include or exclude individual markets.
+
+
+
+
+
+
+
- ))}
+
+
+ {folds.map((fold, index) => (
+
+ {fold.name}
+
+ 12 followers
+ •
+
+ Curated by
+
+
+
+ ))}
+
+
)
}
+
+function CreateFoldForm() {
+ const [name, setName] = useState('')
+ const [tags, setTags] = useState('')
+ const [isSubmitting, setIsSubmitting] = useState(false)
+
+ return (
+
+ )
+}