Merge pull request #285 from bknd-io/feat/mode-helpers

feat: introduce new modes helpers

app/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "sideEffects": false,
   "bin": "./dist/cli/index.js",
-  "version": "0.18.0",
+  "version": "0.18.1",
   "description": "Lightweight Firebase/Supabase alternative built to run anywhere — incl. Next.js, React Router, Astro, Cloudflare, Bun, Node, AWS Lambda & more.",
   "homepage": "https://bknd.io",
   "repository": {
@@ -65,7 +65,7 @@
     "hono": "4.8.3",
     "json-schema-library": "10.0.0-rc7",
     "json-schema-to-ts": "^3.1.1",
-    "jsonv-ts": "0.8.4",
+    "jsonv-ts": "0.8.5",
     "kysely": "0.27.6",
     "lodash-es": "^4.17.21",
     "oauth4webapi": "^2.11.1",

app/src/App.ts

@@ -385,6 +385,7 @@ export class App<
             }
          }
       }
+      await this.options?.manager?.onModulesBuilt?.(ctx);
    }
 }
 

app/src/adapter/astro/astro.adapter.ts

@@ -8,12 +8,15 @@ export type AstroBkndConfig<Env = AstroEnv> = FrameworkBkndConfig<Env>;
 
 export async function getApp<Env = AstroEnv>(
    config: AstroBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = import.meta.env as Env,
 ) {
-   return await createFrameworkApp(config, args ?? import.meta.env);
+   return await createFrameworkApp(config, args);
 }
 
