public: update hero

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-05-21 08:59:53 +02:00
parent fbbea02ff1
commit a46811fb35

View File

@@ -4,6 +4,14 @@ import { chQuery } from '@openpanel/db';
import { Heading1, Lead2 } from './copy'; import { Heading1, Lead2 } from './copy';
function shortNumber(num: number) {
if (num < 1e3) return num;
if (num >= 1e3 && num < 1e6) return +(num / 1e3).toFixed(1) + 'K';
if (num >= 1e6 && num < 1e9) return +(num / 1e6).toFixed(1) + 'M';
if (num >= 1e9 && num < 1e12) return +(num / 1e9).toFixed(1) + 'B';
if (num >= 1e12) return +(num / 1e12).toFixed(1) + 'T';
}
export async function Hero() { export async function Hero() {
const projects = await chQuery<{ project_id: string; count: number }>( const projects = await chQuery<{ project_id: string; count: number }>(
'SELECT project_id, count(*) as count from events GROUP by project_id order by count()' 'SELECT project_id, count(*) as count from events GROUP by project_id order by count()'
@@ -36,29 +44,30 @@ export async function Hero() {
size="lg" size="lg"
href="https://dashboard.openpanel.dev/register" href="https://dashboard.openpanel.dev/register"
> >
Create account Get started
</ALink>
<ALink
className="font-semibold"
size="lg"
variant="secondary"
href="https://dashboard.openpanel.dev/share/overview/ZQsEhG"
>
See demo
</ALink> </ALink>
</div> </div>
<p className="mt-2"> <p className="mt-8 flex gap-8">
We have{' '} <div>
<span className="font-semibold">{projectCount} projects</span>{' '} <div className="text-sm uppercase text-muted-foreground">
receiving{' '} Collected events
<span className="font-semibold"> </div>
{new Intl.NumberFormat('en').format(eventCount)} events <div className="font-serif text-3xl font-semibold">
</span>{' '} {shortNumber(eventCount)}
in total! </div>
</div>
<div>
<div className="text-sm uppercase text-muted-foreground">
Active projects
</div>
<div className="font-serif text-3xl font-semibold">
{projectCount}
</div>
</div>
</p> </p>
</div> </div>
<div className="relative mt-24 h-[max(90vh,650px)] w-full"> <div className="relative mt-12 h-[max(90vh,650px)] w-full md:mt-24">
<div className="absolute bottom-0 left-0 right-0 top-0 flex rounded-2xl bg-slate-300 md:p-2"> <div className="absolute bottom-0 left-0 right-0 top-0 flex rounded-2xl bg-slate-300 p-2">
<iframe <iframe
src="https://dashboard.openpanel.dev/share/overview/ZQsEhG?header=0" src="https://dashboard.openpanel.dev/share/overview/ZQsEhG?header=0"
className="h-[max(90vh,650px)] w-full rounded-xl" className="h-[max(90vh,650px)] w-full rounded-xl"