Update AnalyticsDashboardPage.tsx.diff

This commit is contained in:
vincanger
2024-12-17 17:42:16 +01:00
parent a0de7e9112
commit 9020daf81a

View File

@ -7,8 +7,8 @@
import { useQuery, getDailyStats } from 'wasp/client/operations'; import { useQuery, getDailyStats } from 'wasp/client/operations';
import TotalSignupsCard from './TotalSignupsCard'; import TotalSignupsCard from './TotalSignupsCard';
import TotalPageViewsCard from './TotalPageViewsCard'; import TotalPageViewsCard from './TotalPageViewsCard';
@@ -10,12 +12,54 @@ @@ -11,16 +13,58 @@
import { useRedirectHomeUnlessUserIsAdmin } from '../../useRedirectHomeUnlessUserIsAdmin'; import { cn } from '../../../client/cn';
const Dashboard = ({ user }: { user: AuthUser }) => { const Dashboard = ({ user }: { user: AuthUser }) => {
+ const [isDemoInfoVisible, setIsDemoInfoVisible] = useState(false); + const [isDemoInfoVisible, setIsDemoInfoVisible] = useState(false);
@ -16,21 +16,19 @@
const { data: stats, isLoading, error } = useQuery(getDailyStats); const { data: stats, isLoading, error } = useQuery(getDailyStats);
+ const didUserCloseDemoInfo = localStorage.getItem('didUserCloseDemoInfo') === 'true';
+
+ useEffect(() => { + useEffect(() => {
+ try { + if (didUserCloseDemoInfo || !stats) {
+ if (localStorage.getItem('isStripeDemoInfoVisible') === 'false') { + setIsDemoInfoVisible(false);
+ // do nothing + } else if (!didUserCloseDemoInfo && stats) {
+ } else {
+ setIsDemoInfoVisible(true); + setIsDemoInfoVisible(true);
+ } + }
+ } catch (error) { + }, [stats]);
+ console.error(error);
+ }
+ }, []);
+ +
+ const handleDemoInfoClose = () => { + const handleDemoInfoClose = () => {
+ try { + try {
+ localStorage.setItem('isStripeDemoInfoVisible', 'false'); + localStorage.setItem('didUserCloseDemoInfo', 'true');
+ setIsDemoInfoVisible(false); + setIsDemoInfoVisible(false);
+ } catch (error) { + } catch (error) {
+ console.error(error); + console.error(error);
@ -60,9 +58,18 @@
+ </div> + </div>
+ )} + )}
<div className='relative'> <div className='relative'>
<div className={`${!stats ? 'opacity-25' : ''}`}> - <div className={cn({
- 'opacity-25': !stats,
- })}>
+ <div
+ className={cn({
+ 'opacity-25': !stats,
+ })}
+ >
<div className='grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6 xl:grid-cols-4 2xl:gap-7.5'> <div className='grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6 xl:grid-cols-4 2xl:gap-7.5'>
@@ -36,7 +80,7 @@ <TotalPageViewsCard
totalPageViews={stats?.dailyStats.totalViews}
@@ -39,7 +83,7 @@
<RevenueAndProfitChart weeklyStats={stats?.weeklyStats} isLoading={isLoading} /> <RevenueAndProfitChart weeklyStats={stats?.weeklyStats} isLoading={isLoading} />
<div className='col-span-12 xl:col-span-8'> <div className='col-span-12 xl:col-span-8'>
@ -71,3 +78,14 @@
</div> </div>
</div> </div>
</div> </div>
@@ -47,9 +91,7 @@
{!stats && (
<div className='absolute inset-0 flex items-start justify-center bg-white/50 dark:bg-boxdark-2/50'>
<div className='rounded-lg bg-white p-8 shadow-lg dark:bg-boxdark'>
- <p className='text-2xl font-bold text-boxdark dark:text-white'>
- No daily stats generated yet
- </p>
+ <p className='text-2xl font-bold text-boxdark dark:text-white'>No daily stats generated yet</p>
<p className='mt-2 text-sm text-bodydark2'>
Stats will appear here once the daily stats job has run
</p>