public: hero improvements

apps/public/src/app/social-proof/social-proof.tsx

@@ -0,0 +1,72 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { Button } from '@/components/ui/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@/components/ui/tooltip';
+import { cn } from '@/utils/cn';
+import Image from 'next/image';
+
+interface JoinWaitlistProps {
+  className?: string;
+  count: number;
+}
+
+export function SocialProof({ className, count }: JoinWaitlistProps) {
+  return (
+    <div className={cn('flex gap-2 justify-center items-center', className)}>
+      <div className="flex">
+        <Tooltip>
+          <TooltipTrigger>
+            <Image
+              className="rounded-full"
+              src="/clickhouse.png"
+              width={24}
+              height={24}
+              alt="Clickhouse"
+            />
+          </TooltipTrigger>
+          <TooltipContent>Clickhouse is here</TooltipContent>
+        </Tooltip>
+        <Tooltip>
+          <TooltipTrigger className="-mx-3">
+            <Image
+              className="rounded-full"
+              src="/getdreams.png"
+              width={24}
+              height={24}
+              alt="GetDreams"
+            />
+          </TooltipTrigger>
+          <TooltipContent>GetDreams is here</TooltipContent>
+        </Tooltip>
+        <Tooltip>
+          <TooltipTrigger>
+            <Image
+              className="rounded-full"
+              src="/kiddokitchen.png"
+              width={24}
+              height={24}
+              alt="KiddoKitchen"
+            />
+          </TooltipTrigger>
+          <TooltipContent>KiddoKitchen is here</TooltipContent>
+        </Tooltip>
+      </div>
+      <p className="text-white">
+        {count} early birds have already signed up! 🚀
+      </p>
+    </div>
+  );
+}