dashboard: add retention and quick fix loading states

apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/page.tsx

@@ -3,15 +3,13 @@ import { OverviewFiltersButtons } from '@/components/overview/filters/overview-f
 import { OverviewFiltersDrawer } from '@/components/overview/filters/overview-filters-drawer';
 import ServerLiveCounter from '@/components/overview/live-counter';
 import { OverviewLiveHistogram } from '@/components/overview/overview-live-histogram';
-import { OverviewShare } from '@/components/overview/overview-share';
+import OverviewShareServer from '@/components/overview/overview-share';
 import OverviewTopDevices from '@/components/overview/overview-top-devices';
 import OverviewTopEvents from '@/components/overview/overview-top-events';
 import OverviewTopGeo from '@/components/overview/overview-top-geo';
 import OverviewTopPages from '@/components/overview/overview-top-pages';
 import OverviewTopSources from '@/components/overview/overview-top-sources';
 
-import { getShareByProjectId } from '@openpanel/db';
-
 import OverviewMetrics from '../../../../components/overview/overview-metrics';
 import { StickyBelowHeader } from './layout-sticky-below-header';
 import { OverviewReportRange } from './overview-sticky-header';
@@ -23,13 +21,12 @@ interface PageProps {
   };
 }
 
-export default async function Page({
+export default function Page({
   params: { organizationSlug, projectId },
 }: PageProps) {
-  const share = await getShareByProjectId(projectId);
-
   return (
-    <PageLayout title="Overview" organizationSlug={organizationSlug}>
+    <>
+      <PageLayout title="Overview" organizationSlug={organizationSlug} />
       <StickyBelowHeader>
         <div className="flex justify-between gap-2 p-4">
           <div className="flex gap-2">
@@ -38,12 +35,12 @@ export default async function Page({
           </div>
           <div className="flex gap-2">
             <ServerLiveCounter projectId={projectId} />
-            <OverviewShare data={share} />
+            <OverviewShareServer projectId={projectId} />
           </div>
         </div>
         <OverviewFiltersButtons />
       </StickyBelowHeader>
-      <div className="grid grid-cols-6 gap-4 p-4">
+      {/* <div className="grid grid-cols-6 gap-4 p-4">
         <div className="col-span-6">
           <OverviewLiveHistogram projectId={projectId} />
         </div>
@@ -53,7 +50,7 @@ export default async function Page({
         <OverviewTopDevices projectId={projectId} />
         <OverviewTopEvents projectId={projectId} />
         <OverviewTopGeo projectId={projectId} />
-      </div>
-    </PageLayout>
+      </div> */}
+    </>
   );
 }