firstly 0.3.0 → 0.4.1

package/esm/sqlAdmin/SqlAdminController.js

@@ -0,0 +1,23 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { BackendMethod, SqlDatabase } from 'remult';
+import { FF_Role } from '../core/common';
+import { Roles_SqlAdmin } from './Roles_SqlAdmin';
+export class SqlAdminController {
+    /** Optional override set by the `sqlAdmin()` module's `initApi`. Falls back to `SqlDatabase.getDb()`. */
+    static dp;
+    static async exec(cmd) {
+        const db = SqlAdminController.dp ?? SqlDatabase.getDb();
+        const start = performance.now();
+        const r = await db.execute(cmd);
+        const took = performance.now() - start;
+        return { r, took };
+    }
+}
+__decorate([
+    BackendMethod({ allowed: [Roles_SqlAdmin.SqlAdmin_Admin, FF_Role.FF_Role_Admin] })
+], SqlAdminController, "exec", null);

package/esm/sqlAdmin/index.d.ts

@@ -0,0 +1,6 @@
+import { Log } from '@kitql/helpers';
+export { Roles_SqlAdmin } from './Roles_SqlAdmin';
+export { SqlAdminController } from './SqlAdminController';
+export { default as SqlAdmin } from './ui/SqlAdmin.svelte';
+export declare const key = "sqlAdmin";
+export declare const log: Log;

package/esm/sqlAdmin/index.js

@@ -0,0 +1,6 @@
+import { Log } from '@kitql/helpers';
+export { Roles_SqlAdmin } from './Roles_SqlAdmin';
+export { SqlAdminController } from './SqlAdminController';
+export { default as SqlAdmin } from './ui/SqlAdmin.svelte';
+export const key = 'sqlAdmin';
+export const log = new Log(key);

package/esm/sqlAdmin/server/index.d.ts

@@ -0,0 +1,40 @@
+import type { SqlDatabase } from 'remult';
+import { Module } from 'remult/server';
+export type SqlAdminOptions = {
+    /**
+     * Override the SqlDatabase used to execute queries.
+     * Defaults to `SqlDatabase.getDb()` (the active Remult data provider).
+     */
+    dp?: () => SqlDatabase | Promise<SqlDatabase>;
+    /**
+     * The route where you mounted the `<SqlAdmin />` component.
+     * Used only for the AI hint logged on server start.
+     *
+     * @default '/sql/admin'
+     */
+    path?: string;
+};
+/**
+ * Drop-in SQL admin endpoint + companion `<SqlAdmin />` component (`firstly/sqlAdmin`).
+ *
+ * Gated by `Roles_SqlAdmin.SqlAdmin_Admin` (or the global `FF_Role.FF_Role_Admin`).
+ *
+ * @example
+ * ```ts
+ * import { remultApi } from 'remult/remult-sveltekit'
+ * import { sqlAdmin } from './'
+ *
+ * export const api = remultApi({
+ *   modules: [sqlAdmin()],
+ * })
+ * ```
+ *
+ * Then on any admin route:
+ * ```svelte
+ * <script>
+ *   import { SqlAdmin } from '..'
+ * </script>
+ * <SqlAdmin />
+ * ```
+ */
+export declare const sqlAdmin: (opts?: SqlAdminOptions) => Module<unknown>;

package/esm/sqlAdmin/server/index.js

