shishantbiswas/bknd
1
0
Fork 0
mirror of https://github.com/shishantbiswas/bknd.git synced 2026-03-15 20:17:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
feat: introduce new modes helpers
This commit is contained in:
dswbx
2025-10-24 15:09:05 +02:00
committed by GitHub
parent b89c090f87 22e43c2523
commit aedae8e757
29 changed files with 585 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/package.json
View File

@@ -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",

1
app/src/App.ts
View File

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

9
app/src/adapter/astro/astro.adapter.ts
View File

@@ -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);
};

12
app/src/adapter/bun/bun.adapter.ts
View File

@@ -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,
),

8
app/src/adapter/bun/index.ts
View File

@@ -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();
}

33
app/src/adapter/index.ts
View File

@@ -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 & {
app?: Omit<BkndConfig, "app"> | ((args: Args) => MaybePromise<Omit<BkndConfig<Args>, "app">>);
export type BkndConfig<Args = any, Additional = {}> = Merge<
CreateAppConfig & {
app?:
| Merge<Omit<BkndConfig, "app"> & Additional>
| ((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);
}

6
app/src/adapter/nextjs/nextjs.adapter.ts
View File

@@ -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);

10
app/src/adapter/node/index.ts
View File

@@ -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");
}

11
app/src/adapter/node/node.adapter.ts
View File

@@ -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 ?? { env: process.env },
args,
);
}
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(
{

6
app/src/adapter/react-router/react-router.adapter.ts
View File

@@ -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);

4
app/src/core/types.ts
View File

@@ -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];
};

2
app/src/index.ts
View File

@@ -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";

19
app/src/media/api/MediaApi.ts
View File

@@ -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],

49
app/src/modes/code.ts Normal file
View File

@@ -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,
},
},
};
},
};
}

88
app/src/modes/hybrid.ts Normal file
View File

@@ -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,
},
},
};
},
};
}

3
app/src/modes/index.ts Normal file
View File

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

183
app/src/modes/shared.ts Normal file
View File

@@ -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,
};
}

7
app/src/modules/db/DbModuleManager.ts
View File

@@ -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

4
app/src/ui/client/api/use-api.ts
View File

@@ -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
}

18
app/src/ui/client/api/use-entity.ts
View File

@@ -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);

61
app/src/ui/components/table/DataTable.tsx
View File

@@ -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) {
return <>Showing 1 row</>;
const start = Math.max(perPage * (page - 1), 1);
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,23 +302,36 @@ 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 },
{ 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: 1, Icon: TbChevronsLeft, disabled: current === 1 },
{ enabled: true, value: current - 1, Icon: TbChevronLeft, disabled: current === 1 },
{
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(
(nav, key) =>
nav.enabled && (
<button
role="button"
type="button"
key={key}
disabled={nav.disabled}
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"
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"
onClick={() => {
const page = nav.value;
const safePage = page < 1 ? 1 : page > total ? total : page;
@@ -312,5 +340,6 @@ const TableNav: React.FC<TableNavProps> = ({ current, total, onClick }: TableNav
>
<nav.Icon />
</button>
));
),
);
};

37
app/src/ui/elements/media/DropzoneContainer.tsx
View File

@@ -77,7 +77,9 @@ export function DropzoneContainer({
});
const $q = infinite
? useApiInfiniteQuery(selectApi, {})
? useApiInfiniteQuery(selectApi, {
pageSize,
})
: useApiQuery(selectApi, {
enabled: initialItems !== false && !initialItems,
revalidateOnFocus: false,
@@ -108,14 +110,33 @@ 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}
key={key}
getUploadInfo={getUploadInfo}
handleDelete={handleDelete}
/* onUploaded={refresh}
onDeleted={refresh} */
autoUpload
initialItems={_initialItems}
footer={
@@ -123,16 +144,14 @@ export function DropzoneContainer({
"setSize" in $q && (
<Footer
items={_initialItems.length}
length={Math.min(
$q._data?.[0]?.body.meta.count ?? 0,
_initialItems.length + pageSize,
)}
length={placeholderLength}
onFirstVisible={() => $q.setSize($q.size + 1)}
/>
)
}
{...props}
/>
</>
);
}

5
app/src/ui/hooks/use-search.ts
View File

@@ -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 =

14
app/src/ui/modules/data/components/EntityForm.tsx
View File

@@ -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) => (
<option key={option.value} value={option.value}>
{field.getOptions().map((option, i) => (
<option key={`${option.value}-${i}`} value={option.value}>
{option.label}
</option>
))}

2
app/src/ui/modules/data/components/fields/EntityRelationalFormField.tsx
View File

@@ -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 }>();

2
app/src/ui/routes/data/data.$entity.index.tsx
View File

@@ -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}`,
}),

4
app/tsconfig.json
View File

@@ -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": [

41
app/vite.dev.ts
View File

@@ -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,6 +22,7 @@ $console.debug("Using db type", dbType);
let dbUrl = import.meta.env.VITE_DB_URL ?? ":memory:";
const example = import.meta.env.VITE_EXAMPLE;
async function loadExampleConfig() {
if (example) {
const configPath = `.configs/${example}.json`;
$console.debug("Loading config from", configPath);
@@ -28,9 +30,11 @@ if (example) {
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;

4
docs/content/docs/(documentation)/extending/plugins.mdx
View File

@@ -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"