reduce retyping types

Author: borisno2

examples/blog/app/admin/[[...admin]]/page.tsx

@@ -1,26 +1,12 @@
 import { AdminUI } from "@opensaas/ui";
-import { getAdminContext } from "@opensaas/ui/server";
 import type { ServerActionInput } from "@opensaas/ui/server";
-import { getContext } from "@opensaas/core";
-import { PrismaClient } from "@prisma/client";
 import config from "../../../opensaas.config";
-
-// Create Prisma client singleton
-const globalForPrisma = globalThis as unknown as {
-  prisma: PrismaClient | undefined;
-};
-
-const prisma = globalForPrisma.prisma ?? new PrismaClient();
-
-if (process.env.NODE_ENV !== "production") {
-  globalForPrisma.prisma = prisma;
-}
+import { getContext } from "@/lib/context";
 
 // User-defined wrapper function for server actions
 async function serverAction(props: ServerActionInput) {
   "use server";
-  const session = config.session ? await config.session.getSession() : null;
-  const context = await getContext(config, prisma, session);
+  const context = await getContext();
   return await context.serverAction(props);
 }
 
@@ -36,11 +22,11 @@ interface AdminPageProps {
 export default async function AdminPage({ params, searchParams }: AdminPageProps) {
   const resolvedParams = await params;
   const resolvedSearchParams = await searchParams;
-  const adminContext = await getAdminContext(config, prisma);
 
   return (
     <AdminUI
-      context={adminContext}
+      context={await getContext()}
+      config={config}
       params={resolvedParams.admin}
       searchParams={resolvedSearchParams}
       basePath="/admin"

examples/custom-field/app/admin/[[...admin]]/page.tsx

@@ -1,26 +1,12 @@
 import { AdminUI } from "@opensaas/ui";
-import { getAdminContext } from "@opensaas/ui/server";
 import type { ServerActionInput } from "@opensaas/ui/server";
-import { getContext } from "@opensaas/core";
-import { PrismaClient } from "@prisma/client";
 import config from "../../../opensaas.config";
-
-// Create Prisma client singleton
-const globalForPrisma = globalThis as unknown as {
-  prisma: PrismaClient | undefined;
-};
-
-const prisma = globalForPrisma.prisma ?? new PrismaClient();
-
-if (process.env.NODE_ENV !== "production") {
-  globalForPrisma.prisma = prisma;
-}
+import { getContext } from "@/lib/context";
 
 // User-defined wrapper function for server actions
 async function serverAction(props: ServerActionInput) {
   "use server";
-  const session = config.session ? await config.session.getSession() : null;
-  const context = await getContext(config, prisma, session);
+  const context = await getContext();
   return await context.serverAction(props);
 }
 
@@ -36,11 +22,12 @@ interface AdminPageProps {
 export default async function AdminPage({ params, searchParams }: AdminPageProps) {
   const resolvedParams = await params;
   const resolvedSearchParams = await searchParams;
-  const adminContext = await getAdminContext(config, prisma);
+  const adminContext = await getContext();
 
   return (
     <AdminUI
       context={adminContext}
+      config={config}
       params={resolvedParams.admin}
       searchParams={resolvedSearchParams}
       basePath="/admin"

packages/ui/src/components/AdminUI.tsx

@@ -3,11 +3,12 @@ import { Navigation } from "./Navigation.js";
 import { Dashboard } from "./Dashboard.js";
 import { ListView } from "./ListView.js";
 import { ItemForm } from "./ItemForm.js";
-import type { AdminContext, ServerActionInput } from "../server/types.js";
-import { getListKeyFromUrl } from "@opensaas/core";
+import type { ServerActionInput } from "../server/types.js";
+import { AccessContext, getListKeyFromUrl, OpenSaaSConfig } from "@opensaas/core";
 
-export interface AdminUIProps {
-  context: AdminContext;
+export interface AdminUIProps<TPrisma> {
+  context: AccessContext<TPrisma>;
+  config: OpenSaaSConfig;
   params?: string[];
   searchParams?: { [key: string]: string | string[] | undefined };
   basePath?: string;
@@ -25,13 +26,14 @@ export interface AdminUIProps {
  * - [list, 'create'] → ItemForm (create)
  * - [list, id] → ItemForm (edit)
  */
-export function AdminUI({
+export function AdminUI<TPrisma>({
   context,
+  config,
   params = [],
   searchParams = {},
   basePath = "/admin",
   serverAction,
-}: AdminUIProps) {
+}: AdminUIProps<TPrisma>) {
   // Parse route from params
   const [urlSegment, action] = params;
 
@@ -46,12 +48,13 @@ export function AdminUI({
 
   if (!listKey) {
     // Dashboard
-    content = <Dashboard context={context} basePath={basePath} />;
+    content = <Dashboard context={context} config={config} basePath={basePath} />;
   } else if (action === "create") {
     // Create form
     content = (
       <ItemForm
         context={context}
+        config={config}
         listKey={listKey}
         mode="create"
         basePath={basePath}
@@ -63,6 +66,7 @@ export function AdminUI({
     content = (
       <ItemForm
         context={context}
+        config={config}
         listKey={listKey}
         mode="edit"
         itemId={action}
@@ -78,6 +82,7 @@ export function AdminUI({
     content = (
       <ListView
         context={context}
+        config={config}
         listKey={listKey}
         basePath={basePath}
         search={search}
@@ -88,7 +93,7 @@ export function AdminUI({
 
   return (
     <div className="flex min-h-screen bg-background">
-      <Navigation context={context} basePath={basePath} currentPath={currentPath} />
+      <Navigation context={context} config={config} basePath={basePath} currentPath={currentPath} />
       <main className="flex-1 overflow-y-auto">{content}</main>
     </div>
   );

packages/ui/src/components/Dashboard.tsx

@@ -1,30 +1,30 @@
 import Link from "next/link";
 import { formatListName } from "../lib/utils.js";
-import type { AdminContext } from "../server/types.js";
-import { getDbKey, getUrlKey } from "@opensaas/core";
+import { AccessContext, getDbKey, getUrlKey, OpenSaaSConfig } from "@opensaas/core";
 import { Card, CardContent, CardHeader, CardTitle } from "../primitives/card.js";
 
-export interface DashboardProps {
-  context: AdminContext;
+export interface DashboardProps<TPrisma> {
+  context: AccessContext<TPrisma>;
+  config: OpenSaaSConfig;
   basePath?: string;
 }
 
 /**
  * Dashboard landing page showing all available lists
  * Server Component
  */
-export async function Dashboard({
+export async function Dashboard<TPrisma>({
   context,
+  config,
   basePath = "/admin",
-}: DashboardProps) {
-  const lists = Object.keys(context.config.lists || {});
+}: DashboardProps<TPrisma>) {
+  const lists = Object.keys(config.lists || {});
 
   // Get counts for each list
   const listCounts = await Promise.all(
     lists.map(async (listKey) => {
       try {
-        const dbContext = context.context as any;
-        const count = await dbContext.db[getDbKey(listKey)]?.count();
+        const count = await context.db[getDbKey(listKey)]?.count();
         return { listKey, count: count || 0 };
       } catch (error) {
         console.error(`Failed to get count for ${listKey}:`, error);
@@ -43,8 +43,7 @@ export async function Dashboard({
       {lists.length === 0 ? (
         <Card className="p-12 text-center">
           <p className="text-muted-foreground">
-            No lists configured. Add lists to your opensaas.config.ts to get
-            started.
+            No lists configured. Add lists to your opensaas.config.ts to get started.
           </p>
         </Card>
       ) : (

packages/ui/src/components/ItemForm.tsx

@@ -2,11 +2,12 @@ import * as React from "react";
 import Link from "next/link";
 import { ItemFormClient } from "./ItemFormClient.js";
 import { formatListName } from "../lib/utils.js";
-import type { AdminContext, ServerActionInput } from "../server/types.js";
-import { getDbKey, getUrlKey } from "@opensaas/core";
+import type { ServerActionInput } from "../server/types.js";
+import { AccessContext, getDbKey, getUrlKey, OpenSaaSConfig } from "@opensaas/core";
 
-export interface ItemFormProps {
-  context: AdminContext;
+export interface ItemFormProps<TPrisma> {
+  context: AccessContext<TPrisma>;
+  config: OpenSaaSConfig;
   listKey: string;
   mode: "create" | "edit";
   itemId?: string;
@@ -19,15 +20,16 @@ export interface ItemFormProps {
  * Item form component - create or edit an item
  * Server Component that fetches data and sets up actions
  */
-export async function ItemForm({
+export async function ItemForm<TPrisma>({
   context,
+  config,
   listKey,
   mode,
   itemId,
   basePath = "/admin",
   serverAction,
-}: ItemFormProps) {
-  const listConfig = context.config.lists[listKey];
+}: ItemFormProps<TPrisma>) {
+  const listConfig = config.lists[listKey];
   const urlKey = getUrlKey(listKey);
 
   if (!listConfig) {
@@ -90,12 +92,12 @@ export async function ItemForm({
       if (ref) {
         // Parse ref format: "ListName.fieldName"
         const relatedListName = ref.split(".")[0];
-        const relatedListConfig = context.config.lists[relatedListName];
+        const relatedListConfig = config.lists[relatedListName];
 
         if (relatedListConfig) {
           try {
-            const dbContext = context.context as any;
-            const relatedItems = await dbContext.db[getDbKey(relatedListName)].findMany({});
+            const dbContext = context.db;
+            const relatedItems = await dbContext[getDbKey(relatedListName)].findMany({});
 
             // Use 'name' field as label if it exists, otherwise use 'id'
             relationshipData[fieldName] = relatedItems.map((item: any) => ({

packages/ui/src/components/ListView.tsx

@@ -1,11 +1,17 @@
 import Link from "next/link";
 import { ListViewClient } from "./ListViewClient.js";
 import { formatListName } from "../lib/utils.js";
-import type { AdminContext } from "../server/types.js";
-import { getDbKey, getUrlKey, type PrismaClientLike } from "@opensaas/core";
+import {
+  AccessContext,
+  getDbKey,
+  getUrlKey,
+  OpenSaaSConfig,
+  type PrismaClientLike,
+} from "@opensaas/core";
 
 export interface ListViewProps<TPrisma extends PrismaClientLike = PrismaClientLike> {
-  context: AdminContext<TPrisma>;
+  context: AccessContext<TPrisma>;
+  config: OpenSaaSConfig;
   listKey: string;
   basePath?: string;
   columns?: string[];
@@ -20,6 +26,7 @@ export interface ListViewProps<TPrisma extends PrismaClientLike = PrismaClientLi
  */
 export async function ListView<TPrisma extends PrismaClientLike = PrismaClientLike>({
   context,
+  config,
   listKey,
   basePath = "/admin",
   columns,
@@ -29,7 +36,7 @@ export async function ListView<TPrisma extends PrismaClientLike = PrismaClientLi
 }: ListViewProps<TPrisma>) {
   const key = getDbKey(listKey);
   const urlKey = getUrlKey(listKey);
-  const listConfig = context.config.lists[listKey];
+  const listConfig = config.lists[listKey];
 
   if (!listConfig) {
     return (
@@ -48,7 +55,7 @@ export async function ListView<TPrisma extends PrismaClientLike = PrismaClientLi
   let total = 0;
 
   try {
-    const dbContext = context.context.db;
+    const dbContext = context.db;
     if (!dbContext || !dbContext[key]) {
       throw new Error(`Context for ${listKey} not found`);
     }

packages/ui/src/components/Navigation.tsx

@@ -1,10 +1,10 @@
 import Link from "next/link";
 import { formatListName } from "../lib/utils.js";
-import type { AdminContext } from "../server/types.js";
-import { getUrlKey } from "@opensaas/core";
+import { AccessContext, getUrlKey, OpenSaaSConfig } from "@opensaas/core";
 
-export interface NavigationProps {
-  context: AdminContext;
+export interface NavigationProps<TPrisma> {
+  context: AccessContext<TPrisma>;
+  config: OpenSaaSConfig;
   basePath?: string;
   currentPath?: string;
 }
@@ -13,12 +13,13 @@ export interface NavigationProps {
  * Navigation sidebar showing all lists
  * Server Component
  */
-export function Navigation({
+export function Navigation<TPrisma>({
   context,
+  config,
   basePath = "/admin",
   currentPath = "",
-}: NavigationProps) {
-  const lists = Object.keys(context.config.lists || {});
+}: NavigationProps<TPrisma>) {
+  const lists = Object.keys(config.lists || {});
 
   return (
     <nav className="w-64 border-r border-border bg-card h-screen sticky top-0 flex flex-col">
@@ -78,7 +79,9 @@ export function Navigation({
           <div className="flex items-center space-x-3">
             <div className="h-8 w-8 rounded-full bg-primary/10 flex items-center justify-center">
               <span className="text-sm font-medium">
-                {String((context.session.data as Record<string, unknown>)?.name)?.[0]?.toUpperCase() || "?"}
+                {String(
+                  (context.session.data as Record<string, unknown>)?.name,
+                )?.[0]?.toUpperCase() || "?"}
               </span>
             </div>
             <div className="flex-1 min-w-0">