@@ -0,0 +1,40 @@
+import { Module } from 'remult/server';
+import { yellow } from '@kitql/helpers';
+import { log } from '..';
+import { SqlAdminController } from '../SqlAdminController';
+/**
+ * Drop-in SQL admin endpoint + companion `<SqlAdmin />` component (`firstly/sqlAdmin`).
+ *
+ * Gated by `Roles_SqlAdmin.SqlAdmin_Admin` (or the global `FF_Role.FF_Role_Admin`).
+ *
+ * @example
+ * ```ts
+ * import { remultApi } from 'remult/remult-sveltekit'
+ * import { sqlAdmin } from './'
+ *
+ * export const api = remultApi({
+ *   modules: [sqlAdmin()],
+ * })
+ * ```
+ *
+ * Then on any admin route:
+ * ```svelte
+ * <script>
+ *   import { SqlAdmin } from '..'
+ * </script>
+ * <SqlAdmin />
+ * ```
+ */
+export const sqlAdmin = (opts) => {
+    const path = opts?.path ?? '/sql/admin';
+    return new Module({
+        key: 'sqlAdmin',
+        controllers: [SqlAdminController],
+        initApi: async () => {
+            if (opts?.dp) {
+                SqlAdminController.dp = await opts.dp();
+            }
+            log.info(`AI Hint: visit ${yellow(path)} to query raw SQL.`);
+        },
+    });
+};

package/esm/sqlAdmin/ui/SqlAdmin.svelte

