From 044e851a09e16c2e4ac8a646939ca0865697cc91 Mon Sep 17 00:00:00 2001
From: gioelecerati <gioele@cerati.org>
Date: Wed, 6 Sep 2023 15:58:21 +0200
Subject: [PATCH 1/4] www: dashboard updates

---
 .../www/components/Admin/UserTable/index.tsx  | 43 ++++++++++++++++++-
 packages/www/hooks/use-api/endpoints/user.ts  | 20 +++++++++
 2 files changed, 62 insertions(+), 1 deletion(-)

diff --git a/packages/www/components/Admin/UserTable/index.tsx b/packages/www/components/Admin/UserTable/index.tsx
index 3660f11546..d4ffc9493b 100644
--- a/packages/www/components/Admin/UserTable/index.tsx
+++ b/packages/www/components/Admin/UserTable/index.tsx
@@ -21,6 +21,7 @@ const UserTable = ({ userId, id }: UserTableProps) => {
   const [removeAdminModal, setRemoveAdminModal] = useState(false);
   const [suspendModal, setSuspendModal] = useState(false);
   const [unsuspendModal, setUnsuspendModal] = useState(false);
+  const [enterpriseModal, setEnterpriseModal] = useState(false);
   const [nextCursor, setNextCursor] = useState("");
   const [lastCursor, setLastCursor] = useState("");
   const [lastOrder, setLastOrder] = useState("");
@@ -28,13 +29,15 @@ const UserTable = ({ userId, id }: UserTableProps) => {
   const [loading, setLoading] = useState(true);
   const [loadingError, setLoadingError] = useState("");
 
-  const { getUsers, makeUserAdmin, setUserSuspended } = useApi();
+  const { getUsers, makeUserAdmin, setUserSuspended, makeUserEnterprise } =
+    useApi();
 
   const close = () => {
     setAdminModal(false);
     setRemoveAdminModal(false);
     setSuspendModal(false);
     setUnsuspendModal(false);
+    setEnterpriseModal(false);
   };
 
   const getProductName = (productId) =>
@@ -208,6 +211,34 @@ const UserTable = ({ userId, id }: UserTableProps) => {
           </Flex>
         </Modal>
       )}
+      {enterpriseModal && selectedUser && (
+        <Modal onClose={close}>
+          <h3>Make User Enterprise</h3>
+          <p>
+            Are you sure you want to subscribe the user "{selectedUser.email}"
+            to the Enterprise plan?
+          </p>
+          <Flex sx={{ justifyContent: "flex-end" }}>
+            <Button
+              type="button"
+              variant="outlineSmall"
+              onClick={close}
+              sx={{ mr: 2 }}>
+              Cancel
+            </Button>
+            <Button
+              type="button"
+              variant="primarySmall"
+              onClick={() => {
+                makeUserEnterprise(selectedUser.id)
+                  .then(refetch)
+                  .finally(close);
+              }}>
+              Make User Enterprise
+            </Button>
+          </Flex>
+        </Modal>
+      )}
       {removeAdminModal && selectedUser && (
         <Modal onClose={close}>
           <h3>Remove Admin Rights</h3>
@@ -276,6 +307,16 @@ const UserTable = ({ userId, id }: UserTableProps) => {
           onClick={() => selectedUser && setUnsuspendModal(true)}>
           Unsuspend User
         </Button>
+        <Button
+          variant="outlineSmall"
+          disabled={
+            !selectedUser ||
+            selectedUser.stripeProductId == "prod_OTTbwpzxNLMNSh"
+          }
+          sx={{ ml: "1em" }}
+          onClick={() => selectedUser && setEnterpriseModal(true)}>
+          Make enterprise
+        </Button>
       </CommonAdminTable>
     </Container>
   );
diff --git a/packages/www/hooks/use-api/endpoints/user.ts b/packages/www/hooks/use-api/endpoints/user.ts
index 25c0ef4b80..1a42f92383 100644
--- a/packages/www/hooks/use-api/endpoints/user.ts
+++ b/packages/www/hooks/use-api/endpoints/user.ts
@@ -277,6 +277,26 @@ export const makeUserAdmin = async (
   return res;
 };
 
+export const makeUserEnterprise = async (
+  userId
+): Promise<[Response, User | ApiError]> => {
+  const [res, body] = await context.fetch("/stripe/user/subscribe/enterprise", {
+    method: "POST",
+    body: JSON.stringify({ userId: userId }),
+    headers: {
+      "content-type": "application/json",
+    },
+  });
+
+  setState((state) => ({ ...state, userRefresh: Date.now() }));
+
+  if (res.status !== 201) {
+    return body;
+  }
+
+  return res;
+};
+
 export const setUserSuspended = async (
   userId: string,
   payload: SuspendUserPayload

From 8de776dcd1404e37c282b391499270516f355fd1 Mon Sep 17 00:00:00 2001
From: gioelecerati <gioele@cerati.org>
Date: Thu, 7 Sep 2023 00:37:35 +0200
Subject: [PATCH 2/4] actually make it enteprise

---
 packages/www/hooks/use-api/endpoints/user.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/www/hooks/use-api/endpoints/user.ts b/packages/www/hooks/use-api/endpoints/user.ts
index 1a42f92383..36ffa1f0e7 100644
--- a/packages/www/hooks/use-api/endpoints/user.ts
+++ b/packages/www/hooks/use-api/endpoints/user.ts
@@ -282,7 +282,7 @@ export const makeUserEnterprise = async (
 ): Promise<[Response, User | ApiError]> => {
   const [res, body] = await context.fetch("/stripe/user/subscribe/enterprise", {
     method: "POST",
-    body: JSON.stringify({ userId: userId }),
+    body: JSON.stringify({ userId: userId, actually_migrate: true }),
     headers: {
       "content-type": "application/json",
     },

From d29e4e28492f0146ff7ed4b18fdb86a968f13e7b Mon Sep 17 00:00:00 2001
From: gioelecerati <gioele@cerati.org>
Date: Thu, 7 Sep 2023 12:34:03 +0200
Subject: [PATCH 3/4] update usage dashboard

---
 .../components/Admin/AdminUsageTable/index.tsx | 18 ++++++++----------
 packages/www/hooks/use-api/endpoints/user.ts   |  4 +++-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/www/components/Admin/AdminUsageTable/index.tsx b/packages/www/components/Admin/AdminUsageTable/index.tsx
index 350c8f4e9b..25a177d3df 100644
--- a/packages/www/components/Admin/AdminUsageTable/index.tsx
+++ b/packages/www/components/Admin/AdminUsageTable/index.tsx
@@ -20,7 +20,7 @@ const Index = ({ id }: { id: string }, children) => {
   const [toTime, setToTime] = useState("");
   const [usage, setUsage] = useState(null);
   const [users, setUsers] = useState([]);
-  const { getUsers, getUsage } = useApi();
+  const { getUsers, getUsage, getBillingUsage } = useApi();
   useEffect(() => {
     getUsers(10000)
       .then((result) => {
@@ -49,7 +49,7 @@ const Index = ({ id }: { id: string }, children) => {
       setMessage(`Invalid date ${toTime}`);
       return;
     }
-    const [res, usage] = await getUsage(ftd, ttd, userId);
+    const [res, usage] = await getBillingUsage(ftd, ttd, null, null, userId);
     if (res.status == 200) {
       console.log(`got usage data:`, usage);
       setUsage(usage);
@@ -100,19 +100,17 @@ const Index = ({ id }: { id: string }, children) => {
           <TableRow variant={TableRowVariant.Header} key="usage header">
             <>
               <Box></Box>
-              <Box>Source seconds</Box>
-              <Box>Transcoded seconds</Box>
-              <Box>Source segments</Box>
-              <Box>Transcoded segments</Box>
+              <Box>Transcoding</Box>
+              <Box>Delivery</Box>
+              <Box>Storage</Box>
             </>
           </TableRow>
           <TableRow key="just one row for now" variant={TableRowVariant.Normal}>
             <>
               <Box></Box>
-              <Box>{dur2str(usage && usage.sourceSegmentsDuration)}</Box>
-              <Box>{dur2str(usage && usage.transcodedSegmentsDuration)}</Box>
-              <Box>{usage && usage.sourceSegments}</Box>
-              <Box>{usage && usage.transcodedSegments}</Box>
+              <Box>{usage && usage.TotalUsageMins}</Box>
+              <Box>{usage && usage.DeliveryUsageMins}</Box>
+              <Box>{usage && usage.StorageUsageMins}</Box>
             </>
           </TableRow>
         </>
diff --git a/packages/www/hooks/use-api/endpoints/user.ts b/packages/www/hooks/use-api/endpoints/user.ts
index 36ffa1f0e7..0c2da9beda 100644
--- a/packages/www/hooks/use-api/endpoints/user.ts
+++ b/packages/www/hooks/use-api/endpoints/user.ts
@@ -216,7 +216,8 @@ export const getBillingUsage = async (
   fromTime: number,
   toTime: number,
   creatorId?: number,
-  timeStep?: string
+  timeStep?: string,
+  userId?: string
 ): Promise<[Response, BillingUsageData | ApiError]> => {
   let [res, usage] = await context.fetch(
     `/data/usage/query?${qs.stringify({
@@ -224,6 +225,7 @@ export const getBillingUsage = async (
       to: toTime,
       creatorId,
       timeStep,
+      userId,
     })}`,
     {}
   );

From 653b2b5e4ab4f480cd1eb63233ad2c4a9f63f8ca Mon Sep 17 00:00:00 2001
From: gioelecerati <gioele@cerati.org>
Date: Thu, 7 Sep 2023 12:51:57 +0200
Subject: [PATCH 4/4] better usage table

---
 .../Admin/AdminUsageTable/index.tsx           | 43 ++++++++++++++-----
 1 file changed, 32 insertions(+), 11 deletions(-)

diff --git a/packages/www/components/Admin/AdminUsageTable/index.tsx b/packages/www/components/Admin/AdminUsageTable/index.tsx
index 25a177d3df..aab002ead1 100644
--- a/packages/www/components/Admin/AdminUsageTable/index.tsx
+++ b/packages/www/components/Admin/AdminUsageTable/index.tsx
@@ -95,22 +95,43 @@ const Index = ({ id }: { id: string }, children) => {
           Get usage
         </Button>
       </Box>
-      <Table sx={{ gridTemplateColumns: "auto auto auto auto auto" }}>
+      <Table
+        sx={{
+          border: "1px solid #e0e0e0",
+          gridTemplateColumns: "auto auto auto auto auto",
+          gap: "1rem",
+        }}>
         <>
-          <TableRow variant={TableRowVariant.Header} key="usage header">
+          <TableRow
+            variant={TableRowVariant.Header}
+            key="usage header"
+            sx={{ background: "#f7f7f7", fontWeight: "bold" }}>
             <>
-              <Box></Box>
-              <Box>Transcoding</Box>
-              <Box>Delivery</Box>
-              <Box>Storage</Box>
+              <Box sx={{ padding: "0.5rem" }}>Category</Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "center" }}>
+                Transcoding
+              </Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "center" }}>
+                Delivery
+              </Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "center" }}>Storage</Box>
             </>
           </TableRow>
-          <TableRow key="just one row for now" variant={TableRowVariant.Normal}>
+          <TableRow
+            key="just one row for now"
+            variant={TableRowVariant.Normal}
+            sx={{ borderBottom: "1px solid #e0e0e0" }}>
             <>
-              <Box></Box>
-              <Box>{usage && usage.TotalUsageMins}</Box>
-              <Box>{usage && usage.DeliveryUsageMins}</Box>
-              <Box>{usage && usage.StorageUsageMins}</Box>
+              <Box sx={{ padding: "0.5rem" }}>Values</Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "right" }}>
+                {usage && usage.TotalUsageMins}
+              </Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "right" }}>
+                {usage && usage.DeliveryUsageMins}
+              </Box>
+              <Box sx={{ padding: "0.5rem", textAlign: "right" }}>
+                {usage && usage.StorageUsageMins}
+              </Box>
             </>
           </TableRow>
         </>