Replace usage menu item with insights on Dedicated (#20587)

* Replace usage menu item with insights on Dedicated

Tool: gitpod/catfood.gitpod.cloud

* Rename usage-related functions to insights in download module

Tool: gitpod/catfood.gitpod.cloud

Author: filiptronicek

components/dashboard/src/insights/download/DownloadInsights.tsx

@@ -52,7 +52,7 @@ export const DownloadInsightsToast = ({ organizationId, from, to, organizationNa
     if (isLoading) {
         return (
             <div>
-                <span>Preparing usage export</span>
+                <span>Preparing insights export</span>
                 <br />
                 <span className="text-sm">Exporting page {progress}</span>
             </div>
@@ -64,15 +64,15 @@ export const DownloadInsightsToast = ({ organizationId, from, to, organizationNa
             <div className="flex flex-row items-start space-x-2">
                 <AlertTriangle className="w-5 h-5 mt-0.5" />
                 <div>
-                    <span>Error exporting your usage data:</span>
+                    <span>Error exporting your insights data:</span>
                     <pre className="mt-2 whitespace-normal text-sm">{error.message}</pre>
                 </div>
             </div>
         );
     }
 
     if (!data || !data.blob || data.count === 0) {
-        return <span>No usage data for the selected period.</span>;
+        return <span>No insights data for the selected period.</span>;
     }
 
     const readableSize = prettyBytes(data.blob.size);
@@ -81,7 +81,7 @@ export const DownloadInsightsToast = ({ organizationId, from, to, organizationNa
     return (
         <div className="flex flex-row items-start justify-between space-x-2">
             <div>
-                <span>Usage export complete.</span>
+                <span>Insights export complete.</span>
                 <p className="dark:text-gray-500">
                     {readableSize} &middot; {formattedCount} {data.count !== 1 ? "entries" : "entry"} exported
                 </p>

components/dashboard/src/insights/download/download-sessions.ts

@@ -67,20 +67,20 @@ type Args = Pick<ListWorkspaceSessionsRequest, "organizationId" | "from" | "to">
     onProgress?: (percentage: number) => void;
 };
 
-export type DownloadUsageCSVResponse = {
+export type DownloadInsightsCSVResponse = {
     blob: Blob | null;
     filename: string;
     count: number;
 };
 
-const downloadUsageCSV = async ({
+const downloadInsightsCSV = async ({
     organizationId,
     from,
     to,
     organizationName,
     signal,
     onProgress,
-}: Args): Promise<DownloadUsageCSVResponse> => {
+}: Args): Promise<DownloadInsightsCSVResponse> => {
     const start = dayjs(from?.toDate()).format("YYYYMMDD");
     const end = dayjs(to?.toDate()).format("YYYYMMDD");
     const filename = `gitpod-sessions-${organizationName}-${start}-${end}.csv`;
@@ -197,16 +197,16 @@ export const transformSessionRecord = (session: WorkspaceSession) => {
 
 export const useDownloadSessionsCSV = (args: Args) => {
     const client = useQueryClient();
-    const key = getDownloadUsageCSVQueryKey(args);
+    const key = getDownloadInsightsCSVQueryKey(args);
 
     const abort = useCallback(() => {
         client.removeQueries([key]);
     }, [client, key]);
 
-    const query = useQuery<DownloadUsageCSVResponse, Error>(
+    const query = useQuery<DownloadInsightsCSVResponse, Error>(
         key,
         async ({ signal }) => {
-            return downloadUsageCSV({ ...args, signal });
+            return downloadInsightsCSV({ ...args, signal });
         },
         {
             retry: false,
@@ -221,6 +221,6 @@ export const useDownloadSessionsCSV = (args: Args) => {
     };
 };
 
-const getDownloadUsageCSVQueryKey = (args: Args) => {
-    return noPersistence(["usage-export", args]);
+const getDownloadInsightsCSVQueryKey = (args: Args) => {
+    return noPersistence(["insights-export", args]);
 };

components/dashboard/src/menu/OrganizationSelector.tsx

@@ -77,13 +77,23 @@ export default function OrganizationSelector() {
                 separator: true,
                 link: "/members",
             });
-            linkEntries.push({
-                title: "Usage",
-                customContent: <LinkEntry>Usage</LinkEntry>,
-                active: false,
-                separator: false,
-                link: "/usage",
-            });
+            if (isDedicated) {
+                linkEntries.push({
+                    title: "Insights",
+                    customContent: <LinkEntry>Insights</LinkEntry>,
+                    active: false,
+                    separator: false,
+                    link: "/insights",
+                });
+            } else {
+                linkEntries.push({
+                    title: "Usage",
+                    customContent: <LinkEntry>Usage</LinkEntry>,
+                    active: false,
+                    separator: false,
+                    link: "/usage",
+                });
+            }
             // Show billing if user is an owner of current org
             if (owner) {
                 if (billingMode?.mode === "usage-based") {