-export function serve<Env = AstroEnv>(config: AstroBkndConfig<Env> = {}, args: Env = {} as Env) {
+export function serve<Env = AstroEnv>(
+   config: AstroBkndConfig<Env> = {},
+   args: Env = import.meta.env as Env,
+) {
    return async (fnArgs: TAstro) => {
       return (await getApp(config, args)).fetch(fnArgs.request);
    };

app/src/adapter/bun/bun.adapter.ts

@@ -12,7 +12,7 @@ export type BunBkndConfig<Env = BunEnv> = RuntimeBkndConfig<Env> & Omit<ServeOpt
 
 export async function createApp<Env = BunEnv>(
    { distPath, serveStatic: _serveStatic, ...config }: BunBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = Bun.env as Env,
 ) {
    const root = path.resolve(distPath ?? "./node_modules/bknd/dist", "static");
    registerLocalMediaAdapter();
@@ -26,18 +26,18 @@ export async function createApp<Env = BunEnv>(
             }),
          ...config,
       },
-      args ?? (process.env as Env),
+      args,
    );
 }
 
 export function createHandler<Env = BunEnv>(
    config: BunBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = Bun.env as Env,
 ) {
    let app: App | undefined;
    return async (req: Request) => {
       if (!app) {
-         app = await createApp(config, args ?? (process.env as Env));
+         app = await createApp(config, args);
       }
       return app.fetch(req);
    };
@@ -54,9 +54,10 @@ export function serve<Env = BunEnv>(
       buildConfig,
       adminOptions,
       serveStatic,
+      beforeBuild,
       ...serveOptions
    }: BunBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = Bun.env as Env,
 ) {
    Bun.serve({
       ...serveOptions,
@@ -71,6 +72,7 @@ export function serve<Env = BunEnv>(
             adminOptions,
             distPath,
             serveStatic,
+            beforeBuild,
          },
          args,
       ),

app/src/adapter/bun/index.ts

@@ -1,3 +1,11 @@
 export * from "./bun.adapter";
 export * from "../node/storage";
 export * from "./connection/BunSqliteConnection";
+
+export async function writer(path: string, content: string) {
+   await Bun.write(path, content);
+}
+
+export async function reader(path: string) {
+   return await Bun.file(path).text();
+}

app/src/adapter/index.ts

@@ -6,18 +6,23 @@ import {
    guessMimeType,
    type MaybePromise,
    registries as $registries,
+   type Merge,
 } from "bknd";
 import { $console } from "bknd/utils";
 import type { Context, MiddlewareHandler, Next } from "hono";
 import type { AdminControllerOptions } from "modules/server/AdminController";
 import type { Manifest } from "vite";
 
-export type BkndConfig<Args = any> = CreateAppConfig & {
+export type BkndConfig<Args = any, Additional = {}> = Merge<
-   app?: Omit<BkndConfig, "app"> | ((args: Args) => MaybePromise<Omit<BkndConfig<Args>, "app">>);
+   CreateAppConfig & {
-   onBuilt?: (app: App) => MaybePromise<void>;
+      app?:
-   beforeBuild?: (app?: App, registries?: typeof $registries) => MaybePromise<void>;
+         | Merge<Omit<BkndConfig, "app"> & Additional>
-   buildConfig?: Parameters<App["build"]>[0];
+         | ((args: Args) => MaybePromise<Merge<Omit<BkndConfig<Args>, "app"> & Additional>>);
-};
+      onBuilt?: (app: App) => MaybePromise<void>;
+      beforeBuild?: (app?: App, registries?: typeof $registries) => MaybePromise<void>;
+      buildConfig?: Parameters<App["build"]>[0];
+   } & Additional
+>;
 
 export type FrameworkBkndConfig<Args = any> = BkndConfig<Args>;
 
@@ -51,11 +56,10 @@ export async function makeConfig<Args = DefaultArgs>(
    return { ...rest, ...additionalConfig };
 }
 
-// a map that contains all apps by id
 export async function createAdapterApp<Config extends BkndConfig = BkndConfig, Args = DefaultArgs>(
    config: Config = {} as Config,
    args?: Args,
-): Promise<App> {
+): Promise<{ app: App; config: BkndConfig<Args> }> {
    await config.beforeBuild?.(undefined, $registries);
 
    const appConfig = await makeConfig(config, args);
@@ -65,34 +69,37 @@ export async function createAdapterApp<Config extends BkndConfig = BkndConfig, A
          connection = config.connection;
       } else {
          const sqlite = (await import("bknd/adapter/sqlite")).sqlite;
-         const conf = appConfig.connection ?? { url: ":memory:" };
+         const conf = appConfig.connection ?? { url: "file:data.db" };
          connection = sqlite(conf) as any;
          $console.info(`Using ${connection!.name} connection`, conf.url);
       }
       appConfig.connection = connection;
    }
 
-   return App.create(appConfig);
+   return {
+      app: App.create(appConfig),
+      config: appConfig,
+   };
 }
 
 export async function createFrameworkApp<Args = DefaultArgs>(
    config: FrameworkBkndConfig = {},
    args?: Args,
 ): Promise<App> {
-   const app = await createAdapterApp(config, args);
+   const { app, config: appConfig } = await createAdapterApp(config, args);
 
    if (!app.isBuilt()) {
       if (config.onBuilt) {
          app.emgr.onEvent(
             App.Events.AppBuiltEvent,
             async () => {
-               await config.onBuilt?.(app);
+               await appConfig.onBuilt?.(app);
             },
             "sync",
          );
       }
 
-      await config.beforeBuild?.(app, $registries);
+      await appConfig.beforeBuild?.(app, $registries);
       await app.build(config.buildConfig);
    }
 
@@ -103,7 +110,7 @@ export async function createRuntimeApp<Args = DefaultArgs>(
    { serveStatic, adminOptions, ...config }: RuntimeBkndConfig<Args> = {},
    args?: Args,
 ): Promise<App> {
-   const app = await createAdapterApp(config, args);
+   const { app, config: appConfig } = await createAdapterApp(config, args);
 
    if (!app.isBuilt()) {
       app.emgr.onEvent(
@@ -116,7 +123,7 @@ export async function createRuntimeApp<Args = DefaultArgs>(
                app.modules.server.get(path, handler);
             }
 
-            await config.onBuilt?.(app);
+            await appConfig.onBuilt?.(app);
             if (adminOptions !== false) {
                app.registerAdminController(adminOptions);
             }
@@ -124,7 +131,7 @@ export async function createRuntimeApp<Args = DefaultArgs>(
          "sync",
       );
 
-      await config.beforeBuild?.(app, $registries);
+      await appConfig.beforeBuild?.(app, $registries);
       await app.build(config.buildConfig);
    }
 

app/src/adapter/nextjs/nextjs.adapter.ts

@@ -9,9 +9,9 @@ export type NextjsBkndConfig<Env = NextjsEnv> = FrameworkBkndConfig<Env> & {
 
 export async function getApp<Env = NextjsEnv>(
    config: NextjsBkndConfig<Env>,
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
-   return await createFrameworkApp(config, args ?? (process.env as Env));
+   return await createFrameworkApp(config, args);
 }
 
 function getCleanRequest(req: Request, cleanRequest: NextjsBkndConfig["cleanRequest"]) {
@@ -39,7 +39,7 @@ function getCleanRequest(req: Request, cleanRequest: NextjsBkndConfig["cleanRequ
 
 export function serve<Env = NextjsEnv>(
    { cleanRequest, ...config }: NextjsBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
    return async (req: Request) => {
       const app = await getApp(config, args);

app/src/adapter/node/index.ts

@@ -1,3 +1,13 @@
+import { readFile, writeFile } from "node:fs/promises";
+
 export * from "./node.adapter";
 export * from "./storage";
 export * from "./connection/NodeSqliteConnection";
+
+export async function writer(path: string, content: string) {
+   await writeFile(path, content);
+}
+
+export async function reader(path: string) {
+   return await readFile(path, "utf-8");
+}

app/src/adapter/node/node.adapter.ts

@@ -17,7 +17,7 @@ export type NodeBkndConfig<Env = NodeEnv> = RuntimeBkndConfig<Env> & {
 
 export async function createApp<Env = NodeEnv>(
    { distPath, relativeDistPath, ...config }: NodeBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
    const root = path.relative(
       process.cwd(),
@@ -33,19 +33,18 @@ export async function createApp<Env = NodeEnv>(
          serveStatic: serveStatic({ root }),
          ...config,
       },
-      // @ts-ignore
+      args,
-      args ?? { env: process.env },
    );
 }
 
 export function createHandler<Env = NodeEnv>(
    config: NodeBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
    let app: App | undefined;
    return async (req: Request) => {
       if (!app) {
-         app = await createApp(config, args ?? (process.env as Env));
+         app = await createApp(config, args);
       }
       return app.fetch(req);
    };
@@ -53,7 +52,7 @@ export function createHandler<Env = NodeEnv>(
 
 export function serve<Env = NodeEnv>(
    { port = $config.server.default_port, hostname, listener, ...config }: NodeBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
    honoServe(
       {

app/src/adapter/react-router/react-router.adapter.ts

@@ -8,14 +8,14 @@ export type ReactRouterBkndConfig<Env = ReactRouterEnv> = FrameworkBkndConfig<En
 
 export async function getApp<Env = ReactRouterEnv>(
    config: ReactRouterBkndConfig<Env>,
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
-   return await createFrameworkApp(config, args ?? process.env);
+   return await createFrameworkApp(config, args);
 }
 
 export function serve<Env = ReactRouterEnv>(
    config: ReactRouterBkndConfig<Env> = {},
-   args: Env = {} as Env,
+   args: Env = process.env as Env,
 ) {
    return async (fnArgs: ReactRouterFunctionArgs) => {
       return (await getApp(config, args)).fetch(fnArgs.request);

app/src/core/types.ts

@@ -6,3 +6,7 @@ export interface Serializable<Class, Json extends object = object> {
 export type MaybePromise<T> = T | Promise<T>;
 
 export type PartialRec<T> = { [P in keyof T]?: PartialRec<T[P]> };
+
+export type Merge<T> = {
+   [K in keyof T]: T[K];
+};

app/src/index.ts

@@ -41,7 +41,7 @@ export { getSystemMcp } from "modules/mcp/system-mcp";
 /**
  * Core
  */
-export type { MaybePromise } from "core/types";
+export type { MaybePromise, Merge } from "core/types";
 export { Exception, BkndError } from "core/errors";
 export { isDebug, env } from "core/env";
 export { type PrimaryFieldType, config, type DB, type AppEntity } from "core/config";

app/src/media/api/MediaApi.ts

@@ -1,11 +1,14 @@
 import type { FileListObject } from "media/storage/Storage";
 import {
    type BaseModuleApiOptions,
+   type FetchPromise,
+   type ResponseObject,
    ModuleApi,
    type PrimaryFieldType,
    type TInput,
 } from "modules/ModuleApi";
 import type { ApiFetcher } from "Api";
+import type { DB, FileUploadedEventData } from "bknd";
 
 export type MediaApiOptions = BaseModuleApiOptions & {
    upload_fetcher: ApiFetcher;
@@ -67,14 +70,14 @@ export class MediaApi extends ModuleApi<MediaApiOptions> {
       return new Headers();
    }
 
-   protected uploadFile(
+   protected uploadFile<T extends FileUploadedEventData>(
       body: File | Blob | ReadableStream | Buffer<ArrayBufferLike>,
       opts?: {
          filename?: string;
          path?: TInput;
          _init?: Omit<RequestInit, "body">;
       },
-   ) {
+   ): FetchPromise<ResponseObject<T>> {
       const headers = {
          "Content-Type": "application/octet-stream",
          ...(opts?._init?.headers || {}),
@@ -106,10 +109,10 @@ export class MediaApi extends ModuleApi<MediaApiOptions> {
          throw new Error("Invalid filename");
       }
 
-      return this.post(opts?.path ?? ["upload", name], body, init);
+      return this.post<T>(opts?.path ?? ["upload", name], body, init);
    }
 
-   async upload(
+   async upload<T extends FileUploadedEventData>(
       item: Request | Response | string | File | Blob | ReadableStream | Buffer<ArrayBufferLike>,
       opts: {
          filename?: string;
@@ -124,12 +127,12 @@ export class MediaApi extends ModuleApi<MediaApiOptions> {
          if (!res.ok || !res.body) {
             throw new Error("Failed to fetch file");
          }
-         return this.uploadFile(res.body, opts);
+         return this.uploadFile<T>(res.body, opts);
       } else if (item instanceof Response) {
          if (!item.body) {
             throw new Error("Invalid response");
          }
-         return this.uploadFile(item.body, {
+         return this.uploadFile<T>(item.body, {
             ...(opts ?? {}),
             _init: {
                ...(opts._init ?? {}),
@@ -141,7 +144,7 @@ export class MediaApi extends ModuleApi<MediaApiOptions> {
          });
       }
 
-      return this.uploadFile(item, opts);
+      return this.uploadFile<T>(item, opts);
    }
 
    async uploadToEntity(
@@ -153,7 +156,7 @@ export class MediaApi extends ModuleApi<MediaApiOptions> {
          _init?: Omit<RequestInit, "body">;
          fetcher?: typeof fetch;
       },
-   ) {
+   ): Promise<ResponseObject<FileUploadedEventData & { result: DB["media"] }>> {
       return this.upload(item, {
          ...opts,
          path: ["entity", entity, id, field],

app/src/modes/code.ts

@@ -0,0 +1,49 @@
+import type { BkndConfig } from "bknd/adapter";
+import { makeModeConfig, type BkndModeConfig } from "./shared";
+import { $console } from "bknd/utils";
+
+export type BkndCodeModeConfig<Args = any> = BkndModeConfig<Args>;
+
+export type CodeMode<AdapterConfig extends BkndConfig> = AdapterConfig extends BkndConfig<
+   infer Args
+>
+   ? BkndModeConfig<Args, AdapterConfig>
+   : never;
+
+export function code<Args>(config: BkndCodeModeConfig<Args>): BkndConfig<Args> {
+   return {
+      ...config,
+      app: async (args) => {
+         const {
+            config: appConfig,
+            plugins,
+            isProd,
+            syncSchemaOptions,
+         } = await makeModeConfig(config, args);
+
+         if (appConfig?.options?.mode && appConfig?.options?.mode !== "code") {
+            $console.warn("You should not set a different mode than `db` when using code mode");
+         }
+
+         return {
+            ...appConfig,
+            options: {
+               ...appConfig?.options,
+               mode: "code",
+               plugins,
+               manager: {
+                  // skip validation in prod for a speed boost
+                  skipValidation: isProd,
+                  onModulesBuilt: async (ctx) => {
+                     if (!isProd && syncSchemaOptions.force) {
+                        $console.log("[code] syncing schema");
+                        await ctx.em.schema().sync(syncSchemaOptions);
+                     }
+                  },
+                  ...appConfig?.options?.manager,
+               },
+            },
+         };
+      },
+   };
+}

app/src/modes/hybrid.ts

@@ -0,0 +1,88 @@
+import type { BkndConfig } from "bknd/adapter";
+import { makeModeConfig, type BkndModeConfig } from "./shared";
+import { getDefaultConfig, type MaybePromise, type ModuleConfigs, type Merge } from "bknd";
+import type { DbModuleManager } from "modules/db/DbModuleManager";
+import { invariant, $console } from "bknd/utils";
+
+export type BkndHybridModeOptions = {
+   /**
+    * Reader function to read the configuration from the file system.
+    * This is required for hybrid mode to work.
+    */
+   reader?: (path: string) => MaybePromise<string>;
+   /**
+    * Provided secrets to be merged into the configuration
+    */
+   secrets?: Record<string, any>;
+};
+
+export type HybridBkndConfig<Args = any> = BkndModeConfig<Args, BkndHybridModeOptions>;
+export type HybridMode<AdapterConfig extends BkndConfig> = AdapterConfig extends BkndConfig<
+   infer Args
+>
+   ? BkndModeConfig<Args, Merge<BkndHybridModeOptions & AdapterConfig>>
+   : never;
+
+export function hybrid<Args>({
+   configFilePath = "bknd-config.json",
+   ...rest
+}: HybridBkndConfig<Args>): BkndConfig<Args> {
+   return {
+      ...rest,
+      config: undefined,
+      app: async (args) => {
+         const {
+            config: appConfig,
+            isProd,
+            plugins,
+            syncSchemaOptions,
+         } = await makeModeConfig(
+            {
+               ...rest,
+               configFilePath,
+            },
+            args,
+         );
+
+         if (appConfig?.options?.mode && appConfig?.options?.mode !== "db") {
+            $console.warn("You should not set a different mode than `db` when using hybrid mode");
+         }
+         invariant(
+            typeof appConfig.reader === "function",
+            "You must set the `reader` option when using hybrid mode",
+         );
+
+         let fileConfig: ModuleConfigs;
+         try {
+            fileConfig = JSON.parse(await appConfig.reader!(configFilePath)) as ModuleConfigs;
+         } catch (e) {
+            const defaultConfig = (appConfig.config ?? getDefaultConfig()) as ModuleConfigs;
+            await appConfig.writer!(configFilePath, JSON.stringify(defaultConfig, null, 2));
+            fileConfig = defaultConfig;
+         }
+
+         return {
+            ...(appConfig as any),
+            beforeBuild: async (app) => {
+               if (app && !isProd) {
+                  const mm = app.modules as DbModuleManager;
+                  mm.buildSyncConfig = syncSchemaOptions;
+               }
+            },
+            config: fileConfig,
+            options: {
+               ...appConfig?.options,
+               mode: isProd ? "code" : "db",
+               plugins,
+               manager: {
+                  // skip validation in prod for a speed boost
+                  skipValidation: isProd,
+                  // secrets are required for hybrid mode
+                  secrets: appConfig.secrets,
+                  ...appConfig?.options?.manager,
+               },
+            },
+         };
+      },
+   };
+}

app/src/modes/index.ts

@@ -0,0 +1,3 @@
+export * from "./code";
+export * from "./hybrid";
+export * from "./shared";

app/src/modes/shared.ts

@@ -0,0 +1,183 @@
+import type { AppPlugin, BkndConfig, MaybePromise, Merge } from "bknd";
+import { syncTypes, syncConfig } from "bknd/plugins";
+import { syncSecrets } from "plugins/dev/sync-secrets.plugin";
+import { invariant, $console } from "bknd/utils";
+
+export type BkndModeOptions = {
+   /**
+    * Whether the application is running in production.
+    */
+   isProduction?: boolean;
+   /**
+    * Writer function to write the configuration to the file system
+    */
+   writer?: (path: string, content: string) => MaybePromise<void>;
+   /**
+    * Configuration file path
+    */
+   configFilePath?: string;
+   /**
+    * Types file path
+    * @default "bknd-types.d.ts"
+    */
+   typesFilePath?: string;
+   /**
+    * Syncing secrets options
+    */
+   syncSecrets?: {
+      /**
+       * Whether to enable syncing secrets
+       */
+      enabled?: boolean;
+      /**
+       * Output file path
+       */
+      outFile?: string;
+      /**
+       * Format of the output file
+       * @default "env"
+       */
+      format?: "json" | "env";
+      /**
+       * Whether to include secrets in the output file
+       * @default false
+       */
+      includeSecrets?: boolean;
+   };
+   /**
+    * Determines whether to automatically sync the schema if not in production.
+    * @default true
+    */
+   syncSchema?: boolean | { force?: boolean; drop?: boolean };
+};
+
+export type BkndModeConfig<Args = any, Additional = {}> = BkndConfig<
+   Args,
+   Merge<BkndModeOptions & Additional>
+>;
+
+export async function makeModeConfig<
+   Args = any,
+   Config extends BkndModeConfig<Args> = BkndModeConfig<Args>,
+>(_config: Config, args: Args) {
+   const appConfig = typeof _config.app === "function" ? await _config.app(args) : _config.app;
+
+   const config = {
+      ..._config,
+      ...appConfig,
+   } as Omit<Config, "app">;
+
+   if (typeof config.isProduction !== "boolean") {
+      $console.warn(
+         "You should set `isProduction` option when using managed modes to prevent accidental issues",
+      );
+   }
+
+   invariant(
+      typeof config.writer === "function",
+      "You must set the `writer` option when using managed modes",
+   );
+
+   const { typesFilePath, configFilePath, writer, syncSecrets: syncSecretsOptions } = config;
+
+   const isProd = config.isProduction;
+   const plugins = appConfig?.options?.plugins ?? ([] as AppPlugin[]);
+   const syncSchemaOptions =
+      typeof config.syncSchema === "object"
+         ? config.syncSchema
+         : {
+              force: config.syncSchema !== false,
+              drop: true,
+           };
+
+   if (!isProd) {
+      if (typesFilePath) {
+         if (plugins.some((p) => p.name === "bknd-sync-types")) {
+            throw new Error("You have to unregister the `syncTypes` plugin");
+         }
+         plugins.push(
+            syncTypes({
+               enabled: true,
+               includeFirstBoot: true,
+               write: async (et) => {
+                  try {
+                     await config.writer?.(typesFilePath, et.toString());
+                  } catch (e) {
+                     console.error(`Error writing types to"${typesFilePath}"`, e);
+                  }
+               },
+            }) as any,
+         );
+      }
+
+      if (configFilePath) {
+         if (plugins.some((p) => p.name === "bknd-sync-config")) {
+            throw new Error("You have to unregister the `syncConfig` plugin");
+         }
+         plugins.push(
+            syncConfig({
+               enabled: true,
+               includeFirstBoot: true,
+               write: async (config) => {
+                  try {
+                     await writer?.(configFilePath, JSON.stringify(config, null, 2));
+                  } catch (e) {
+                     console.error(`Error writing config to "${configFilePath}"`, e);
+                  }
+               },
+            }) as any,
+         );
+      }
+
+      if (syncSecretsOptions?.enabled) {
+         if (plugins.some((p) => p.name === "bknd-sync-secrets")) {
+            throw new Error("You have to unregister the `syncSecrets` plugin");
+         }
+
+         let outFile = syncSecretsOptions.outFile;
+         const format = syncSecretsOptions.format ?? "env";
+         if (!outFile) {
+            outFile = ["env", !syncSecretsOptions.includeSecrets && "example", format]
+               .filter(Boolean)
+               .join(".");
+         }
+
+         plugins.push(
+            syncSecrets({
+               enabled: true,
+               includeFirstBoot: true,
+               write: async (secrets) => {
+                  const values = Object.fromEntries(
+                     Object.entries(secrets).map(([key, value]) => [
+                        key,
+                        syncSecretsOptions.includeSecrets ? value : "",
+                     ]),
+                  );
+
+                  try {
+                     if (format === "env") {
+                        await writer?.(
+                           outFile,
+                           Object.entries(values)
+                              .map(([key, value]) => `${key}=${value}`)
+                              .join("\n"),
+                        );
+                     } else {
+                        await writer?.(outFile, JSON.stringify(values, null, 2));
+                     }
+                  } catch (e) {
+                     console.error(`Error writing secrets to "${outFile}"`, e);
+                  }
+               },
+            }) as any,
+         );
+      }
+   }
+
+   return {
+      config,
+      isProd,
+      plugins,
+      syncSchemaOptions,
+   };
+}

app/src/modules/db/DbModuleManager.ts

@@ -70,6 +70,9 @@ export class DbModuleManager extends ModuleManager {
    private readonly _booted_with?: "provided" | "partial";
    private _stable_configs: ModuleConfigs | undefined;
 
+   // config used when syncing database
+   public buildSyncConfig: { force?: boolean; drop?: boolean } = { force: true };
+
    constructor(connection: Connection, options?: Partial<ModuleManagerOptions>) {
       let initial = {} as InitialModuleConfigs;
       let booted_with = "partial" as any;
@@ -393,7 +396,7 @@ export class DbModuleManager extends ModuleManager {
 
                const version_before = this.version();
                const [_version, _configs] = await migrate(version_before, result.configs.json, {
-                  db: this.db
+                  db: this.db,
                });
 
                this._version = _version;
@@ -463,7 +466,7 @@ export class DbModuleManager extends ModuleManager {
             this.logger.log("db sync requested");
 
             // sync db
-            await ctx.em.schema().sync({ force: true });
+            await ctx.em.schema().sync(this.buildSyncConfig);
             state.synced = true;
 
             // save

app/src/ui/client/api/use-api.ts

@@ -35,7 +35,7 @@ export const useApiInfiniteQuery = <
    RefineFn extends (data: ResponseObject<Data>) => unknown = (data: ResponseObject<Data>) => Data,
 >(
    fn: (api: Api, page: number) => FetchPromise<Data>,
-   options?: SWRConfiguration & { refine?: RefineFn },
+   options?: SWRConfiguration & { refine?: RefineFn; pageSize?: number },
 ) => {
    const [endReached, setEndReached] = useState(false);
    const api = useApi();
@@ -47,7 +47,7 @@ export const useApiInfiniteQuery = <
    // @ts-ignore
    const swr = useSWRInfinite<RefinedData>(
       (index, previousPageData: any) => {
-         if (previousPageData && !previousPageData.length) {
+         if (index > 0 && previousPageData && previousPageData.length < (options?.pageSize ?? 0)) {
             setEndReached(true);
             return null; // reached the end
          }

app/src/ui/client/api/use-entity.ts

@@ -1,8 +1,14 @@
-import type { DB, PrimaryFieldType, EntityData, RepoQueryIn } from "bknd";
+import type {
+   DB,
+   PrimaryFieldType,
+   EntityData,
+   RepoQueryIn,
+   RepositoryResult,
+   ResponseObject,
+   ModuleApi,
+} from "bknd";
 import { objectTransform, encodeSearch } from "bknd/utils";
-import type { RepositoryResult } from "data/entities";
 import type { Insertable, Selectable, Updateable } from "kysely";
-import type { FetchPromise, ModuleApi, ResponseObject } from "modules/ModuleApi";
 import useSWR, { type SWRConfiguration, type SWRResponse, mutate } from "swr";
 import { type Api, useApi } from "ui/client";
 
@@ -108,7 +114,7 @@ export function makeKey(
    );
 }
 
-interface UseEntityQueryReturn<
+export interface UseEntityQueryReturn<
    Entity extends keyof DB | string,
    Id extends PrimaryFieldType | undefined = undefined,
    Data = Entity extends keyof DB ? Selectable<DB[Entity]> : EntityData,
@@ -136,11 +142,11 @@ export const useEntityQuery = <
    const fetcher = () => read(query ?? {});
 
    type T = Awaited<ReturnType<typeof fetcher>>;
-   const swr = useSWR<T>(options?.enabled === false ? null : key, fetcher as any, {
+   const swr = useSWR(options?.enabled === false ? null : key, fetcher as any, {
       revalidateOnFocus: false,
       keepPreviousData: true,
       ...options,
-   });
+   }) as ReturnType<typeof useSWR<T>>;
 
    const mutateFn = async (id?: PrimaryFieldType) => {
       const entityKey = makeKey(api, entity as string, id);

app/src/ui/components/table/DataTable.tsx

@@ -53,7 +53,7 @@ export type DataTableProps<Data> = {
 };
 
 export function DataTable<Data extends Record<string, any> = Record<string, any>>({
-   data = [],
+   data: _data = [],
    columns,
    checkable,
    onClickRow,
@@ -71,11 +71,14 @@ export function DataTable<Data extends Record<string, any> = Record<string, any>
    renderValue,
    onClickNew,
 }: DataTableProps<Data>) {
+   const hasTotal = !!total;
+   const data = Array.isArray(_data) ? _data.slice(0, perPage) : _data;
    total = total || data?.length || 0;
    page = page || 1;
 
    const select = columns && columns.length > 0 ? columns : Object.keys(data?.[0] || {});
    const pages = Math.max(Math.ceil(total / perPage), 1);
+   const hasNext = hasTotal ? pages > page : (_data?.length || 0) > perPage;
    const CellRender = renderValue || CellValue;
 
    return (
@@ -202,7 +205,7 @@ export function DataTable<Data extends Record<string, any> = Record<string, any>
                   perPage={perPage}
                   page={page}
                   items={data?.length || 0}
-                  total={total}
+                  total={hasTotal ? total : undefined}
                />
             </div>
             <div className="flex flex-row gap-2 md:gap-10 items-center">
@@ -222,11 +225,17 @@ export function DataTable<Data extends Record<string, any> = Record<string, any>
                   </div>
                )}
                <div className="text-primary/40">
-                  Page {page} of {pages}
+                  Page {page}
+                  {hasTotal ? <> of {pages}</> : ""}
                </div>
                {onClickPage && (
                   <div className="flex flex-row gap-1.5">
-                     <TableNav current={page} total={pages} onClick={onClickPage} />
+                     <TableNav
+                        current={page}
+                        total={hasTotal ? pages : page + (hasNext ? 1 : 0)}
+                        onClick={onClickPage}
+                        hasLast={hasTotal}
+                     />
                   </div>
                )}
             </div>
@@ -268,17 +277,23 @@ const SortIndicator = ({
 };
 
 const TableDisplay = ({ perPage, page, items, total }) => {
-   if (total === 0) {
+   if (items === 0 && page === 1) {
       return <>No rows to show</>;
    }
 
-   if (total === 1) {
+   const start = Math.max(perPage * (page - 1), 1);
-      return <>Showing 1 row</>;
+
+   if (!total) {
+      return (
+         <>
+            Showing {start}-{perPage * (page - 1) + items}
+         </>
+      );
    }
 
    return (
       <>
-         Showing {perPage * (page - 1) + 1}-{perPage * (page - 1) + items} of {total} rows
+         Showing {start}-{perPage * (page - 1) + items} of {total} rows
       </>
    );
 };
@@ -287,30 +302,44 @@ type TableNavProps = {
    current: number;
    total: number;
    onClick?: (page: number) => void;
+   hasLast?: boolean;
 };
 
-const TableNav: React.FC<TableNavProps> = ({ current, total, onClick }: TableNavProps) => {
+const TableNav: React.FC<TableNavProps> = ({
+   current,
+   total,
+   onClick,
+   hasLast = true,
+}: TableNavProps) => {
    const navMap = [
-      { value: 1, Icon: TbChevronsLeft, disabled: current === 1 },
+      { enabled: true, value: 1, Icon: TbChevronsLeft, disabled: current === 1 },
-      { value: current - 1, Icon: TbChevronLeft, disabled: current === 1 },
+      { enabled: true, value: current - 1, Icon: TbChevronLeft, disabled: current === 1 },
-      { value: current + 1, Icon: TbChevronRight, disabled: current === total },
+      {
-      { value: total, Icon: TbChevronsRight, disabled: current === total },
+         enabled: true,
+         value: current + 1,
+         Icon: TbChevronRight,
+         disabled: current === total,
+      },
+      { enabled: hasLast, value: total, Icon: TbChevronsRight, disabled: current === total },
    ] as const;
 
-   return navMap.map((nav, key) => (
+   return navMap.map(
-      <button
+      (nav, key) =>
-         role="button"
+         nav.enabled && (
-         type="button"
+            <button
-         key={key}
+               role="button"
-         disabled={nav.disabled}
+               type="button"
-         className="px-2 py-2 border-muted border rounded-md enabled:link text-lg enabled:hover:bg-primary/5 text-primary/90 disabled:opacity-50 disabled:cursor-not-allowed"
+               key={key}
-         onClick={() => {
+               disabled={nav.disabled}
-            const page = nav.value;
+               className="px-2 py-2 border-muted border rounded-md enabled:link text-lg enabled:hover:bg-primary/5 text-primary/90 disabled:opacity-50 cursor-pointer disabled:cursor-not-allowed"
-            const safePage = page < 1 ? 1 : page > total ? total : page;
+               onClick={() => {
-            onClick?.(safePage);
+                  const page = nav.value;
-         }}
+                  const safePage = page < 1 ? 1 : page > total ? total : page;
-      >
+                  onClick?.(safePage);
-         <nav.Icon />
+               }}
-      </button>
+            >
-   ));
+               <nav.Icon />
+            </button>
+         ),
+   );
 };

app/src/ui/elements/media/DropzoneContainer.tsx

@@ -77,7 +77,9 @@ export function DropzoneContainer({
            });
 
    const $q = infinite
-      ? useApiInfiniteQuery(selectApi, {})
+      ? useApiInfiniteQuery(selectApi, {
+           pageSize,
+        })
       : useApiQuery(selectApi, {
            enabled: initialItems !== false && !initialItems,
            revalidateOnFocus: false,
@@ -108,31 +110,48 @@ export function DropzoneContainer({
       []) as MediaFieldSchema[];
    const _initialItems = mediaItemsToFileStates(actualItems, { baseUrl });
 
-   const key = id + JSON.stringify(_initialItems);
+   const key = id + JSON.stringify(initialItems);
+
+   // check if endpoint reeturns a total, then reaching end is easy
+   const total = "_data" in $q ? $q._data?.[0]?.body.meta.count : undefined;
+   let placeholderLength = 0;
+   if (infinite && "setSize" in $q) {
+      placeholderLength =
+         typeof total === "number"
+            ? total
+            : $q.endReached
+              ? _initialItems.length
+              : _initialItems.length + pageSize;
+
+      // in case there is no total, we overfetch but SWR don't reflect an empty result
+      // therefore we check if it stopped loading, but has a bigger page size than the total.
+      // if that's the case, we assume we reached the end.
+      if (!total && !$q.isValidating && pageSize * $q.size >= placeholderLength) {
+         placeholderLength = _initialItems.length;
+      }
+   }
+
    return (
-      <Dropzone
+      <>
-         key={id + key}
+         <Dropzone
-         getUploadInfo={getUploadInfo}
+            key={key}
-         handleDelete={handleDelete}
+            getUploadInfo={getUploadInfo}
-         /* onUploaded={refresh}
+            handleDelete={handleDelete}
-         onDeleted={refresh} */
+            autoUpload
-         autoUpload
+            initialItems={_initialItems}
-         initialItems={_initialItems}
+            footer={
-         footer={
+               infinite &&
-            infinite &&
+               "setSize" in $q && (
-            "setSize" in $q && (
+                  <Footer
-               <Footer
+                     items={_initialItems.length}
-                  items={_initialItems.length}
+                     length={placeholderLength}
-                  length={Math.min(
+                     onFirstVisible={() => $q.setSize($q.size + 1)}
-                     $q._data?.[0]?.body.meta.count ?? 0,
+                  />
-                     _initialItems.length + pageSize,
+               )
-                  )}
+            }
-                  onFirstVisible={() => $q.setSize($q.size + 1)}
+            {...props}
-               />
+         />
-            )
+      </>
-         }
-         {...props}
-      />
    );
 }
 

app/src/ui/hooks/use-search.ts

@@ -14,10 +14,6 @@ export function useSearch<Schema extends s.Schema = s.Schema>(
 ) {
    const searchString = useWouterSearch();
    const [location, navigate] = useLocation();
-   const [value, setValue] = useState<s.StaticCoerced<Schema>>(
-      options?.defaultValue ?? ({} as any),
-   );
-
    const defaults = useMemo(() => {
       return mergeObject(
          // @ts-ignore
@@ -25,6 +21,7 @@ export function useSearch<Schema extends s.Schema = s.Schema>(
          options?.defaultValue ?? {},
       );
    }, [JSON.stringify({ schema, dflt: options?.defaultValue })]);
+   const [value, setValue] = useState<s.StaticCoerced<Schema>>(defaults);
 
    useEffect(() => {
       const initial =

app/src/ui/modules/data/components/EntityForm.tsx

@@ -301,19 +301,9 @@ function EntityJsonFormField({
                onChange={handleUpdate}
                onBlur={fieldApi.handleBlur}
                minHeight="100"
-               /*required={field.isRequired()}*/
                {...props}
             />
          </Suspense>
-         {/*<Formy.Textarea
-            name={fieldApi.name}
-            id={fieldApi.name}
-            value={fieldApi.state.value}
-            onBlur={fieldApi.handleBlur}
-            onChange={handleUpdate}
-            required={field.isRequired()}
-            {...props}
-         />*/}
       </Formy.Group>
    );
 }
@@ -340,8 +330,8 @@ function EntityEnumFormField({
             {...props}
          >
             {!field.isRequired() && <option value="">- Select -</option>}
-            {field.getOptions().map((option) => (
+            {field.getOptions().map((option, i) => (
-               <option key={option.value} value={option.value}>
+               <option key={`${option.value}-${i}`} value={option.value}>
                   {option.label}
                </option>
             ))}

app/src/ui/modules/data/components/fields/EntityRelationalFormField.tsx

@@ -44,7 +44,7 @@ export function EntityRelationalFormField({
    const ref = useRef<any>(null);
    const $q = useEntityQuery(field.target(), undefined, {
       select: query.select,
-      limit: query.limit,
+      limit: query.limit + 1 /* overfetch for softscan=false */,
       offset: (query.page - 1) * query.limit,
    });
    const [_value, _setValue] = useState<{ id: number | undefined; [key: string]: any }>();

app/src/ui/routes/data/data.$entity.index.tsx

@@ -61,7 +61,7 @@ function DataEntityListImpl({ params }) {
       (api) =>
          api.data.readMany(entity?.name as any, {
             select: search.value.select,
-            limit: search.value.perPage,
+            limit: search.value.perPage + 1 /* overfetch for softscan=false */,
             offset: (search.value.page - 1) * search.value.perPage,
             sort: `${search.value.sort.dir === "asc" ? "" : "-"}${search.value.sort.by}`,
          }),

app/tsconfig.json

@@ -33,7 +33,9 @@
       "bknd": ["./src/index.ts"],
       "bknd/utils": ["./src/core/utils/index.ts"],
       "bknd/adapter": ["./src/adapter/index.ts"],
-      "bknd/client": ["./src/ui/client/index.ts"]
+      "bknd/adapter/*": ["./src/adapter/*/index.ts"],
+      "bknd/client": ["./src/ui/client/index.ts"],
+      "bknd/modes": ["./src/modes/index.ts"]
     }
   },
   "include": [

app/vite.dev.ts

@@ -1,4 +1,4 @@
-import { readFile } from "node:fs/promises";
+import { readFile, writeFile } from "node:fs/promises";
 import { serveStatic } from "@hono/node-server/serve-static";
 import { showRoutes } from "hono/dev";
 import { App, registries, type CreateAppConfig } from "./src";
@@ -9,6 +9,7 @@ import { $console } from "core/utils/console";
 import { createClient } from "@libsql/client";
 import util from "node:util";
 import { d1Sqlite } from "adapter/cloudflare/connection/D1Connection";
+import { slugify } from "./src/core/utils/strings";
 
 util.inspect.defaultOptions.depth = 5;
 registries.media.register("local", StorageLocalAdapter);
@@ -21,16 +22,19 @@ $console.debug("Using db type", dbType);
 let dbUrl = import.meta.env.VITE_DB_URL ?? ":memory:";
 
 const example = import.meta.env.VITE_EXAMPLE;
-if (example) {
+async function loadExampleConfig() {
-   const configPath = `.configs/${example}.json`;
+   if (example) {
-   $console.debug("Loading config from", configPath);
+      const configPath = `.configs/${example}.json`;
-   const exampleConfig = JSON.parse(await readFile(configPath, "utf-8"));
+      $console.debug("Loading config from", configPath);
-   config.config = exampleConfig;
+      const exampleConfig = JSON.parse(await readFile(configPath, "utf-8"));
-   dbUrl = `file:.configs/${example}.db`;
+      config.config = exampleConfig;
+      dbUrl = `file:.configs/${example}.db`;
+   }
 }
 
 switch (dbType) {
    case "libsql": {
+      await loadExampleConfig();
       $console.debug("Using libsql connection", dbUrl);
       const authToken = import.meta.env.VITE_DB_LIBSQL_TOKEN;
       config.connection = libsql(
@@ -43,15 +47,48 @@ switch (dbType) {
    }
    case "d1": {
       $console.debug("Using d1 connection");
+      const wranglerConfig = {
+         name: "vite-dev",
+         main: "src/index.ts",
+         compatibility_date: "2025-08-03",
+         compatibility_flags: ["nodejs_compat"],
+         d1_databases: [
+            {
+               binding: "DB",
+               database_name: "vite-dev",
+               database_id: "00000000-0000-0000-0000-000000000000",
+            },
+         ],
+         r2_buckets: [
+            {
+               binding: "BUCKET",
+               bucket_name: "vite-dev",
+            },
+         ],
+      };
+      let configPath = ".configs/vite.wrangler.json";
+      if (example) {
+         const name = slugify(example);
+         configPath = `.configs/${slugify(example)}.wrangler.json`;
+         const exists = await readFile(configPath, "utf-8");
+         if (!exists) {
+            wranglerConfig.name = name;
+            wranglerConfig.d1_databases[0]!.database_name = name;
+            wranglerConfig.d1_databases[0]!.database_id = crypto.randomUUID();
+            wranglerConfig.r2_buckets[0]!.bucket_name = name;
+            await writeFile(configPath, JSON.stringify(wranglerConfig, null, 2));
+         }
+      }
 
       const { getPlatformProxy } = await import("wrangler");
       const platformProxy = await getPlatformProxy({
-         configPath: "./vite.wrangler.json",
+         configPath,
       });
       config.connection = d1Sqlite({ binding: platformProxy.env.DB as any });
       break;
    }
    default: {
+      await loadExampleConfig();
       $console.debug("Using node-sqlite connection", dbUrl);
       config.connection = nodeSqlite({ url: dbUrl });
       break;

docs/content/docs/(documentation)/extending/plugins.mdx

@@ -167,6 +167,10 @@ export default {
 
 ### `cloudflareImageOptimization`
 
+<Callout type="info">
+  This plugin doesn't work on the development server, or on workers deployed with a `workers.dev` subdomain. It requires [Cloudflare Image transformations to be enabled](https://developers.cloudflare.com/images/get-started/#enable-transformations-on-your-zone) on your zone.
+</Callout>
+
 A plugin that add Cloudflare Image Optimization to your app's media storage.
 
 ```typescript title="bknd.config.ts"