feat: User Journey

Author: lindesvard

apps/start/package.json

@@ -25,6 +25,7 @@
     "@faker-js/faker": "^9.6.0",
     "@hookform/resolvers": "^3.3.4",
     "@hyperdx/node-opentelemetry": "^0.8.1",
+    "@nivo/sankey": "^0.99.0",
     "@number-flow/react": "0.3.5",
     "@openpanel/common": "workspace:^",
     "@openpanel/constants": "workspace:^",
@@ -172,4 +173,4 @@
     "web-vitals": "^4.2.4",
     "wrangler": "^4.42.2"
   }
-}
+}

apps/start/src/components/charts/chart-tooltip.tsx

@@ -5,9 +5,15 @@ import { Tooltip as RechartsTooltip, type TooltipProps } from 'recharts';
 
 export const ChartTooltipContainer = ({
   children,
-}: { children: React.ReactNode }) => {
+  className,
+}: { children: React.ReactNode; className?: string }) => {
   return (
-    <div className="min-w-[180px] col gap-2 rounded-xl border bg-background/80 p-3  shadow-xl backdrop-blur-sm">
+    <div
+      className={cn(
+        'min-w-[180px] col gap-2 rounded-xl border bg-background/80 p-3  shadow-xl backdrop-blur-sm',
+        className,
+      )}
+    >
       {children}
     </div>
   );

apps/start/src/components/overview/overview-top-geo.tsx

@@ -130,7 +130,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
             />
           )}
         </WidgetBody>
-        <WidgetFooter>
+        <WidgetFooter className="row items-center justify-between">
           <OverviewDetailsButton
             onClick={() =>
               pushModal('OverviewTopGenericModal', {
@@ -140,6 +140,17 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
             }
           />
           {/* <OverviewChartToggle {...{ chartType, setChartType }} /> */}
+          <span className="text-sm text-muted-foreground pr-2">
+            Geo data provided by{' '}
+            <a
+              href="https://ipdata.co"
+              target="_blank"
+              rel="noopener noreferrer nofollow"
+              className="hover:underline"
+            >
+              MaxMind
+            </a>
+          </span>
         </WidgetFooter>
       </Widget>
       <Widget className="col-span-6 md:col-span-3">