show resources table, check org access, and handle redirects on root

src/app/[orgId]/resources/page.tsx

@@ -1,14 +1,45 @@
-export default async function Page() {
+import { internal } from "@app/api";
+import { authCookieHeader } from "@app/api/cookies";
+import ResourcesTable, { ResourceRow } from "./components/ResourcesTable";
+import { AxiosResponse } from "axios";
+import { ListResourcesResponse } from "@server/routers/resource";
+
+type ResourcesPageProps = {
+    params: { orgId: string };
+};
+
+export default async function Page({ params }: ResourcesPageProps) {
+    let resources: ListResourcesResponse["resources"] = [];
+    try {
+        const res = await internal.get<AxiosResponse<ListResourcesResponse>>(
+            `/org/${params.orgId}/resources`,
+            authCookieHeader(),
+        );
+        resources = res.data.data.resources;
+    } catch (e) {
+        console.error("Error fetching resources", e);
+    }
+
+    const resourceRows: ResourceRow[] = resources.map((resource) => {
+        return {
+            id: resource.resourceId.toString(),
+            name: resource.name,
+            orgId: params.orgId,
+        };
+    });
+
     return (
         <>
-            <div className="space-y-0.5 select-none">
+            <div className="space-y-0.5 select-none mb-6">
                 <h2 className="text-2xl font-bold tracking-tight">
                     Manage Resources
                 </h2>
                 <p className="text-muted-foreground">
-                    Create secure proxies to your private resources.
+                    Create secure proxies to your private applications.
                 </p>
             </div>
+
+            <ResourcesTable resources={resourceRows} orgId={params.orgId} />
         </>
     );
 }