From 7310b62dc47db8dd128d6be9a95d201037bb461c Mon Sep 17 00:00:00 2001
From: Priyanshu Verma <priyanshuverma@outlook.in>
Date: Wed, 4 Dec 2024 07:58:41 +0000
Subject: [PATCH] fix: edge runtime for studio

---
 packages/studio/src/app/page.tsx             |  2 ++
 packages/studio/src/components/dashboard.tsx | 12 ++++++++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/studio/src/app/page.tsx b/packages/studio/src/app/page.tsx
index 361858f..f2e24d9 100644
--- a/packages/studio/src/app/page.tsx
+++ b/packages/studio/src/app/page.tsx
@@ -3,6 +3,8 @@ import Dashboard from "@/components/dashboard";
 import AuthSplash from "@/components/splash";
 import Footer from "@/components/footer";
 
+export const runtime = "edge";
+
 export default async function Home() {
   const cookieStore = await cookies();
   const serverURL = cookieStore.get("server_url");
diff --git a/packages/studio/src/components/dashboard.tsx b/packages/studio/src/components/dashboard.tsx
index a54625a..5c48c02 100644
--- a/packages/studio/src/components/dashboard.tsx
+++ b/packages/studio/src/components/dashboard.tsx
@@ -1,5 +1,5 @@
 "use client";
-import React from "react";
+import React, { useEffect, useState } from "react";
 
 import {
   Card,
@@ -22,7 +22,8 @@ import { SkeletonOverviewChart } from "@/components/skeletons/skeleton-overview-
 import { SkeletonRecentEvents } from "@/components/skeletons/skeleton-recent-events";
 import { SkeletonDataTable } from "@/components/skeletons/skeleton-data-table";
 
-const Dashboard: React.FC = () => {
+const Dashboard = () => {
+  const [isClient, setIsClient] = useState(false);
   const { data, isLoading, error, refetch, fetchStatus } = useAnalyticsData();
 
   const calculatePercentageChange = (current: number, previous: number) => {
@@ -30,6 +31,13 @@ const Dashboard: React.FC = () => {
     return ((current - previous) / previous) * 100;
   };
 
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
+  if (!isClient) {
+    return null;
+  }
+
   return (
     <div className="flex-1 space-y-4 p-4 md:p-8 pt-6">
       <div className="flex flex-col md:flex-row items-center justify-between space-y-2 md:space-y-0">