From 09da7fcb7cfbbeb18f3b3f30bb4fa66537f27f66 Mon Sep 17 00:00:00 2001
From: James Grugett <jahooma@gmail.com>
Date: Mon, 21 Mar 2022 17:42:06 -0500
Subject: [PATCH] Add weekly active users chart. Put daily active first.

---
 common/util/types.ts          |  5 ++++
 web/pages/analytics.tsx       | 46 +++++++++++++++++++++++++++++------
 web/pages/embed/analytics.tsx | 12 +++------
 3 files changed, 46 insertions(+), 17 deletions(-)
 create mode 100644 common/util/types.ts

diff --git a/common/util/types.ts b/common/util/types.ts
new file mode 100644
index 00000000..865cb8f3
--- /dev/null
+++ b/common/util/types.ts
@@ -0,0 +1,5 @@
+export type FirstArgument<T> = T extends (arg1: infer U, ...args: any[]) => any
+  ? U
+  : any
+
+export type Truthy<T> = Exclude<T, undefined | null | false | 0 | ''>
diff --git a/web/pages/analytics.tsx b/web/pages/analytics.tsx
index b78c2105..e87fd086 100644
--- a/web/pages/analytics.tsx
+++ b/web/pages/analytics.tsx
@@ -40,6 +40,15 @@ export async function getStaticPropz() {
 
   const dailyActiveUsers = dailyUserIds.map((userIds) => userIds.length)
 
+  const weeklyActiveUsers = dailyUserIds.map((_, i) => {
+    const start = Math.max(0, i - 6)
+    const end = i
+    const uniques = new Set<string>()
+    for (let j = start; j <= end; j++)
+      dailyUserIds[j].forEach((userId) => uniques.add(userId))
+    return uniques.size
+  })
+
   const monthlyActiveUsers = dailyUserIds.map((_, i) => {
     const start = Math.max(0, i - 30)
     const end = i
@@ -53,10 +62,11 @@ export async function getStaticPropz() {
     props: {
       startDate: startDate.valueOf(),
       dailyActiveUsers,
+      weeklyActiveUsers,
+      monthlyActiveUsers,
       dailyBetCounts,
       dailyContractCounts,
       dailyCommentCounts,
-      monthlyActiveUsers,
     },
     revalidate: 12 * 60 * 60, // regenerate after half a day
   }
@@ -65,14 +75,17 @@ export async function getStaticPropz() {
 export default function Analytics(props: {
   startDate: number
   dailyActiveUsers: number[]
+  weeklyActiveUsers: number[]
+  monthlyActiveUsers: number[]
   dailyBetCounts: number[]
   dailyContractCounts: number[]
   dailyCommentCounts: number[]
-  monthlyActiveUsers: number[]
 }) {
   props = usePropz(props, getStaticPropz) ?? {
     startDate: 0,
     dailyActiveUsers: [],
+    weeklyActiveUsers: [],
+    monthlyActiveUsers: [],
     dailyBetCounts: [],
     dailyContractCounts: [],
     dailyCommentCounts: [],
@@ -88,27 +101,44 @@ export default function Analytics(props: {
 
 export function CustomAnalytics(props: {
   startDate: number
-  monthlyActiveUsers: number[]
   dailyActiveUsers: number[]
+  weeklyActiveUsers: number[]
+  monthlyActiveUsers: number[]
   dailyBetCounts: number[]
   dailyContractCounts: number[]
   dailyCommentCounts: number[]
 }) {
   const {
     startDate,
-    monthlyActiveUsers,
     dailyActiveUsers,
     dailyBetCounts,
     dailyContractCounts,
     dailyCommentCounts,
+    weeklyActiveUsers,
+    monthlyActiveUsers,
   } = props
   return (
     <Col>
-      <Title text="Monthly Active Users" />
-      <DailyCountChart dailyCounts={monthlyActiveUsers} startDate={startDate} />
-
       <Title text="Daily Active Users" />
-      <DailyCountChart dailyCounts={dailyActiveUsers} startDate={startDate} />
+      <DailyCountChart
+        dailyCounts={dailyActiveUsers}
+        startDate={startDate}
+        small
+      />
+
+      <Title text="Weekly Active Users" />
+      <DailyCountChart
+        dailyCounts={weeklyActiveUsers}
+        startDate={startDate}
+        small
+      />
+
+      <Title text="Monthly Active Users" />
+      <DailyCountChart
+        dailyCounts={monthlyActiveUsers}
+        startDate={startDate}
+        small
+      />
 
       <Title text="Trades" />
       <DailyCountChart
diff --git a/web/pages/embed/analytics.tsx b/web/pages/embed/analytics.tsx
index 806b6e64..1441e39e 100644
--- a/web/pages/embed/analytics.tsx
+++ b/web/pages/embed/analytics.tsx
@@ -1,7 +1,8 @@
+import { FirstArgument } from '../../../common/util/types'
 import { Col } from '../../components/layout/col'
 import { Spacer } from '../../components/layout/spacer'
 import { fromPropz } from '../../hooks/use-propz'
-import {
+import Analytics, {
   CustomAnalytics,
   FirebaseAnalytics,
   getStaticPropz,
@@ -9,14 +10,7 @@ import {
 
 export const getStaticProps = fromPropz(getStaticPropz)
 
-export default function AnalyticsEmbed(props: {
-  startDate: number
-  dailyActiveUsers: number[]
-  dailyBetCounts: number[]
-  dailyContractCounts: number[]
-  dailyCommentCounts: number[]
-  monthlyActiveUsers: number[]
-}) {
+export default function AnalyticsEmbed(props: FirstArgument<typeof Analytics>) {
   return (
     <Col className="w-full px-2 bg-white">
       <CustomAnalytics {...props} />