From 6e5ad4bd9b58be119950938dce3c93513e5dcf4b Mon Sep 17 00:00:00 2001
From: Jeremy Asuncion <jeremyasuncion808@gmail.com>
Date: Wed, 30 Nov 2022 14:58:50 -0800
Subject: [PATCH] Fix activity dashboard for preview (#782)

* Fix activity dashboard for preview

* Update preview i18n for activity dashboard
---
 frontend/i18n/en/activity.json                        |  3 ++-
 .../ActivityDashboard/ActivityDashboard.tsx           | 11 +++++++++--
 frontend/src/components/AppBar/AppBarPreview.tsx      |  2 +-
 frontend/src/pages/preview.tsx                        |  2 ++
 4 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/frontend/i18n/en/activity.json b/frontend/i18n/en/activity.json
index 8ea9e9133..f276fdd71 100644
--- a/frontend/i18n/en/activity.json
+++ b/frontend/i18n/en/activity.json
@@ -7,7 +7,8 @@
   "learnMore": "<externalLink href='$t(learnMoreLink)'>Learn more about where we get this data.</externalLink>",
   "noData": {
     "allData": "No data could be fetched for this plugin. <externalLink href='$t(learnMoreLink)'>Learn more.</externalLink>",
-    "monthlyInstalls": "There is not yet enough data to display for this plugin"
+    "monthlyInstalls": "There is not yet enough data to display for this plugin",
+    "preview": "Activity not available for previews"
   },
   "monthlyInstalls": {
     "title": "Monthly installs in past year",
diff --git a/frontend/src/components/ActivityDashboard/ActivityDashboard.tsx b/frontend/src/components/ActivityDashboard/ActivityDashboard.tsx
index 9799f0c06..25c280ab2 100644
--- a/frontend/src/components/ActivityDashboard/ActivityDashboard.tsx
+++ b/frontend/src/components/ActivityDashboard/ActivityDashboard.tsx
@@ -2,6 +2,7 @@ import { useMemo } from 'react';
 
 import { I18n } from '@/components/I18n';
 import { Text } from '@/components/Text';
+import { PREVIEW } from '@/constants/env';
 import { usePluginState } from '@/context/plugin';
 import { usePluginMetrics } from '@/hooks';
 
@@ -10,7 +11,9 @@ import { EmptyState } from './EmptyState';
 
 export function ActivityDashboard() {
   const { plugin } = usePluginState();
-  const { data: metrics, isLoading } = usePluginMetrics(plugin?.name);
+  const { data: metrics, isLoading } = usePluginMetrics(
+    PREVIEW ? undefined : plugin?.name,
+  );
 
   const isEmpty = useMemo(() => {
     if (isLoading) {
@@ -33,7 +36,11 @@ export function ActivityDashboard() {
     <div>
       {isEmpty ? (
         <EmptyState className="h-[75px] screen-495:h-[125px]">
-          <I18n i18nKey="activity:noData.allData" />
+          <I18n
+            i18nKey={
+              PREVIEW ? 'activity:noData.preview' : 'activity:noData.allData'
+            }
+          />
         </EmptyState>
       ) : (
         <>
diff --git a/frontend/src/components/AppBar/AppBarPreview.tsx b/frontend/src/components/AppBar/AppBarPreview.tsx
index fd5d59f82..5f3d4616b 100644
--- a/frontend/src/components/AppBar/AppBarPreview.tsx
+++ b/frontend/src/components/AppBar/AppBarPreview.tsx
@@ -224,7 +224,7 @@ export function AppBarPreview() {
           <div className="screen-1150:hidden">{renderRightColumn()}</div>
         </div>
 
-        <div className="hidden: screen-1425:flex items-center space-x-sds-xl col-span-3">
+        <div className="hidden screen-1425:flex items-center space-x-sds-xl col-span-3">
           <AppBarPreviewCenterColumn />
         </div>
 
diff --git a/frontend/src/pages/preview.tsx b/frontend/src/pages/preview.tsx
index cd9cd11f3..64ec840b6 100644
--- a/frontend/src/pages/preview.tsx
+++ b/frontend/src/pages/preview.tsx
@@ -33,6 +33,8 @@ export async function getStaticProps({
     'pageTitles',
     'pluginPage',
     'pluginData',
+    'preview',
+    'activity',
   ] as I18nNamespace[]);
 
   // Return default data to prevent Next.js error if the plugin path is not defined.