diff --git a/web/components/analytics/charts.tsx b/web/components/analytics/charts.tsx
index 44360c97..6a3b0b52 100644
--- a/web/components/analytics/charts.tsx
+++ b/web/components/analytics/charts.tsx
@@ -1,7 +1,8 @@
-import { ResponsiveLine } from '@nivo/line'
+import { Point, ResponsiveLine } from '@nivo/line'
import dayjs from 'dayjs'
import _ from 'lodash'
import { useWindowSize } from 'web/hooks/use-window-size'
+import { Col } from '../layout/col'
export function DailyCountChart(props: {
startDate: number
@@ -46,6 +47,10 @@ export function DailyCountChart(props: {
enableGridX={!!width && width >= 800}
enableArea
margin={{ top: 20, right: 28, bottom: 22, left: 40 }}
+ sliceTooltip={({ slice }) => {
+ const point = slice.points[0]
+ return
+ }}
/>
)
@@ -97,7 +102,34 @@ export function DailyPercentChart(props: {
enableGridX={!!width && width >= 800}
enableArea
margin={{ top: 20, right: 28, bottom: 22, left: 40 }}
+ sliceTooltip={({ slice }) => {
+ const point = slice.points[0]
+ return
+ }}
/>
)
}
+
+function Tooltip(props: { point: Point }) {
+ const { point } = props
+ return (
+
+
+ {point.serieId} {point.data.yFormatted}
+
+ {dayjs(point.data.x).format('MMM DD')}
+
+ )
+}
diff --git a/web/pages/analytics.tsx b/web/pages/analytics.tsx
index e181065f..e948b998 100644
--- a/web/pages/analytics.tsx
+++ b/web/pages/analytics.tsx
@@ -18,10 +18,11 @@ import { getDailyNewUsers } from 'web/lib/firebase/users'
export const getStaticProps = fromPropz(getStaticPropz)
export async function getStaticPropz() {
- const numberOfDays = 45
+ const numberOfDays = 10
const tomorrow = dayjs(dayjs().format('YYYY-MM-DD'))
.add(1, 'day')
- .subtract(7, 'hours')
+ // Convert from UTC midnight to PT midnight.
+ .add(7, 'hours')
const startDate = tomorrow.subtract(numberOfDays, 'day')
@@ -147,7 +148,7 @@ export async function getStaticPropz() {
return {
props: {
- startDate: startDate.add(1, 'day').valueOf(),
+ startDate,
dailyActiveUsers,
weeklyActiveUsers,
monthlyActiveUsers,
@@ -208,7 +209,6 @@ export function CustomAnalytics(props: {
weeklyActivationRate: number[]
}) {
const {
- startDate,
dailyActiveUsers,
dailyBetCounts,
dailyContractCounts,
@@ -220,6 +220,8 @@ export function CustomAnalytics(props: {
weeklyActivationRate,
} = props
+ const startDate = dayjs(props.startDate).add(12, 'hours').valueOf()
+
const dailyDividedByWeekly = dailyActiveUsers
.map((dailyActive, i) =>
Math.round((100 * dailyActive) / weeklyActiveUsers[i])