54c227cf6c
* Line clamp question in prob change table * Tweaks * Expand option for daily movers * Snap scrolling for carousel * Add arrows to section headers * Remove carousel from experimental/home * React querify fetching your groups * Edit home is its own page * Add daily profit and balance * Merge branch 'main' into new-home * Make experimental search by your followed groups/creators * Just submit, allow xs on pills * Weigh in * Use next/future/image component to optimize avatar images * Inga/challenge icon (#857) * changed challenge icon to custom icon * fixed tip button alignment * weighing in and trading "weigh in" for "trade" Co-authored-by: Ian Philips <iansphilips@gmail.com> Co-authored-by: Austin Chen <akrolsmir@gmail.com> Co-authored-by: ingawei <46611122+ingawei@users.noreply.github.com> Co-authored-by: mantikoros <sgrugett@gmail.com>
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { Contract } from 'common/contract'
|
|
import { range } from 'lodash'
|
|
import { Carousel } from 'web/components/carousel'
|
|
import { ContractCard } from 'web/components/contract/contract-card'
|
|
import { ShowTime } from 'web/components/contract/contract-details'
|
|
import { Col } from 'web/components/layout/col'
|
|
|
|
export function DoubleCarousel(props: {
|
|
contracts: Contract[]
|
|
showTime?: ShowTime
|
|
loadMore?: () => void
|
|
}) {
|
|
const { contracts, showTime, loadMore } = props
|
|
return (
|
|
<Carousel className="-mx-4 mt-2 sm:-mx-10" loadMore={loadMore}>
|
|
<div className="shrink-0 sm:w-6" />
|
|
{contracts.length >= 6
|
|
? range(0, Math.floor(contracts.length / 2)).map((col) => {
|
|
const i = col * 2
|
|
return (
|
|
<Col className="snap-start scroll-m-4" key={contracts[i].id}>
|
|
<ContractCard
|
|
contract={contracts[i]}
|
|
className="mb-2 w-96 shrink-0"
|
|
questionClass="line-clamp-3"
|
|
trackingPostfix=" tournament"
|
|
showTime={showTime}
|
|
/>
|
|
<ContractCard
|
|
contract={contracts[i + 1]}
|
|
className="mb-2 w-96 shrink-0"
|
|
questionClass="line-clamp-3"
|
|
trackingPostfix=" tournament"
|
|
showTime={showTime}
|
|
/>
|
|
</Col>
|
|
)
|
|
})
|
|
: contracts.map((c) => (
|
|
<ContractCard
|
|
key={c.id}
|
|
contract={c}
|
|
className="mb-2 max-h-[220px] w-96 shrink-0"
|
|
questionClass="line-clamp-3"
|
|
trackingPostfix=" tournament"
|
|
showTime={showTime}
|
|
/>
|
|
))}
|
|
</Carousel>
|
|
)
|
|
}
|