@airoom/nextmin-react 1.1.0 → 1.3.0

package/dist/views/ListPage.js

@@ -7,6 +7,7 @@ import { ListHeader } from './list/ListHeader';
 import { DataTableHero } from './list/DataTableHero';
 import { TableFilters } from '../components/TableFilters';
 import { NoAccess } from '../components/NoAccess';
+import { useViewDrawer } from '../components/viewer/useViewDrawer';
 export function ListPage({ model }) {
     // paging + filters
     const [page, setPage] = useState(1); // 1-based
@@ -15,6 +16,25 @@ export function ListPage({ model }) {
     // schema
     const { items } = useSelector((s) => s.schemas);
     const schema = useMemo(() => items.find((s) => s.modelName.toLowerCase() === model.toLowerCase()), [items, model]);
+    // If this model extends a base, build a merged view schema (base + child)
+    const viewSchema = useMemo(() => {
+        if (!schema)
+            return undefined;
+        const baseName = schema?.extends;
+        if (!baseName)
+            return schema;
+        const base = items.find((s) => s.modelName.toLowerCase() === baseName.toLowerCase());
+        if (!base)
+            return schema;
+        // Merge attributes with base first so child overrides win
+        return {
+            ...schema,
+            attributes: {
+                ...(base.attributes || {}),
+                ...(schema.attributes || {}),
+            },
+        };
+    }, [schema, items]);
     // reset on model change
     useEffect(() => {
         setPage(1);
@@ -28,8 +48,24 @@ export function ListPage({ model }) {
     });
     // columns (ALWAYS call hooks; derive from schema or empty object)
     const attributes = (schema?.attributes ?? {});
+    // Generic password detectors (hide from table columns as well)
+    const normKey = (k) => k.toLowerCase().replace(/[^a-z]/g, '');
+    const isPasswordKeyRaw = (k) => {
+        const n = normKey(k);
+        return n === 'password' || n === 'pwd' || n === 'passcode';
+    };
+    const isPasswordByAttr = (attr) => {
+        const a = (Array.isArray(attr) ? attr[0] : attr);
+        const t = String(a?.type ?? '').toLowerCase();
+        const f = String(a?.format ?? '').toLowerCase();
+        return t === 'password' || f === 'password';
+    };
     const allColumns = useMemo(() => Object.entries(attributes)
-        .filter(([, a]) => !a?.private)
+        .filter(([k, a]) => {
+        const base = (Array.isArray(a) ? a[0] : a);
+        const isPriv = !!base?.private;
+        return !isPriv && !isPasswordKeyRaw(k) && !isPasswordByAttr(a);
+    })
         .map(([k]) => k), [attributes]);
     // default visible: first 4 + 'createdAt' if present (stable via useMemo)
     const defaultVisible = useMemo(() => {
@@ -55,6 +91,8 @@ export function ListPage({ model }) {
     const handleRefetch = useCallback(async () => {
         await refetch();
     }, [refetch]);
+    // View drawer hook (render portal once here)
+    const { open: openView, ViewDrawerPortal } = useViewDrawer();
     // Choose content WITHOUT early-returning before hooks
     let content = null;
     if (!schema) {
@@ -64,13 +102,29 @@ export function ListPage({ model }) {
         content = (_jsx(NoAccess, { message: err ?? 'You are not permitted to view this resource.' }));
     }
     else {
-        content = (_jsx("div", { className: "overflow-hidden", children: _jsx(DataTableHero, { topContent: _jsx(TableFilters, { model: model, value: filters, busy: loading, onChange: (v) => {
-                        setFilters(v);
+        content = (_jsxs("div", { className: "overflow-hidden", children: [_jsx(ViewDrawerPortal, {}), _jsx(DataTableHero, { topContent: _jsx(TableFilters, { model: model, value: filters, busy: loading, onChange: (v) => {
+                            setFilters(v);
+                            setPage(1);
+                        }, columns: allColumns, visibleColumns: visibleColumns, onVisibleColumnsChange: (keys) => setVisibleColumns(new Set([...keys])) }), modelName: model, columns: tableColumns, rows: rows, total: total, page: page, pageSize: pageSize, onPageChange: setPage, onDeleted: handleRefetch, onPageSizeChange: (n) => {
+                        setPageSize(n);
                         setPage(1);
-                    }, columns: allColumns, visibleColumns: visibleColumns, onVisibleColumnsChange: (keys) => setVisibleColumns(new Set([...keys])) }), modelName: model, columns: tableColumns, rows: rows, total: total, page: page, pageSize: pageSize, onPageChange: setPage, onDeleted: handleRefetch, onPageSizeChange: (n) => {
-                    setPageSize(n);
-                    setPage(1);
-                }, baseHref: baseHref, loading: loading, error: err ?? undefined }) }));
+                    }, baseHref: baseHref, loading: loading, error: err ?? undefined, schema: viewSchema, onRequestView: (row) => {
+                        // If baseId is an object (already hydrated), merge its fields into the row for viewing
+                        let dataToView = row;
+                        const baseObj = row?.baseId;
+                        if (baseObj && typeof baseObj === 'object') {
+                            const merged = { ...baseObj, ...row };
+                            // ensure linkage field doesn't show up
+                            delete merged.baseId;
+                            dataToView = merged;
+                        }
+                        openView({
+                            title: viewSchema?.modelName ?? model,
+                            model,
+                            schema: viewSchema,
+                            data: dataToView,
+                        });
+                    } })] }));
     }
     return (_jsxs("div", { className: "grid gap-3 px-4", children: [_jsx(ListHeader, { title: schema?.modelName ?? model, createHref: `${baseHref}/create`, loading: loading }), content] }));
 }

package/dist/views/list/DataTableHero.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { SchemaDef } from '../../lib/types';
 type Props = {
     modelName: string;
     columns: string[];
@@ -14,9 +15,13 @@ type Props = {
     error?: string | null;
     /** optional hook so parent can refetch or optimistically remove */
     onDeleted?: (id: string) => void;
+    /** optional schema for dynamic viewing */
+    schema?: SchemaDef;
+    /** request to view a row in a drawer */
+    onRequestView?: (row: any) => void;
 };
 /** ---------- truncation helper ---------- */
 export declare function truncateText(text: unknown, maxLength?: number): string;
 /** ---------- component ---------- */
-export declare function DataTableHero({ modelName, columns, rows, total, page, pageSize, onPageChange, onPageSizeChange, baseHref, loading, error, onDeleted, topContent, }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function DataTableHero({ modelName, columns, rows, total, page, pageSize, onPageChange, onPageSizeChange, baseHref, loading, error, onDeleted, topContent, schema, onRequestView, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/views/list/DataTableHero.js

@@ -4,6 +4,7 @@ import React from 'react';
 import Link from 'next/link';
 import { Table, TableHeader, TableBody, TableColumn, TableRow, TableCell, Pagination, Select, SelectItem, Skeleton, Button, Tooltip, Spinner, } from '@heroui/react';
 import { formatCell } from './formatters';
+import { summarizeAny } from './jsonSummary';
 import { api } from '../../lib/api';
 import { ConfirmDialog } from '../../components/ConfirmDialog';
 /** ---------- helpers: image detection/rendering ---------- */
@@ -258,8 +259,45 @@ function formatShowValue(val) {
     }
     return null;
 }
+/** ---------- Date formatting for createdAt/updatedAt ---------- */
+function isDateField(key) {
+    const k = key.toLowerCase().replace(/[^a-z]/g, '');
+    return k === 'createdat' || k === 'updatedat' || k === 'deletedat';
+}
+function tryParseDate(val) {
+    if (val == null)
+        return null;
+    if (val instanceof Date)
+        return isNaN(val.getTime()) ? null : val;
+    // ONLY parse ISO-like strings, NOT numbers (to avoid phone numbers, experience years, etc.)
+    if (typeof val === 'string') {
+        const s = val.trim();
+        // Must look like an ISO date: YYYY-MM-DD or contain 'T' or end with 'Z'
+        const looksIso = /^\d{4}-\d{2}-\d{2}/.test(s) || s.includes('T') || s.endsWith('Z');
+        if (!looksIso)
+            return null;
+        const d = new Date(s);
+        return isNaN(d.getTime()) ? null : d;
+    }
+    return null;
+}
+function formatDateLocal(d) {
+    try {
+        return d.toLocaleString(undefined, {
+            year: 'numeric',
+            month: 'short',
+            day: '2-digit',
+            hour: '2-digit',
+            minute: '2-digit',
+            hour12: true,
+        });
+    }
+    catch {
+        return d.toString();
+    }
+}
 /** ---------- component ---------- */
-export function DataTableHero({ modelName, columns, rows, total, page, pageSize, onPageChange, onPageSizeChange, baseHref, loading, error, onDeleted, topContent, }) {
+export function DataTableHero({ modelName, columns, rows, total, page, pageSize, onPageChange, onPageSizeChange, baseHref, loading, error, onDeleted, topContent, schema, onRequestView, }) {
     const pageCount = Math.max(1, Math.ceil(total / Math.max(1, pageSize)));
     const [pendingDeleteId, setPendingDeleteId] = React.useState(null);
     const [isDeleting, setIsDeleting] = React.useState(false);
@@ -312,7 +350,7 @@ export function DataTableHero({ modelName, columns, rows, total, page, pageSize,
                                                 ? typeVal.name
                                                 : '';
                                     const isSystemRow = String(typeString ?? '').toLowerCase() === 'system';
-                                    return (_jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Tooltip, { content: isSystemRow
+                                    return (_jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Tooltip, { content: "View", children: _jsx(Button, { isIconOnly: true, size: "sm", variant: "light", "aria-label": "View", onPress: () => onRequestView?.(item), children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", children: [_jsx("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }), _jsx("circle", { cx: "12", cy: "12", r: "3" })] }) }) }), _jsx(Tooltip, { content: isSystemRow
                                                         ? 'System record — editing disabled'
                                                         : 'Edit', children: _jsx(Button, { as: isSystemRow ? undefined : Link, href: isSystemRow ? undefined : `${baseHref}/${item.id}`, isIconOnly: true, size: "sm", variant: "light", isDisabled: isSystemRow, "aria-disabled": isSystemRow, children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", children: [_jsx("path", { d: "M12 20h9" }), _jsx("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z" })] }) }) }), _jsx(Tooltip, { content: isSystemRow
                                                         ? 'System record — deletion disabled'
@@ -328,6 +366,13 @@ export function DataTableHero({ modelName, columns, rows, total, page, pageSize,
                                 // Prepare raw value (parse JSON-like strings first)
                                 const rawRawVal = item[key];
                                 const rawVal = maybeParseJson(rawRawVal);
+                                // 0) Date fields (createdAt, updatedAt, deletedAt)
+                                if (isDateField(key)) {
+                                    const d = tryParseDate(rawVal);
+                                    if (d) {
+                                        return (_jsx(TableCell, { children: formatDateLocal(d) }, `${item.id ?? item._id}-${key}`));
+                                    }
+                                }
                                 // 1) Time-only ranges like "15:00..00:00 17:00..23:00"
                                 const timeRangePretty = formatTimeOnlyRanges(rawVal);
                                 if (timeRangePretty) {
@@ -338,7 +383,12 @@ export function DataTableHero({ modelName, columns, rows, total, page, pageSize,
                                 if (showPretty) {
                                     return (_jsx(TableCell, { children: truncateText(showPretty, 35) }, `${item.id ?? item._id}-${key}`));
                                 }
-                                // 3) Existing formatter pipeline
+                                // 3) Generic JSON/array/object summarizer (supports raw JSON string too)
+                                const jsonSummary = summarizeAny(rawVal);
+                                if (typeof jsonSummary === 'string' && jsonSummary.length) {
+                                    return (_jsx(TableCell, { children: truncateText(jsonSummary, 35) }, `${item.id ?? item._id}-${key}`));
+                                }
+                                // 4) Existing formatter pipeline
                                 const formatted = formatCell(rawVal, key);
                                 const isSimple = typeof formatted === 'string' ||
                                     typeof formatted === 'number';

package/dist/views/list/formatters.js

@@ -1,26 +1,3 @@
-function isCreatedOrUpdated(key) {
-    const k = (key || '').toLowerCase().replace(/[^a-z]/g, '');
-    return k === 'createdat' || k === 'updatedat';
-}
-function tryParseDate(val) {
-    if (val == null)
-        return null;
-    // Handle numeric timestamps (ms or s)
-    if (typeof val === 'number') {
-        const ms = val < 1e11 ? val * 1000 : val; // heuristic: 10/13-digit
-        const d = new Date(ms);
-        return isNaN(d.getTime()) ? null : d;
-    }
-    // ISO string / Date
-    const d = new Date(val);
-    return isNaN(d.getTime()) ? null : d;
-}
-function formatLongDate(d) {
-    const day = d.getDate(); // no leading zero: "1 August, 2025"
-    const month = d.toLocaleString('en', { month: 'long' });
-    const year = d.getFullYear();
-    return `${day} ${month}, ${year}`; // "13 August, 2025"
-}
 export function formatAtom(v) {
     if (v == null)
         return '';
@@ -48,12 +25,6 @@ export function formatAtom(v) {
 export function formatCell(val, key) {
     if (val == null)
         return '';
-    // Only format dates for createdAt / updatedAt columns
-    if (isCreatedOrUpdated(key)) {
-        const d = tryParseDate(val);
-        if (d)
-            return formatLongDate(d);
-    }
     if (Array.isArray(val))
         return val.map(formatAtom).join(', ');
     if (typeof val === 'object')

package/dist/views/list/jsonSummary.d.ts

@@ -0,0 +1,6 @@
+export declare function summarizeObject(obj: any): {
+    text: string;
+    primary?: string;
+} | null;
+export declare function summarizeArrayOfObjects(arr: any[], maxItems?: number): string | null;
+export declare function summarizeAny(val: any): string | null;

package/dist/views/list/jsonSummary.js

@@ -0,0 +1,165 @@
+// Generic JSON value summarizer for table cells and viewer
+const HIDDEN_KEYS = new Set(['id', '_id', 'v', '__v', 'baseId', 'exId', '__childId', 'createdAt', 'updatedAt', 'deletedAt']);
+function normKey(k) {
+    return k.toLowerCase();
+}
+function isSecretKey(k) {
+    const n = normKey(k);
+    return (n === 'password' ||
+        n === 'pwd' ||
+        n.includes('password') ||
+        n.includes('passwd') ||
+        n.includes('passcode') ||
+        n.includes('secret'));
+}
+function toLabel(v) {
+    if (v == null)
+        return null;
+    if (typeof v === 'string')
+        return v.trim() || null;
+    if (typeof v === 'number' || typeof v === 'boolean')
+        return String(v);
+    if (typeof v === 'object') {
+        // common label keys
+        const candidates = ['name', 'title', 'label', 'display', 'show', 'value'];
+        for (const k of candidates) {
+            const val = v[k];
+            if (typeof val === 'string' && val.trim())
+                return val;
+        }
+        // keys ending with "name" (e.g., chamberName, specialityName)
+        for (const [k, val] of Object.entries(v)) {
+            if (typeof val !== 'string')
+                continue;
+            const nk = normKey(k);
+            if (nk.endsWith('name') && val.trim())
+                return val;
+        }
+        // id last
+        if (typeof v.id === 'string')
+            return v.id;
+    }
+    return null;
+}
+function listLabels(arr) {
+    if (!Array.isArray(arr))
+        return null;
+    const labels = arr
+        .map((it) => toLabel(it))
+        .filter((s) => !!s && !!s.trim());
+    return labels.length ? labels : null;
+}
+function summarizeList(labels, max = 10) {
+    if (labels.length <= max)
+        return labels.join(', ');
+    const shown = labels.slice(0, max).join(', ');
+    const more = labels.length - max;
+    return `${shown}, +${more} more`;
+}
+const SUPPORT_PRIORITY = [
+    'address',
+    'location',
+    'district',
+    'area',
+    'city',
+    'visiting',
+    'hour',
+    'time',
+    'phone',
+    'mobile',
+    'number',
+    'fee',
+    'email',
+    'type',
+];
+function pickSupportingValues(obj, primaryKey) {
+    const out = [];
+    const entries = Object.entries(obj).filter(([k, v]) => {
+        if (HIDDEN_KEYS.has(k))
+            return false;
+        if (isSecretKey(k))
+            return false;
+        if (primaryKey && k === primaryKey)
+            return false;
+        return v != null && v !== '';
+    });
+    // rank by priority substring match, then by string length desc
+    const scored = entries
+        .map(([k, v]) => {
+        const nk = normKey(k);
+        const pri = SUPPORT_PRIORITY.findIndex((p) => nk.includes(p));
+        const score = pri >= 0 ? 100 - pri : 0; // higher better
+        const str = Array.isArray(v)
+            ? (listLabels(v) || []).join(', ')
+            : typeof v === 'object'
+                ? toLabel(v) || ''
+                : String(v);
+        return { k, str: str.trim(), score, len: str.length };
+    })
+        .filter((x) => !!x.str);
+    scored.sort((a, b) => {
+        if (b.score !== a.score)
+            return b.score - a.score;
+        return b.len - a.len;
+    });
+    for (const s of scored) {
+        out.push(s.str);
+        if (out.length >= 2)
+            break; // pick up to two
+    }
+    return out;
+}
+export function summarizeObject(obj) {
+    if (!obj || typeof obj !== 'object')
+        return null;
+    const primary = toLabel(obj);
+    if (!primary)
+        return null;
+    // try to find the actual key that produced primary
+    let primaryKey;
+    for (const [k, v] of Object.entries(obj)) {
+        if (typeof v === 'string' && v === primary) {
+            primaryKey = k;
+            break;
+        }
+    }
+    const supports = pickSupportingValues(obj, primaryKey);
+    const text = supports.length ? `${primary} — ${supports.join(', ')}` : primary;
+    return { text, primary: primaryKey };
+}
+export function summarizeArrayOfObjects(arr, maxItems = 10) {
+    const parts = [];
+    for (const it of arr) {
+        if (!it || typeof it !== 'object')
+            return null; // not uniform
+        const s = summarizeObject(it);
+        if (!s)
+            return null;
+        parts.push(s.text);
+        if (parts.length >= maxItems)
+            break;
+    }
+    if (!parts.length)
+        return null;
+    const extra = arr.length - parts.length;
+    return extra > 0 ? `${parts.join(', ')}, +${extra} more` : parts.join(', ');
+}
+export function summarizeAny(val) {
+    if (val == null)
+        return null;
+    if (Array.isArray(val)) {
+        if (val.length === 0)
+            return '';
+        if (typeof val[0] === 'object') {
+            return summarizeArrayOfObjects(val);
+        }
+        // primitives
+        const labels = val.map((v) => (typeof v === 'object' ? toLabel(v) : String(v))).filter(Boolean);
+        return labels.length ? summarizeList(labels) : null;
+    }
+    if (typeof val === 'object') {
+        const s = summarizeObject(val);
+        return s?.text ?? null;
+    }
+    return null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@airoom/nextmin-react",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "license": "MIT",
   "type": "module",
   "main": "./dist/index.js",