manifold/web/pages/analytics.tsx

82 lines
2.1 KiB
TypeScript

import dayjs from 'dayjs'
import _ from 'lodash'
import { DailyCountChart } from '../components/analytics/charts'
import { Col } from '../components/layout/col'
import { Page } from '../components/page'
import { Title } from '../components/title'
import { getDailyBets } from '../lib/firebase/bets'
import { getDailyContracts } from '../lib/firebase/contracts'
export async function getStaticProps() {
const numberOfDays = 80
const today = dayjs(dayjs().format('YYYY-MM-DD'))
const startDate = today.subtract(numberOfDays, 'day')
const dailyBets = await getDailyBets(startDate.valueOf(), numberOfDays)
const dailyBetCounts = dailyBets.map((bets) => bets.length)
const dailyContracts = await getDailyContracts(
startDate.valueOf(),
numberOfDays
)
const dailyContractCounts = dailyContracts.map(
(contracts) => contracts.length
)
return {
props: {
startDate: startDate.valueOf(),
dailyBetCounts,
dailyContractCounts,
},
revalidate: 12 * 60 * 60, // regenerate after half a day
}
}
export default function Analytics(props: {
startDate: number
dailyBetCounts: number[]
dailyContractCounts: number[]
}) {
return (
<Page>
<CustomAnalytics {...props} />
<FirebaseAnalytics />
</Page>
)
}
function CustomAnalytics(props: {
startDate: number
dailyBetCounts: number[]
dailyContractCounts: number[]
}) {
const { startDate, dailyBetCounts, dailyContractCounts } = props
return (
<Col className="mb-8">
<Title text="Bets count" />
<DailyCountChart dailyCounts={dailyBetCounts} startDate={startDate} />
<Title text="Markets count" />
<DailyCountChart
dailyCounts={dailyContractCounts}
startDate={startDate}
/>
</Col>
)
}
function FirebaseAnalytics() {
// Edit dashboard at https://datastudio.google.com/u/0/reporting/faeaf3a4-c8da-4275-b157-98dad017d305/page/Gg3/edit
return (
<iframe
className="w-full"
height={2200}
src="https://datastudio.google.com/embed/reporting/faeaf3a4-c8da-4275-b157-98dad017d305/page/Gg3"
frameBorder="0"
style={{ border: 0 }}
allowFullScreen
/>
)
}