Initial Commit

app/(platform)/(dashboard)/organization/[organizationId]/activity/_components/activity-list.tsx

@@ -0,0 +1,44 @@
+import { auth } from "@clerk/nextjs";
+import { redirect } from "next/navigation";
+
+import { db } from "@/lib/db";
+import { ActivityItem } from "@/components/activity-item";
+import { Skeleton } from "@/components/ui/skeleton";
+
+export const ActivityList = async () => {
+  const { orgId } = auth();
+
+  if (!orgId) redirect("/select-org");
+
+  const auditLogs = await db.auditLog.findMany({
+    where: {
+      orgId,
+    },
+    orderBy: {
+      createdAt: "desc",
+    },
+  });
+
+  return (
+    <ol className="space-y-4 mt-4">
+      <p className="hidden last:block text-xs text-center text-muted-foreground">
+        No activity found inside this organization
+      </p>
+      {auditLogs.map((log) => (
+        <ActivityItem key={log.id} data={log} />
+      ))}
+    </ol>
+  );
+};
+
+ActivityList.Skeleton = function ActivityListSkeleton() {
+  return (
+    <ol className="space-y-4 mt-4">
+      <Skeleton className="w-[80%] h-14" />
+      <Skeleton className="w-[50%] h-14" />
+      <Skeleton className="w-[70%] h-14" />
+      <Skeleton className="w-[80%] h-14" />
+      <Skeleton className="w-[75%] h-14" />
+    </ol>
+  );
+};

app/(platform)/(dashboard)/organization/[organizationId]/activity/page.tsx

@@ -0,0 +1,23 @@
+import { Suspense } from "react";
+
+import { Separator } from "@/components/ui/separator";
+
+import { Info } from "../_components/info";
+import { ActivityList } from "./_components/activity-list";
+import { checkSubscription } from "@/lib/subscription";
+
+const ActivityPage = async () => {
+  const isPro = await checkSubscription();
+
+  return (
+    <div className="w-full">
+      <Info isPro={isPro} />
+      <Separator className="my-2" />
+      <Suspense fallback={<ActivityList.Skeleton />}>
+        <ActivityList />
+      </Suspense>
+    </div>
+  );
+};
+
+export default ActivityPage;