webspresso 0.0.67 → 0.0.68

package/README.md

@@ -129,6 +129,17 @@ If you select a database:
 - `models/` directory is created
 - `DATABASE_URL` is added to `.env.example` with a template
 
+**Scaffold: `config/` and environment files**
+
+New projects include:
+
+- **`config/load-env.js`** — loads, in order, `.env`, `.env.local`, `.env.${NODE_ENV}`, and `.env.${NODE_ENV}.local` (each file overrides keys from earlier ones).
+- **`config/env.schema.js`** — validates `process.env` with **Zod** before the app starts (`PORT`, `NODE_ENV`, i18n vars, `BASE_URL`, optional `DATABASE_URL`).
+- **`config/app.js`** — returns `createApp()` options (paths; if `webspresso.db.js` exists, also **`createDatabase`** as `db`).
+- **`server.js`** — calls `loadEnv()`, then `createApp(getCreateAppOptions())`, then `listen` using the parsed `PORT`.
+
+Copy **`.env.example`** to **`.env`** (and use `.env.local` for machine-specific overrides). Patterns such as `.env.development.local` are gitignored via `.env.*.local`.
+
 **Seed Data Generation:**
 After selecting a database, you'll be asked if you want to generate seed data:
 - If yes, `@faker-js/faker` is added to dependencies
