Plausible analytics fix

Signed-off-by: Mihovil Ilakovac <mihovil@ilakovac.com>
This commit is contained in:
Mihovil Ilakovac 2024-11-18 11:03:58 +01:00
parent a8654e3d64
commit 7db5489a7f
2 changed files with 70 additions and 6 deletions

View File

@ -1,18 +1,23 @@
--- template/app/src/admin/dashboards/analytics/AnalyticsDashboardPage.tsx
+++ opensaas-sh/app/src/admin/dashboards/analytics/AnalyticsDashboardPage.tsx
@@ -1,4 +1,6 @@
+import { Link } from "wasp/client/router";
+import { Link } from 'wasp/client/router';
import { type AuthUser } from 'wasp/auth';
+import { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
import { useQuery, getDailyStats } from 'wasp/client/operations';
import TotalSignupsCard from './TotalSignupsCard';
import TotalPageViewsCard from './TotalPageViewsCard';
@@ -10,12 +12,45 @@
import { useRedirectHomeUnlessUserIsAdmin } from '../../useRedirectHomeUnlessUserIsAdmin'
@@ -7,21 +9,68 @@
import RevenueAndProfitChart from './RevenueAndProfitChart';
import SourcesTable from './SourcesTable';
import DefaultLayout from '../../layout/DefaultLayout';
-import { useRedirectHomeUnlessUserIsAdmin } from '../../useRedirectHomeUnlessUserIsAdmin'
+import { useRedirectHomeUnlessUserIsAdmin } from '../../useRedirectHomeUnlessUserIsAdmin';
const Dashboard = ({ user }: { user: AuthUser }) => {
- useRedirectHomeUnlessUserIsAdmin({ user })
+ const [isDemoInfoVisible, setIsDemoInfoVisible] = useState(false);
useRedirectHomeUnlessUserIsAdmin({ user })
+ useRedirectHomeUnlessUserIsAdmin({ user });
const { data: stats, isLoading, error } = useQuery(getDailyStats);
@ -36,6 +41,10 @@
+ console.error(error);
+ }
+ };
+
+ const sortedSources = useMemo(() => {
+ return stats?.dailyStats?.sources?.slice().sort((a, b) => b.visitors - a.visitors);
+ }, [stats?.dailyStats?.sources]);
+
return (
<DefaultLayout user={user}>
@ -43,7 +52,13 @@
+ {isDemoInfoVisible && (
+ <div className='fixed z-999 bottom-0 mb-2 left-1/2 -translate-x-1/2 lg:mb-4 bg-gray-700 rounded-full px-3.5 py-2 text-sm text-white duration-300 ease-in-out hover:bg-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-indigo-600'>
+ <div className='px-4 flex flex-row gap-2 items-center my-1'>
+ <span className='text-gray-100 text-center'>This is actual data from Stripe test purchases. <br/> Try out purchasing a <Link to='/pricing' className="underline text-yellow-400">test product</Link>!</span>
+ <span className='text-gray-100 text-center'>
+ This is actual data from Stripe test purchases. <br /> Try out purchasing a{' '}
+ <Link to='/pricing' className='underline text-yellow-400'>
+ test product
+ </Link>
+ !
+ </span>
+ <button className=' pl-2.5 text-gray-400 text-xl font-bold' onClick={() => handleDemoInfoClose()}>
+ X
+ </button>
@ -53,3 +68,23 @@
<div className='grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6 xl:grid-cols-4 2xl:gap-7.5'>
<TotalPageViewsCard
totalPageViews={stats?.dailyStats.totalViews}
prevDayViewsChangePercent={stats?.dailyStats.prevDayViewsChangePercent}
/>
- <TotalRevenueCard dailyStats={stats?.dailyStats} weeklyStats={stats?.weeklyStats} isLoading={isLoading} />
+ <TotalRevenueCard
+ dailyStats={stats?.dailyStats}
+ weeklyStats={stats?.weeklyStats}
+ isLoading={isLoading}
+ />
<TotalPayingUsersCard dailyStats={stats?.dailyStats} isLoading={isLoading} />
<TotalSignupsCard dailyStats={stats?.dailyStats} isLoading={isLoading} />
</div>
@@ -30,7 +79,7 @@
<RevenueAndProfitChart weeklyStats={stats?.weeklyStats} isLoading={isLoading} />
<div className='col-span-12 xl:col-span-8'>
- <SourcesTable sources={stats?.dailyStats?.sources} />
+ <SourcesTable sources={sortedSources} />
</div>
</div>
</DefaultLayout>

View File

@ -0,0 +1,29 @@
--- template/app/src/analytics/providers/plausibleAnalyticsUtils.ts
+++ opensaas-sh/app/src/analytics/providers/plausibleAnalyticsUtils.ts
@@ -36,7 +36,7 @@
async function getTotalPageViews() {
const response = await fetch(
- `${PLAUSIBLE_BASE_URL}/v1/stats/aggregate?site_id=${PLAUSIBLE_SITE_ID}&metrics=pageviews`,
+ `${PLAUSIBLE_BASE_URL}/v1/stats/aggregate?site_id=${PLAUSIBLE_SITE_ID}&metrics=pageviews&with_imported=true`,
{
method: 'GET',
headers: {
@@ -80,7 +80,7 @@
}
async function getPageviewsForDate(date: string) {
- const url = `${PLAUSIBLE_BASE_URL}/v1/stats/aggregate?site_id=${PLAUSIBLE_SITE_ID}&period=day&date=${date}&metrics=pageviews`;
+ const url = `${PLAUSIBLE_BASE_URL}/v1/stats/aggregate?site_id=${PLAUSIBLE_SITE_ID}&period=day&date=${date}&metrics=pageviews&with_imported=true`;
const response = await fetch(url, {
method: 'GET',
headers: headers,
@@ -93,7 +93,7 @@
}
export async function getSources() {
- const url = `${PLAUSIBLE_BASE_URL}/v1/stats/breakdown?site_id=${PLAUSIBLE_SITE_ID}&property=visit:source&metrics=visitors`;
+ const url = `${PLAUSIBLE_BASE_URL}/v1/stats/breakdown?site_id=${PLAUSIBLE_SITE_ID}&property=visit:source&metrics=visitors&with_imported=true`;
const response = await fetch(url, {
method: 'GET',
headers: headers,