@@ -0,0 +1,146 @@
+<script lang="ts">
+	/**
+	 * SQL Admin UI.
+	 *
+	 * Results are logged to the browser console as `for AI: <json rows>` after
+	 * each successful query - chrome-devtools / AI agents inspecting the page
+	 * can read them with `list_console_messages`.
+	 */
+	import { SqlAdminController } from '../SqlAdminController'
+
+	const defaultQuery = `SELECT *
+FROM "public"."users"
+LIMIT 10`
+
+	let sqlInput = $state(defaultQuery)
+	let result: any = $state()
+	let error = $state('')
+	let isLoading = $state(false)
+
+	const queries = {
+		default: { label: 'Default', sql: defaultQuery },
+		tables: {
+			label: 'Tables & Sizes',
+			sql: `SELECT
+  table_schema,
+  table_name,
+  pg_size_pretty(pg_total_relation_size(quote_ident(table_schema) || '.' || quote_ident(table_name))) as total_size,
+  pg_size_pretty(pg_table_size(quote_ident(table_schema) || '.' || quote_ident(table_name))) as data_size,
+  pg_size_pretty(pg_indexes_size(quote_ident(table_schema) || '.' || quote_ident(table_name))) as index_size
+FROM information_schema.tables
+WHERE table_schema IN ('public', 'ff_auth')
+ORDER BY pg_total_relation_size(quote_ident(table_schema) || '.' || quote_ident(table_name)) DESC;`,
+		},
+		indexes: {
+			label: 'Indexes',
+			sql: `SELECT *
+FROM pg_indexes
+WHERE schemaname = 'public'
+ORDER BY tablename, indexname`,
+		},
+		dbSize: {
+			label: 'Database Size',
+			sql: `SELECT
+  current_database() as database_name,
+  pg_size_pretty(pg_database_size(current_database())) as database_size`,
+		},
+	} as const
+
+	console.info(
+		'[firstly/SqlAdmin] AI Hint: results are also logged as "for AI:" JSON after each query.',
+	)
+
+	function setPresetQuery(queryId: keyof typeof queries) {
+		sqlInput = queries[queryId].sql
+	}
+
+	async function handleSubmit(e: Event) {
+		e.preventDefault()
+		try {
+			error = ''
+			isLoading = true
+			result = { ...(await SqlAdminController.exec(sqlInput)) }
+			console.info('for AI:', JSON.stringify(result.r.rows))
+			console.info('for humans:', result)
+		} catch (e) {
+			error = JSON.stringify(e, null, 2)
+		} finally {
+			isLoading = false
+		}
+	}
+
+	function getHeaders(rows: any[]): string[] {
+		if (!rows || rows.length === 0) return []
+		return Object.keys(rows[0])
+	}
+</script>
+
+<div class="flex flex-col gap-4">
+	<div class="flex flex-col gap-2">
+		<h2 class="text-2xl font-bold">SQL Admin</h2>
+		<p class="text-sm text-base-content/70">
+			Execute SQL queries directly on the database. Results are displayed below and also logged to the
+			browser console.
+		</p>
+	</div>
+	<div class="flex flex-wrap gap-2">
+		{#each Object.entries(queries) as [id, query] (id)}
+			<button class="btn btn-outline btn-sm" onclick={() => setPresetQuery(id as keyof typeof queries)}
+				>{query.label}</button
+			>
+		{/each}
+	</div>
+	<form onsubmit={handleSubmit} class="flex flex-col gap-4">
+		<fieldset class="fieldset">
+			<textarea
+				bind:value={sqlInput}
+				class="textarea h-52 w-full font-mono"
+				placeholder="Enter SQL command..."
+				disabled={isLoading}
+			></textarea>
+		</fieldset>
+		<div class="flex items-center gap-4">
+			<button type="submit" class="btn btn-primary" disabled={isLoading}>
+				{#if isLoading}<span class="loading loading-spinner"></span>{/if}
+				Execute SQL
+			</button>
+			{#if error}<pre class="alert flex-1 text-sm alert-error">{error.replaceAll(
+						'\\n',
+						'\n',
+					)}</pre>{/if}
+			{#if result}
+				<div class="alert flex flex-1 justify-between alert-success">
+					<span class="text-success-content">{result.took.toFixed(0)} ms</span>
+					<span class="text-success-content">{result.r.rowCount} rows</span>
+				</div>
+			{/if}
+		</div>
+	</form>
+	{#if result}
+		<div class="max-h-[600px] overflow-auto rounded-lg border border-base-300">
+			{#if result.r.rows && result.r.rows.length > 0}
+				<table class="table w-full table-zebra bg-base-200">
+					<thead class="sticky top-0 z-10 bg-base-300">
+						<tr
+							>{#each getHeaders(result.r.rows) as header, i (i)}<th>{header}</th>{/each}</tr
+						>
+					</thead>
+					<tbody>
+						{#each result.r.rows as row, r (r)}
+							<tr>
+								{#each Object.values(row) as cell, c (c)}
+									<td class="align-top">
+										{#if typeof cell === 'object'}<pre class="text-xs">{JSON.stringify(cell, null, 2)}</pre>
+										{:else}{cell === null ? 'null' : cell}{/if}
+									</td>
+								{/each}
+							</tr>
+						{/each}
+					</tbody>
+				</table>
+			{:else}
+				<div class="alert alert-info">No rows returned</div>
+			{/if}
+		</div>
+	{/if}
+</div>

package/esm/sqlAdmin/ui/SqlAdmin.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const SqlAdmin: import("svelte").Component<Record<string, never>, {}, "">;
+type SqlAdmin = ReturnType<typeof SqlAdmin>;
+export default SqlAdmin;

package/esm/svelte/FF_Repo.svelte.d.ts

@@ -1,5 +1,4 @@
 import { type ClassType, type FindOptions, type GroupByOptions, type GroupByResult, type MembersOnly, type NumericKeys, type QueryOptions, type Repository } from 'remult';
-import type { getLayoutStrict } from './customField';
 type EmptyAggregateResult = {
     $count: number;
 };
@@ -73,6 +72,5 @@ export declare class FF_Repo<Entity, QueryOptions extends QueryOptionsHelper<Ent
     } | undefined>;
     create(...args: Parameters<Repository<Entity>['create']>): Entity;
     delete(...args: Parameters<Repository<Entity>['delete']>): Promise<undefined>;
-    getLayout: getLayoutStrict<Entity>;
 }
 export {};

package/esm/svelte/FF_Repo.svelte.js

@@ -1,6 +1,6 @@
 import { repo as remultRepo, } from 'remult';
 import { Log } from '@kitql/helpers';
-import { tryCatch, tryCatchSync } from './';
+import { tryCatch, tryCatchSync } from '../core/tryCatch.js';
 export class FF_Repo {
     ent;
     #repo;
@@ -190,20 +190,4 @@ export class FF_Repo {
         }
         return this.loadingEnd();
     }
-    getLayout = (o) => {
-        const layout = this.metadata.options.ui?.getLayout?.(o);
-        if (layout) {
-            return layout;
-        }
-        return {
-            key: o?.key ?? 'default',
-            type: o?.type ?? 'grid',
-            groups: [
-                {
-                    key: o?.key ?? 'default',
-                    fields: this.#repo.fields.toArray().filter((c) => c.apiUpdateAllowed()),
-                },
-            ],
-        };
-    };
 }

package/esm/svelte/helpers/debounce.js

@@ -2,6 +2,6 @@ export const debounce = (fn, delay = 444) => {
     let timeout;
     return (...args) => {
         clearTimeout(timeout);
-        timeout = setTimeout(() => fn(...args), delay);
+        timeout = setTimeout(fn, delay, ...args);
     };
 };

package/esm/svelte/index.d.ts

@@ -1,28 +1,6 @@
-import type { CellMetadata, getLayout } from './customField';
-import { default as FF_Cell_Display } from './FF_Cell_Display.svelte';
-import { default as FF_Cell } from './FF_Cell.svelte';
-import { default as FF_Config } from './FF_Config.svelte';
-import { default as FF_Form } from './FF_Form.svelte';
-import { default as FF_Grid } from './FF_Grid.svelte';
-import { default as FF_Layout } from './FF_Layout.svelte';
-export type { FieldTheme, FormTheme, GridTheme, Theme, EditTheme, DisplayTheme, } from './ff_Config.svelte.js';
-export { getDynamicCustomField, getTheme, setDynamicCustomField, setTheme, getClasses, daisyTheme, defaultTheme, emptyTheme, FF_Theme, } from './ff_Config.svelte.js';
-export { FF_Grid, FF_Form, FF_Config, FF_Layout, FF_Cell, FF_Cell_Display };
-export type { DynamicCustomField, FieldGroup } from './customField';
 export { FF_Repo } from './FF_Repo.svelte.js';
-export { tryCatch, tryCatchSync } from './tryCatch';
-export { overwriteOptions, deepMerge, isOfType } from './helpers';
-export { dialog } from './dialog/dialog';
 export { SP } from './class/SP.svelte';
 export type { ParamDefinition } from './class/SP.svelte';
 export { initRemultSvelteReactivity } from './initRemultSvelteReactivity';
-declare module 'remult' {
-    interface FieldOptions<entityType = unknown, valueType = unknown> {
-        ui?: CellMetadata<valueType, entityType>['ui'];
-    }
-    interface EntityOptions<entityType> {
-        ui?: {
-            getLayout?: getLayout<entityType>;
-        };
-    }
-}
+export { default as Icon } from './ui/Icon.svelte';
+export { LibIcon_Empty, LibIcon_Forbidden, LibIcon_ChevronDown, LibIcon_ChevronUp, LibIcon_ChevronLeft, LibIcon_ChevronRight, LibIcon_Search, LibIcon_Check, LibIcon_MultiCheck, LibIcon_Add, LibIcon_MultiAdd, LibIcon_Edit, LibIcon_Eye, LibIcon_EyeOff, LibIcon_Delete, LibIcon_Cross, LibIcon_Save, LibIcon_Man, LibIcon_Woman, LibIcon_Send, LibIcon_Load, LibIcon_Settings, LibIcon_Sort, LibIcon_SortAsc, LibIcon_SortDesc, } from './ui/LibIcon.js';

package/esm/svelte/index.js

@@ -1,25 +1,5 @@
-import { default as FF_Cell_Display } from './FF_Cell_Display.svelte';
-import { default as FF_Cell } from './FF_Cell.svelte';
-import { default as FF_Config } from './FF_Config.svelte';
-import { default as FF_Form } from './FF_Form.svelte';
-import { default as FF_Grid } from './FF_Grid.svelte';
-import { default as FF_Layout } from './FF_Layout.svelte';
-export { getDynamicCustomField, getTheme, setDynamicCustomField, setTheme, getClasses, daisyTheme, defaultTheme, emptyTheme, FF_Theme, } from './ff_Config.svelte.js';
-export { FF_Grid, FF_Form, FF_Config, FF_Layout, FF_Cell, FF_Cell_Display };
 export { FF_Repo } from './FF_Repo.svelte.js';
-export { tryCatch, tryCatchSync } from './tryCatch';
-export { overwriteOptions, deepMerge, isOfType } from './helpers';
-export { dialog } from './dialog/dialog';
 export { SP } from './class/SP.svelte';
 export { initRemultSvelteReactivity } from './initRemultSvelteReactivity';
-// - [ ] Try to pnpm pack to see what css is needed.
-//   - [ ] let's look at the data-ff-xxx story ?
-//   - [ ] how lib defaults should be configured ?
-//   - [ ] What deault css should be provided to the user ?
-// - [ ] Add fform in readonly mode (readonly / edit / insert ?)
-// - [ ] Add Filter Fields
-// - [ ] Add actions form (cancel button to form, global error, ...)
-// - [x] Create a dedicated FF_Dialog
-//   - [ ] switch to data-ff-dialog (https://www.melt-ui.com/docs/builders/dialog example with non tailwind)
-// - [ ] Create a [crud] demo ? a [crud]/[detail] demo ?
-// - [ ] Add Toast ?
+export { default as Icon } from './ui/Icon.svelte';
+export { LibIcon_Empty, LibIcon_Forbidden, LibIcon_ChevronDown, LibIcon_ChevronUp, LibIcon_ChevronLeft, LibIcon_ChevronRight, LibIcon_Search, LibIcon_Check, LibIcon_MultiCheck, LibIcon_Add, LibIcon_MultiAdd, LibIcon_Edit, LibIcon_Eye, LibIcon_EyeOff, LibIcon_Delete, LibIcon_Cross, LibIcon_Save, LibIcon_Man, LibIcon_Woman, LibIcon_Send, LibIcon_Load, LibIcon_Settings, LibIcon_Sort, LibIcon_SortAsc, LibIcon_SortDesc, } from './ui/LibIcon.js';

package/esm/{ui → svelte/ui}/Icon.svelte

@@ -25,7 +25,7 @@
 	export let size: string | number = '1.5rem'
 
 	export let caption: string | undefined = undefined
-	const rmvWarning = caption
+	void caption
 
 	/**
 	 * By default, svg are not rendered on the server side.

package/esm/virtual/StateDemoEnum.d.ts

@@ -1,6 +1,6 @@
-import { BaseEnum } from '../internals/BaseEnum';
-import type { BaseEnumOptions } from '../internals/BaseEnum';
-import '../ui/LibIcon';
+import { BaseEnum } from '../core/BaseEnum';
+import type { BaseEnumOptions } from '../core/BaseEnum';
+import '../svelte/ui/LibIcon';
 export declare class StateDemoEnum extends BaseEnum {
     static CHECK: StateDemoEnum;
     static EDIT: StateDemoEnum;

package/esm/virtual/StateDemoEnum.js

@@ -6,9 +6,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 var StateDemoEnum_1;
 import { ValueListFieldType } from 'remult';
-import { BaseEnum } from '../internals/BaseEnum';
-import '../ui/LibIcon';
-import { LibIcon_Add, LibIcon_Delete, LibIcon_Edit } from '../ui/LibIcon';
+import { BaseEnum } from '../core/BaseEnum';
+import '../svelte/ui/LibIcon';
+import { LibIcon_Add, LibIcon_Delete, LibIcon_Edit } from '../svelte/ui/LibIcon';
 let StateDemoEnum = class StateDemoEnum extends BaseEnum {
     static { StateDemoEnum_1 = this; }
     static CHECK = new StateDemoEnum_1('CHECK', {

package/esm/virtual/UIEntity.js

@@ -42,7 +42,6 @@ __decorate([
         required: true,
         caption: "Nom de l'utilisateur",
         placeholder: 'Jean-Yves',
-        suffix: 'SUF!',
     })
 ], UIEntity.prototype, "username", void 0);
 __decorate([
@@ -71,7 +70,7 @@ __decorate([
     Fields.boolean({ allowNull: true })
 ], UIEntity.prototype, "isSubContractor", void 0);
 __decorate([
-    Fields.number({ allowNull: true, suffix: '%' })
+    Fields.number({ allowNull: true })
 ], UIEntity.prototype, "rate", void 0);
 __decorate([
     Fields.date({ allowNull: true, allowApiUpdate: false })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "firstly",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "type": "module",
   "description": "Firstly, an opinionated Remult setup!",
   "funding": "https://github.com/sponsors/jycouet",
@@ -16,7 +16,7 @@
   },
   "peerDependencies": {
     "@sveltejs/kit": ">=1.0.0 <3.0.0",
-    "remult": ">=3.3.2",
+    "remult": ">=3.3.7",
     "svelte": ">=5"
   },
   "peerDependenciesMeta": {
@@ -31,40 +31,25 @@
     }
   },
   "dependencies": {
-    "@clack/prompts": "0.11.0",
-    "@kitql/internals": "0.11.0",
-    "@layerstack/svelte-actions": "1.0.0",
     "@layerstack/utils": "1.0.0",
     "@mdi/js": "7.4.47",
-    "@types/nodemailer": "7.0.2",
-    "@melt-ui/svelte": "0.86.6",
+    "@types/nodemailer": "8.0.0",
     "clsx": "2.1.1",
     "cron": "4.4.0",
-    "daisyui": "5.5.3",
     "esm-env": "1.2.2",
-    "nodemailer": "7.0.4",
-    "svelecte": "5.3.0",
+    "nodemailer": "8.0.5",
     "tailwind-merge": "3.5.0",
-    "tailwindcss": "4.1.14",
+    "tailwindcss": "4.2.2",
     "vite-plugin-kit-routes": "1.0.3",
-    "vite-plugin-stripper": "0.10.0"
+    "vite-plugin-stripper": "0.10.1"
   },
   "sideEffects": false,
-  "bin": "./esm/bin/cmd.js",
   "exports": {
     ".": {
       "types": "./esm/index.d.ts",
       "svelte": "./esm/index.js",
       "default": "./esm/index.js"
     },
-    "./internals": {
-      "types": "./esm/internals/index.d.ts",
-      "default": "./esm/internals/index.js"
-    },
-    "./server": {
-      "types": "./esm/server/index.d.ts",
-      "default": "./esm/server/index.js"
-    },
     "./svelte": {
       "types": "./esm/svelte/index.d.ts",
       "svelte": "./esm/svelte/index.js",
@@ -74,9 +59,6 @@
       "types": "./esm/vite/index.d.ts",
       "default": "./esm/vite/index.js"
     },
-    "./bin": {
-      "default": "./esm/bin/cmd.js"
-    },
     "./formats": {
       "types": "./esm/formats/index.d.ts",
       "default": "./esm/formats/index.js"
@@ -116,6 +98,15 @@
     "./carbone/server": {
       "types": "./esm/carbone/server/index.d.ts",
       "default": "./esm/carbone/server/index.js"
+    },
+    "./sqlAdmin": {
+      "types": "./esm/sqlAdmin/index.d.ts",
+      "svelte": "./esm/sqlAdmin/index.js",
+      "default": "./esm/sqlAdmin/index.js"
+    },
+    "./sqlAdmin/server": {
+      "types": "./esm/sqlAdmin/server/index.d.ts",
+      "default": "./esm/sqlAdmin/server/index.js"
     }
   },
   "keywords": [

package/esm/bin/cmd.d.ts

@@ -1 +0,0 @@
-export {};