@@ -2041,6 +2052,45 @@ const { app } = createApp({
 
 List query parameters: `page`, `perPage`, `sort`, `order`, `include`, `trashed` (`only` / `include` when the model uses soft delete), plus **equality filters** on real columns (unknown keys are ignored).
 
+### File upload plugin
+
+Registers **POST** `multipart/form-data` (field name **`file`** by default) and stores the file via a pluggable provider. The framework ships with **`createLocalFileProvider({ destDir, publicBasePath })`** (writes to disk and returns a public URL path). Use **`mimeAllowlist`** / **`extensionAllowlist`** and **`maxBytes`** (default **10 MiB**) on the server; production apps should prefer an explicit MIME allowlist.
+
+**Setup:**
+
+```javascript
+const { createApp, uploadPlugin, adminPanelPlugin } = require('webspresso');
+
+const { app } = createApp({
+  pagesDir: './pages',
+  publicDir: './public',
+  db,
+  plugins: [
+    uploadPlugin({
+      path: '/api/upload',
+      local: {
+        destDir: './public/uploads',
+        publicBasePath: '/uploads',
+      },
+      maxBytes: 10 * 1024 * 1024,
+      mimeAllowlist: ['image/jpeg', 'image/png', 'application/pdf'],
+      extensionAllowlist: ['jpg', 'jpeg', 'png', 'pdf'],
+      middleware: [], // optional Express handlers (e.g. session auth)
+      fieldName: 'file',
+    }),
+    adminPanelPlugin({
+      db,
+      // uploadUrl optional: defaults to app.get('webspresso.uploadPath') set by uploadPlugin
+    }),
+  ],
+});
+```
+
+- **ORM:** `zdb.file({ maxLength: 2048, nullable: true })` — string column for the stored public URL or path; migrations use `table.string(..., maxLength)`.
+- **Admin:** the panel reads **`settings.uploadUrl`** from the registry (set automatically when `uploadPlugin` is registered **before** `adminPanelPlugin`, or pass **`adminPanelPlugin({ uploadUrl: '/api/upload' })`**). File fields (`type: 'file'` or `customFields` type `file-upload`) POST to that URL with credentials.
+- **Response:** `{ url, publicUrl, key? }` — clients typically persist **`url`** / **`publicUrl`** in the model.
+- **Custom storage:** `uploadPlugin({ provider: { async put({ buffer, originalName, mimeType, size, req }) { return { publicUrl: '...' }; } } })`.
+
 ### Health check plugin
 
 Exposes a lightweight **GET** endpoint for load balancers and orchestrators (Kubernetes, Docker healthcheck, etc.). **Enabled by default** in all environments; set `enabled: false` to turn it off.

package/bin/commands/doctor.js

@@ -107,6 +107,29 @@ function registerCommand(program) {
         warnings += 1;
       }
 
+      console.log('\nEnvironment files');
+      console.log('-----------------');
+
+      const envExamplePath = path.join(cwd, '.env.example');
+      const envPath = path.join(cwd, '.env');
+      if (fs.existsSync(envExamplePath)) {
+        line('✓', '.env.example present');
+      } else {
+        line('○', 'No .env.example (optional; new scaffolds include one)');
+      }
+      if (fs.existsSync(envPath)) {
+        line('✓', '.env present');
+      } else if (fs.existsSync(envExamplePath)) {
+        line('⚠', 'No .env — copy .env.example to .env if the app expects env vars');
+        warnings += 1;
+      } else {
+        line('○', 'No .env (fine if you do not use dotenv in this project)');
+      }
+      const loadEnvPath = path.join(cwd, 'config', 'load-env.js');
+      if (fs.existsSync(loadEnvPath)) {
+        line('✓', 'config/load-env.js present (dotenv chain scaffold)');
+      }
+
       console.log('\nDatabase config');
       console.log('---------------');
 

package/bin/commands/new.js

@@ -159,6 +159,7 @@ function registerCommand(program) {
       fs.mkdirSync(path.join(projectPath, 'pages', 'locales'), { recursive: true });
       fs.mkdirSync(path.join(projectPath, 'views'), { recursive: true });
       fs.mkdirSync(path.join(projectPath, 'public'), { recursive: true });
+      fs.mkdirSync(path.join(projectPath, 'config'), { recursive: true });
       
       // Create models directory if database is selected
       if (useDatabase && databaseType) {
@@ -177,7 +178,8 @@ function registerCommand(program) {
         },
         dependencies: {
           webspresso: '*',
-          dotenv: '^16.3.1'
+          dotenv: '^16.3.1',
+          zod: '^3.23.0'
         }
       };
       
@@ -203,28 +205,108 @@ function registerCommand(program) {
         JSON.stringify(packageJson, null, 2) + '\n'
       );
       
-      // Create server.js
-      const serverJs = `require('dotenv').config();
-const { createApp } = require('webspresso');
+      // config/load-env.js — dotenv chain (last file wins for each key)
+      const loadEnvJs = `const fs = require('fs');
 const path = require('path');
+const dotenv = require('dotenv');
+
+/**
+ * Load env files in order: .env, .env.local, .env.<NODE_ENV>, .env.<NODE_ENV>.local
+ * @param {string} [rootDir] Project root (default: parent of config/)
+ */
+function loadEnv(rootDir) {
+  const root = rootDir || path.resolve(__dirname, '..');
+  const loadFile = (name) => {
+    const full = path.join(root, name);
+    if (fs.existsSync(full)) {
+      dotenv.config({ path: full, override: true });
+    }
+  };
+  loadFile('.env');
+  loadFile('.env.local');
+  const mode = process.env.NODE_ENV || 'development';
+  loadFile(\`.env.\${mode}\`);
+  loadFile(\`.env.\${mode}.local\`);
+}
+
+module.exports = { loadEnv };
+`;
 
-const { app } = createApp({
-  pagesDir: path.join(__dirname, 'pages'),
-  viewsDir: path.join(__dirname, 'views'),
-  publicDir: path.join(__dirname, 'public')
+      const envSchemaJs = `const { z } = require('zod');
+
+const envSchema = z.object({
+  NODE_ENV: z.enum(['development', 'production', 'test']).default('development'),
+  PORT: z.coerce.number().int().positive().default(3000),
+  DEFAULT_LOCALE: z.string().min(1).default('en'),
+  SUPPORTED_LOCALES: z.string().min(1).default('en,de'),
+  BASE_URL: z.string().url().default('http://localhost:3000'),
+  DATABASE_URL: z.string().optional(),
 });
 
-const PORT = process.env.PORT || 3000;
+let _parsed = null;
+
+function parseEnv() {
+  if (_parsed) return _parsed;
+  const result = envSchema.safeParse(process.env);
+  if (!result.success) {
+    console.error('Invalid environment variables:');
+    console.error(result.error.format());
+    process.exit(1);
+  }
+  _parsed = result.data;
+  return _parsed;
+}
+
+module.exports = { envSchema, parseEnv };
+`;
+
+      const appConfigJs = `const path = require('path');
+const fs = require('fs');
+const { parseEnv } = require('./env.schema');
+
+function getCreateAppOptions() {
+  parseEnv();
+  const rootDir = path.resolve(__dirname, '..');
+  const options = {
+    pagesDir: path.join(rootDir, 'pages'),
+    viewsDir: path.join(rootDir, 'views'),
+    publicDir: path.join(rootDir, 'public'),
+  };
+  const dbFile = path.join(rootDir, 'webspresso.db.js');
+  if (fs.existsSync(dbFile)) {
+    const { createDatabase } = require('webspresso');
+    const knexConfig = require(dbFile);
+    options.db = createDatabase(knexConfig);
+  }
+  return options;
+}
+
+module.exports = getCreateAppOptions;
+`;
+
+      const serverJs = `const { loadEnv } = require('./config/load-env');
+loadEnv();
 
-app.listen(PORT, () => {
-  console.log(\`🚀 Server running at http://localhost:\${PORT}\`);
+const { createApp } = require('webspresso');
+const getCreateAppOptions = require('./config/app');
+const { parseEnv } = require('./config/env.schema');
+
+const env = parseEnv();
+const { app } = createApp(getCreateAppOptions());
+
+app.listen(env.PORT, () => {
+  console.log(\`🚀 Server running at http://localhost:\${env.PORT}\`);
 });
 `;
-      
+
+      fs.writeFileSync(path.join(projectPath, 'config', 'load-env.js'), loadEnvJs);
+      fs.writeFileSync(path.join(projectPath, 'config', 'env.schema.js'), envSchemaJs);
+      fs.writeFileSync(path.join(projectPath, 'config', 'app.js'), appConfigJs);
       fs.writeFileSync(path.join(projectPath, 'server.js'), serverJs);
       
-      // Create .env.example
-      let envExample = `PORT=3000
+      // Create .env.example (see config/load-env.js for merge order)
+      let envExample = `# Copy to .env and adjust. Optional overrides: .env.local, .env.<NODE_ENV>, .env.<NODE_ENV>.local
+PORT=3000
 NODE_ENV=development
 DEFAULT_LOCALE=en
 SUPPORTED_LOCALES=en,de
@@ -308,10 +390,11 @@ BASE_URL=http://localhost:3000
         fs.writeFileSync(path.join(projectPath, 'seeds', 'index.js'), seedIndex);
       }
       
-      // Create .gitignore
+      // Create .gitignore (.env optional: teams often commit a non-secret .env for local defaults)
       const gitignore = `node_modules/
 .env
 .env.local
+.env.*.local
 .DS_Store
 coverage/
 *.log
@@ -482,10 +565,18 @@ Webspresso project
 
 \`\`\`bash
 npm install
+cp .env.example .env
 npm run dev
 \`\`\`
 
 Visit http://localhost:3000
+
+## Configuration
+
+- **\`config/load-env.js\`** — loads \`.env\`, \`.env.local\`, then \`.env.$NODE_ENV\` and \`.env.$NODE_ENV.local\` (later files override keys).
+- **\`config/env.schema.js\`** — [Zod](https://zod.dev) schema for \`process.env\`; fails fast on invalid values.
+- **\`config/app.js\`** — builds options passed to \`createApp()\` (paths; adds \`db\` when \`webspresso.db.js\` exists).
+- **\`server.js\`** — calls \`loadEnv()\`, then \`createApp(getCreateAppOptions())\`.
 `;
       
       fs.writeFileSync(path.join(projectPath, 'README.md'), readme);

package/core/orm/migrations/scaffold.js

@@ -112,6 +112,12 @@ function generateColumnLine(columnName, meta) {
       parts.push(`table.text('${columnName}')`);
       break;
 
+    case 'file': {
+      const fileLen = meta.maxLength || 2048;
+      parts.push(`table.string('${columnName}', ${fileLen})`);
+      break;
+    }
+
     case 'float':
       parts.push(`table.float('${columnName}')`);
       break;

package/core/orm/schema-helpers.js

@@ -420,6 +420,25 @@ function createSchemaHelpers(z) {
       }, z);
     },
 
+    /**
+     * File / URL column (stored as varchar; value is public URL or path from upload)
+     * @param {Partial<import('./types').ColumnMeta>} [options={}]
+     * @returns {SchemaBuilder}
+     */
+    file(options = {}) {
+      const { maxLength = 2048, nullable = false, ...rest } = options;
+      let schema = z.string().max(maxLength);
+      if (nullable) {
+        schema = schema.nullable().optional();
+      }
+      return createSchemaBuilder(schema, {
+        type: 'file',
+        maxLength,
+        nullable,
+        ...rest,
+      }, z);
+    },
+
     /**
      * Integer column
      * @param {Partial<import('./types').ColumnMeta>} [options={}]

package/core/orm/types.js

@@ -9,7 +9,7 @@
 // ============================================================================
 
 /**
- * @typedef {'id'|'string'|'text'|'integer'|'bigint'|'float'|'decimal'|'boolean'|'date'|'datetime'|'timestamp'|'json'|'array'|'enum'|'uuid'|'nanoid'} ColumnType
+ * @typedef {'id'|'string'|'text'|'file'|'integer'|'bigint'|'float'|'decimal'|'boolean'|'date'|'datetime'|'timestamp'|'json'|'array'|'enum'|'uuid'|'nanoid'} ColumnType
  */
 
 /**

package/index.d.ts

@@ -531,3 +531,33 @@ export interface RestResourcePluginOptions {
 export function restResourcePlugin(options?: RestResourcePluginOptions): WebspressoPlugin;
 
 export function ormCacheAdminPlugin(options: { db: DatabaseInstance }): WebspressoPlugin;
+
+/** Multipart upload storage (e.g. local disk or S3). */
+export interface UploadStorageProvider {
+  put(args: {
+    buffer?: Buffer;
+    stream?: NodeJS.ReadableStream;
+    originalName: string;
+    mimeType: string;
+    size: number;
+    req: Request;
+  }): Promise<{ publicUrl: string; key?: string }>;
+}
+
+export interface UploadPluginOptions {
+  path?: string;
+  provider?: UploadStorageProvider;
+  local?: { destDir?: string; publicBasePath?: string };
+  maxBytes?: number;
+  mimeAllowlist?: string[] | null;
+  extensionAllowlist?: string[] | null;
+  middleware?: RequestHandler | RequestHandler[];
+  fieldName?: string;
+}
+
+export function uploadPlugin(options?: UploadPluginOptions): WebspressoPlugin;
+
+export function createLocalFileProvider(options?: {
+  destDir?: string;
+  publicBasePath?: string;
+}): UploadStorageProvider;

package/index.js

@@ -40,7 +40,19 @@ const {
 const orm = require('./core/orm');
 
 // Built-in plugins
-const { schemaExplorerPlugin, adminPanelPlugin, siteAnalyticsPlugin, auditLogPlugin, recaptchaPlugin, swaggerPlugin, healthCheckPlugin, restResourcePlugin, ormCacheAdminPlugin } = require('./plugins');
+const {
+  schemaExplorerPlugin,
+  adminPanelPlugin,
+  siteAnalyticsPlugin,
+  auditLogPlugin,
+  recaptchaPlugin,
+  swaggerPlugin,
+  healthCheckPlugin,
+  restResourcePlugin,
+  ormCacheAdminPlugin,
+  uploadPlugin,
+  createLocalFileProvider,
+} = require('./plugins');
 
 module.exports = {
   // Main API
@@ -95,4 +107,6 @@ module.exports = {
   healthCheckPlugin,
   restResourcePlugin,
   ormCacheAdminPlugin,
+  uploadPlugin,
+  createLocalFileProvider,
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webspresso",
-  "version": "0.0.67",
+  "version": "0.0.68",
   "description": "Minimal, production-ready SSR framework for Node.js with file-based routing, Nunjucks templating, built-in i18n, and CLI tooling",
   "main": "index.js",
   "types": "index.d.ts",
@@ -59,6 +59,7 @@
     "helmet": "^7.2.0",
     "inquirer": "^8.2.6",
     "knex": "^3.1.0",
+    "multer": "^2.1.1",
     "nunjucks": "^3.2.4",
     "sharp": "^0.33.5",
     "swup": "^4.8.3",
@@ -107,6 +108,7 @@
     "node": ">=18.0.0"
   },
   "overrides": {
+    "basic-ftp": "^5.3.0",
     "tar": "^7.5.11",
     "undici": "^6.24.0"
   }

package/plugins/admin-panel/api.js

@@ -308,8 +308,8 @@ function createApiHandlers(options) {
         } else if (value !== undefined && value !== null && value !== '') {
           switch (op) {
             case 'contains':
-              // Apply LIKE for string/text types, or if type is unknown
-              if (colType === 'string' || colType === 'text' || !colMeta) {
+              // Apply LIKE for string/text/file types, or if type is unknown
+              if (colType === 'string' || colType === 'text' || colType === 'file' || !colMeta) {
                 query = query.where(colName, 'like', `%${value}%`);
                 countQuery = countQuery.where(colName, 'like', `%${value}%`);
               }
@@ -319,13 +319,13 @@ function createApiHandlers(options) {
               countQuery = countQuery.where(colName, '=', value);
               break;
             case 'starts_with':
-              if (colType === 'string' || colType === 'text' || !colMeta) {
+              if (colType === 'string' || colType === 'text' || colType === 'file' || !colMeta) {
                 query = query.where(colName, 'like', `${value}%`);
                 countQuery = countQuery.where(colName, 'like', `${value}%`);
               }
               break;
             case 'ends_with':
-              if (colType === 'string' || colType === 'text' || !colMeta) {
+              if (colType === 'string' || colType === 'text' || colType === 'file' || !colMeta) {
                 query = query.where(colName, 'like', `%${value}`);
                 countQuery = countQuery.where(colName, 'like', `%${value}`);
               }
@@ -359,7 +359,7 @@ function createApiHandlers(options) {
       if (req.query.search) {
         const searchTerm = `%${req.query.search}%`;
         const stringColumns = Array.from(model.columns.entries())
-          .filter(([_, meta]) => meta.type === 'string' || meta.type === 'text')
+          .filter(([_, meta]) => meta.type === 'string' || meta.type === 'text' || meta.type === 'file')
           .map(([name]) => name);
 
         if (stringColumns.length > 0) {

package/plugins/admin-panel/components.js

@@ -495,6 +495,7 @@ const FilterDrawer = {
       if (col.primary || col.autoIncrement) return false;
       if (col.auto === 'create' || col.auto === 'update') return false;
       if (col.type === 'json') return false;
+      if (col.type === 'file') return false;
       return true;
     });
     
@@ -1049,6 +1050,155 @@ const RichTextField = {
   }
 };
 
+// File upload field (multipart POST to settings.uploadUrl; field name "file")
+const FileUploadField = {
+  oncreate: (vnode) => {
+    const col = vnode.attrs.col;
+    const readonly = vnode.attrs.readonly;
+    if (readonly) return;
+    var cfg = window.__ADMIN_CONFIG__;
+    var uploadUrl = (cfg && cfg.settings && cfg.settings.uploadUrl) ? String(cfg.settings.uploadUrl) : '';
+    if (!uploadUrl) return;
+    const dropZoneId = 'drop-zone-' + col.name;
+    const dropZone = document.getElementById(dropZoneId);
+    if (!dropZone) return;
+    const meta = col.ui || {};
+    const onChange = vnode.attrs.onChange;
+    ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(function (eventName) {
+      dropZone.addEventListener(eventName, function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+      });
+    });
+    ['dragenter', 'dragover'].forEach(function (eventName) {
+      dropZone.addEventListener(eventName, function () {
+        dropZone.classList.add('border-blue-500', 'bg-blue-50', 'dark:bg-slate-800');
+      });
+    });
+    ['dragleave', 'drop'].forEach(function (eventName) {
+      dropZone.addEventListener(eventName, function () {
+        dropZone.classList.remove('border-blue-500', 'bg-blue-50', 'dark:bg-slate-800');
+      });
+    });
+    dropZone.addEventListener('drop', function (e) {
+      var files = e.dataTransfer.files;
+      if (files.length > 0) {
+        handleAdminFileUpload(files[0], onChange, meta);
+      }
+    });
+    var fileInput = dropZone.querySelector('input[type=file]');
+    if (fileInput) {
+      fileInput.addEventListener('change', function (e) {
+        if (e.target.files.length > 0) {
+          handleAdminFileUpload(e.target.files[0], onChange, meta);
+        }
+      });
+    }
+  },
+  view: (vnode) => {
+    const col = vnode.attrs.col;
+    const value = vnode.attrs.value || '';
+    const onChange = vnode.attrs.onChange;
+    const readonly = vnode.attrs.readonly || false;
+    const meta = col.ui || {};
+    const label = meta.label || formatColumnLabel(col.name);
+    const hint = meta.hint || '';
+    const required = !col.nullable && !readonly;
+    var uploadUrl = '';
+    try {
+      var cfg2 = window.__ADMIN_CONFIG__;
+      uploadUrl = (cfg2 && cfg2.settings && cfg2.settings.uploadUrl) ? String(cfg2.settings.uploadUrl) : '';
+    } catch (e) { uploadUrl = ''; }
+    var maxSize = meta.maxSize || meta.maxBytes || (10 * 1024 * 1024);
+    var accept = meta.accept || '*/*';
+    var dropZoneId = 'drop-zone-' + col.name;
+    if (readonly) {
+      return m('.mb-4', [
+        m('label.block.text-sm.font-medium.text-gray-700.dark:text-slate-300.mb-1', label, required ? m('span.text-red-500', ' *') : null),
+        value ? m('a.text-indigo-600.break-all', { href: value, target: '_blank', rel: 'noopener noreferrer' }, value) : m('span.text-gray-400', '—'),
+        hint ? m('p.text-xs.text-gray-500.dark:text-slate-400.mt-1', hint) : null,
+      ]);
+    }
+    if (!uploadUrl) {
+      return m('.mb-4', [
+        m('label.block.text-sm.font-medium.text-gray-700.dark:text-slate-300.mb-1', { for: col.name }, label, required ? m('span.text-red-500', ' *') : null),
+        m('p.text-xs.text-amber-700.dark:text-amber-400.mb-2', 'Upload URL is not configured. Enter a public URL or path manually.'),
+        m('input.w-full.px-3.py-2.border.border-gray-300.dark:border-slate-600.rounded.bg-white.dark:bg-slate-800', {
+          type: 'text',
+          id: col.name,
+          name: col.name,
+          value: value,
+          placeholder: 'https://… or /uploads/…',
+          required: required,
+          oninput: function (e) { if (onChange) onChange(e.target.value); },
+        }),
+        hint ? m('p.text-xs.text-gray-500.dark:text-slate-400.mt-1', hint) : null,
+      ]);
+    }
+    return m('.mb-4', [
+      m('label.block.text-sm.font-medium.text-gray-700.dark:text-slate-300.mb-1', label, required ? m('span.text-red-500', ' *') : null),
+      m('div#' + dropZoneId + '.border-2.border-dashed.border-gray-300.dark:border-slate-600.rounded.p-8.text-center', { style: 'cursor: pointer;' }, [
+        m('input[type=file].hidden', {
+          id: 'file-input-' + col.name,
+          accept: accept,
+          onchange: function (e) {
+            if (e.target.files.length > 0) {
+              handleAdminFileUpload(e.target.files[0], onChange, meta);
+            }
+          },
+        }),
+        m('div', [
+          m('p.text-gray-600.dark:text-slate-400.mb-2', 'Drag and drop a file here, or'),
+          m('label.text-blue-600.hover:text-blue-800.dark:text-blue-400.cursor-pointer', { for: 'file-input-' + col.name }, 'browse'),
+        ]),
+        value ? m('.mt-4.text-left', [
+          m('p.text-sm.text-gray-600.dark:text-slate-400.break-all', 'Current: ' + value),
+          m('button.text-red-600.hover:text-red-800.text-sm.mt-2', {
+            type: 'button',
+            onclick: function () { if (onChange) onChange(''); },
+          }, 'Remove'),
+        ]) : null,
+      ]),
+      m('input[type=hidden]', { name: col.name, value: typeof value === 'string' ? value : '' }),
+      m('p.text-xs.text-gray-500.dark:text-slate-400.mt-1', 'Max ' + Math.round(maxSize / 1024 / 1024) + ' MB (server enforces limits)'),
+      hint ? m('p.text-xs.text-gray-500.dark:text-slate-400.mt-1', hint) : null,
+    ]);
+  },
+};
+
+async function handleAdminFileUpload(file, onChange, meta) {
+  var uploadUrl = '';
+  try {
+    var cfg = window.__ADMIN_CONFIG__;
+    uploadUrl = (cfg && cfg.settings && cfg.settings.uploadUrl) ? String(cfg.settings.uploadUrl) : '';
+  } catch (e) {}
+  if (!uploadUrl) {
+    alert('Upload URL is not configured.');
+    return;
+  }
+  var maxSize = meta.maxSize || meta.maxBytes || (10 * 1024 * 1024);
+  if (file.size > maxSize) {
+    alert('File too large (max ' + Math.round(maxSize / 1024 / 1024) + ' MB).');
+    return;
+  }
+  var fd = new FormData();
+  fd.append('file', file);
+  try {
+    var res = await fetch(uploadUrl, { method: 'POST', body: fd, credentials: 'include' });
+    var data = {};
+    try { data = await res.json(); } catch (e2) { data = {}; }
+    if (!res.ok) {
+      alert(data.message || data.error || ('Upload failed (' + res.status + ')'));
+      return;
+    }
+    var url = data.url || data.publicUrl || '';
+    if (onChange) onChange(url);
+    m.redraw();
+  } catch (err) {
+    alert(err.message || 'Upload failed');
+  }
+}
+
 // Get appropriate renderer for a column type
 function getFieldRenderer(col, modelMeta) {
   // Check for custom field first
@@ -1064,8 +1214,29 @@ function getFieldRenderer(col, modelMeta) {
         });
       };
     }
+    if (col.customField.type === 'file-upload') {
+      return (col, value, onChange, readonly) => {
+        return m(FileUploadField, {
+          col,
+          value: value || '',
+          onChange,
+          readonly: readonly || false,
+        });
+      };
+    }
     // Add other custom field types here if needed
   }
+
+  if (col.type === 'file') {
+    return (col, value, onChange, readonly) => {
+      return m(FileUploadField, {
+        col,
+        value: value || '',
+        onChange,
+        readonly: readonly || false,
+      });
+    };
+  }
   
   // Fallback to standard type renderers
   const typeMap = {
@@ -1316,6 +1487,19 @@ function formatCellValue(value, col) {
     case 'text':
       const textStr = String(value);
       return textStr.length > 50 ? textStr.substring(0, 50) + '...' : textStr;
+
+    case 'file': {
+      const s = String(value);
+      const short = s.length > 72 ? s.substring(0, 72) + '…' : s;
+      if (/^https?:\/\//.test(s) || s.startsWith('/')) {
+        return m('a.text-indigo-600.dark:text-indigo-400.hover:underline.break-all', {
+          href: s,
+          target: '_blank',
+          rel: 'noopener noreferrer',
+        }, short);
+      }
+      return short || m('span.text-gray-400', '—');
+    }
     
     default:
       const str = String(value);

package/plugins/admin-panel/core/registry.js

@@ -67,6 +67,7 @@ class AdminRegistry {
       perPage: 20,
       dateFormat: 'YYYY-MM-DD',
       timeFormat: 'HH:mm',
+      uploadUrl: null,
     };
     
     // User management config