@ramesesinc/platform-core 0.1.6 → 0.1.9

package/dist/components/action/LookupPage.tsx

@@ -1,113 +0,0 @@
-"use client";
-
-import React, { forwardRef, memo, useImperativeHandle, useRef, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-import { getValue, substituteExpr } from "../../lib/utils/BeanUtils";
-import { AbstractComponent } from "../../types/component";
-import PopupView from "../view/PopupView";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface LookupPageProps extends AbstractComponent {
-  url: string;
-  name?: string;
-  result?: Record<string, any>;
-  children?: React.ReactNode;
-  className?: string;
-  title?: string;
-  icon?: string;
-  opt?: Record<string, any>;
-  iconOnly?: boolean; // ✅ added
-  popupClassName?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const LookupPage = (props: LookupPageProps) => {
-  const { url, name = "", result = null, children, className = "", title, icon, opt = {}, popupClassName = "", iconOnly = false } = props ?? {};
-  const { data = {} } = opt;
-
-  const pageContext = usePageContext();
-  const [showPopup, setShowPopup] = useState(false);
-  const [popupUrl, setPopupUrl] = useState("");
-  const slotRef = useRef<ChildrenSlotHandle>(null);
-
-  const onClose = () => {
-    slotRef.current?.update(null);
-  };
-
-  /* ---------------------- Events ---------------------- */
-  const handleClick = () => {
-    if (!url) return;
-    //combine data if specified and pageContext all data if specified
-    const surl = substituteExpr(url, { ...pageContext?.getAllData(), ...data });
-    setPopupUrl(surl);
-    setShowPopup(true);
-
-    const handler = {
-      onSelect: (itm: any) => {
-        let resdata = itm;
-        if (result != null) {
-          resdata = getValue(result, itm);
-        }
-        alert("item selected " + JSON.stringify(resdata));
-        if (name) {
-          pageContext.set(name, resdata);
-        }
-        onClose();
-        //pageContext.refresh();
-      },
-    };
-    //eventHandler={handler}
-    slotRef.current?.update(<PopupView url={surl} onClose={onClose} eventHandler={handler} />);
-  };
-
-  const handleClosePopup = () => {
-    setShowPopup(false);
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <>
-      {iconOnly ? (
-        <span onClick={handleClick} className={`cursor-pointer ${className}`}>
-          {icon}
-        </span>
-      ) : (
-        <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-          {icon && <span className="dl-action-icon">{icon}</span>}
-          {title || "View Page"}
-        </button>
-      )}
-
-      <ChildrenSlot ref={slotRef} />
-    </>
-  );
-};
-
-export default LookupPage;
-
-type ChildrenSlotHandle = {
-  update: (content: React.ReactNode) => void;
-};
-
-const ChildrenSlot = memo(
-  forwardRef<ChildrenSlotHandle>((_, ref) => {
-    const [content, setContent] = useState<React.ReactNode>(null);
-
-    useImperativeHandle(
-      ref,
-      () => ({
-        update: (content: React.ReactNode) => {
-          // console.log("view page children slot", content);
-          setContent(content);
-        },
-      }),
-      [],
-    );
-
-    return <>{content == null ? null : content}</>;
-  }),
-);

package/dist/components/action/ProcessRunner.tsx

@@ -1,337 +0,0 @@
-"use client";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { usePageContext } from "../../core/PageContext";
-import { getValue, substituteExpr } from "../../lib/utils/BeanUtils";
-import { getUrlPageParams } from "../../lib/utils/PageUtils";
-import { AbstractComponent } from "../../types/component";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-// Display state is always derived from the server record — never set directly.
-type RunnerState = "idle" | "running" | "paused" | "done";
-
-interface ProcessRunnerProps extends AbstractComponent {
-  /**
-   * Field expression for current progress value. Default: "{processedcount}"
-   */
-  value?: string;
-  /**
-   * Field expression for max value. Default: "{totalcount}"
-   */
-  maxValue?: string;
-  /**
-   * Field expression resolving to the server-side status field.
-   * Expected values (case-insensitive): IDLE | RUNNING | PAUSED | DONE.
-   * Default: "{status}"
-   */
-  statusValue?: string;
-  /**
-   * Optional label expression shown below the bar.
-   * Only rendered when provided.
-   * Example: "{processedcount} of {totalcount} records processed"
-   */
-  labelExpr?: string;
-  /**
-   * Data config: the API endpoint polled on interval to refresh the record.
-   * Should return the single record object: { _id, status, processedcount, totalcount, ... }
-   * May contain bound param expressions, e.g. "/processtask?_id={_id}"
-   *
-   * Note: The DataList (parent) fetches the initial list. This component
-   * polls independently for live updates on its own record.
-   */
-  data?: {
-    api: string;
-    /** Action APIs called on button click, then immediately re-fetches. */
-    actions?: {
-      start?: string; // e.g. "/processtask/start?_id={_id}"
-      pause?: string; // e.g. "/processtask/pause?_id={_id}"
-      resume?: string; // e.g. "/processtask/resume?_id={_id}"
-      end?: string; // e.g. "/processtask/end?_id={_id}"
-    };
-  };
-  /**
-   * Polling interval in milliseconds. Default: 5000.
-   * Timer only fires while status === "running".
-   */
-  interval?: number;
-  /** Button label overrides */
-  labels?: {
-    start?: string;
-    pause?: string;
-    resume?: string;
-    end?: string;
-  };
-  /**
-   * Row data injected by the Table renderer (same as ViewPage opt.data).
-   * Carries the initial record: { _id, status, processedcount, totalcount }
-   * This is the seed — polling overlays it with fresh values.
-   */
-  opt?: Record<string, any>;
-  className?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Helpers */
-
-const toRunnerState = (raw: unknown): RunnerState => {
-  switch (String(raw ?? "").toUpperCase()) {
-    case "RUNNING":
-      return "running";
-    case "PAUSED":
-      return "paused";
-    case "DONE":
-      return "done";
-    default:
-      return "idle";
-  }
-};
-
-const resolveNumeric = (expr: string, data: Record<string, any>): number => {
-  const n = Number(getValue(expr, data));
-  return isNaN(n) ? 0 : n;
-};
-
-/* ------------------------------------------------------------------ */
-/* Component */
-const ProcessRunner = (props: ProcessRunnerProps) => {
-  const {
-    value: valueProp = "{processedcount}",
-    maxValue: maxValueProp = "{totalcount}",
-    statusValue = "{status}",
-    labelExpr,
-    data,
-    interval = 5000,
-    labels = {},
-    opt = {},
-    className = "",
-  } = props ?? {};
-
-  const { data: optData = {} } = opt;
-
-  const { start: startLabel = "Start", pause: pauseLabel = "Pause", resume: resumeLabel = "Resume", end: endLabel = "End" } = labels;
-
-  const pageContext = usePageContext();
-
-  /* ----------------------------------------------------------------
-     liveData is the SOLE source of truth.
-
-     Seed it with optData (the row record from DataList) so the
-     component displays correctly on first render — before any poll fires.
-     Subsequent polls overwrite it entirely with the server's response.
-  ---------------------------------------------------------------- */
-  const [liveData, setLiveData] = useState<Record<string, any>>(optData);
-  const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
-  const [isBusy, setIsBusy] = useState(false); // prevents double-clicks during action API call
-
-  // When optData changes from outside (table refresh, parent re-render),
-  // merge it in — but don't overwrite fields already updated by polling.
-  useEffect(() => {
-    setLiveData((prev) => ({ ...optData, ...prev }));
-  }, [optData]);
-
-  /* ----------------------------------------------------------------
-     Resolution context — built from all data sources.
-     Priority (low → high): url params → page data → liveData
-     liveData already contains optData as its seed, so per-row fields
-     like {_id} resolve correctly from the very first render.
-  ---------------------------------------------------------------- */
-  const resolveCtx = useMemo(() => {
-    const { params } = getUrlPageParams();
-    return {
-      ...params,
-      ...pageContext.getAllData(),
-      ...optData, // row record from Table — always live, not just a one-time seed
-      ...liveData, // polled data wins last — overwrites optData after first fetch
-    };
-  }, [liveData, optData, pageContext]);
-
-  /* ----------------------------------------------------------------
-     All display values are derived from resolveCtx — no separate state.
-     This is what makes multi-browser sync work: any change in the DB
-     flows through poll → liveData → resolveCtx → these values → render.
-  ---------------------------------------------------------------- */
-  const state = toRunnerState(getValue(statusValue, resolveCtx));
-  const currentValue = resolveNumeric(valueProp, resolveCtx);
-  const maxValue = resolveNumeric(maxValueProp, resolveCtx);
-  const percent = maxValue > 0 ? Math.min((currentValue / maxValue) * 100, 100) : 0;
-  const resolvedLabel = labelExpr ? substituteExpr(labelExpr, resolveCtx) : null;
-
-  /* ----------------------------------------------------------------
-     Core fetch — retrieves the latest record and overwrites liveData.
-     Called both by the interval timer AND immediately after button actions.
-  ---------------------------------------------------------------- */
-  const fetchRecord = useCallback(async () => {
-    if (!data?.api) return;
-    try {
-      const url = substituteExpr(data.api, resolveCtx);
-      const json = await pageContext?.execService(url, resolveCtx);
-      if (!json) return;
-      // Full overwrite — server response is authoritative.
-      // state, currentValue, maxValue all re-derive from this on next render.
-      setLiveData(json);
-    } catch {
-      // Silently ignore — next tick will retry
-    }
-  }, [data?.api, resolveCtx, pageContext]);
-
-  /* ----------------------------------------------------------------
-     Polling — only runs while state === "running".
-     Starts automatically when state becomes "running" (either from a
-     button click confirming via re-fetch, or from another browser
-     changing the DB and the interval picking it up).
-  ---------------------------------------------------------------- */
-  const startPolling = useCallback(() => {
-    if (intervalRef.current) return;
-    intervalRef.current = setInterval(fetchRecord, interval);
-  }, [fetchRecord, interval]);
-
-  const stopPolling = useCallback(() => {
-    if (intervalRef.current) {
-      clearInterval(intervalRef.current);
-      intervalRef.current = null;
-    }
-  }, []);
-
-  // Manage timer based on derived state — not on button clicks.
-  // This means another browser pausing/completing the job will also
-  // stop the timer on this browser after the next tick confirms it.
-  useEffect(() => {
-    if (state === "running") {
-      startPolling();
-    } else {
-      stopPolling();
-    }
-  }, [state, startPolling, stopPolling]);
-
-  // Cleanup on unmount (row removed from table, page navigated away)
-  useEffect(() => () => stopPolling(), [stopPolling]);
-
-  /* ----------------------------------------------------------------
-     Action handler — the key pattern for button clicks:
-       1. Call action API (POST/GET — whatever your backend expects)
-       2. Immediately re-fetch the record — don't wait for next tick
-       3. liveData updates → state re-derives → UI updates instantly
-     No optimistic setState — server response is always the authority.
-  ---------------------------------------------------------------- */
-  const fireAction = useCallback(
-    async (actionUrl: string | undefined) => {
-      if (!actionUrl || isBusy) return;
-      setIsBusy(true);
-      try {
-        const url = substituteExpr(actionUrl, resolveCtx);
-        await pageContext?.execService(url, resolveCtx);
-      } catch {
-        // Action failed — re-fetch anyway to show real current state
-      } finally {
-        // Always re-fetch immediately after action — this is what makes
-        // the button feel instant rather than waiting for the next tick.
-        await fetchRecord();
-        setIsBusy(false);
-      }
-    },
-    [isBusy, resolveCtx, fetchRecord, pageContext],
-  );
-
-  /* ----------------------------------------------------------------
-     Handlers — just delegate to fireAction with the right endpoint.
-     If no action API is configured, fetchRecord still runs so the
-     UI reflects whatever the server currently has.
-  ---------------------------------------------------------------- */
-  const handleStart = () => fireAction(data?.actions?.start);
-  const handlePause = () => fireAction(data?.actions?.pause);
-  const handleResume = () => fireAction(data?.actions?.resume);
-  const handleEnd = () => fireAction(data?.actions?.end);
-
-  /* ----------------------------------------------------------------
-     Render
-  ---------------------------------------------------------------- */
-  return (
-    <div className={`flex flex-col gap-2 ${className}`}>
-      {/* IDLE — Start button */}
-      {state === "idle" && (
-        <button
-          onClick={handleStart}
-          disabled={isBusy}
-          className="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 disabled:opacity-50 transition-colors text-sm font-medium"
-        >
-          {isBusy ? "…" : startLabel}
-        </button>
-      )}
-
-      {/* RUNNING / PAUSED / DONE — progress bar + controls */}
-      {state !== "idle" && (
-        <div className="flex flex-col gap-1 w-full">
-          <div className="flex items-center gap-2">
-            {/* Bar */}
-            <div
-              className="flex-1 h-4 bg-gray-200 rounded-full overflow-hidden"
-              role="progressbar"
-              aria-valuenow={currentValue}
-              aria-valuemin={0}
-              aria-valuemax={maxValue || undefined}
-              aria-label="Process progress"
-            >
-              <div
-                className={`h-full rounded-full transition-all duration-500 ${
-                  state === "done" ? "bg-green-500" : state === "paused" ? "bg-yellow-400" : "bg-blue-500"
-                }`}
-                style={{ width: `${percent}%` }}
-              />
-            </div>
-
-            {/* Percent */}
-            <span className="text-xs text-gray-600 w-10 text-right tabular-nums">{Math.round(percent)}%</span>
-
-            {/* RUNNING → Pause */}
-            {state === "running" && (
-              <button
-                onClick={handlePause}
-                disabled={isBusy}
-                className="px-3 py-1 bg-yellow-400 text-yellow-900 rounded-md hover:bg-yellow-500 disabled:opacity-50 transition-colors text-xs font-medium"
-              >
-                {isBusy ? "…" : pauseLabel}
-              </button>
-            )}
-
-            {/* PAUSED → Resume | End */}
-            {state === "paused" && (
-              <>
-                <button
-                  onClick={handleResume}
-                  disabled={isBusy}
-                  className="px-3 py-1 bg-blue-600 text-white rounded-md hover:bg-blue-700 disabled:opacity-50 transition-colors text-xs font-medium"
-                >
-                  {isBusy ? "…" : resumeLabel}
-                </button>
-                <button
-                  onClick={handleEnd}
-                  disabled={isBusy}
-                  className="px-3 py-1 bg-gray-500 text-white rounded-md hover:bg-gray-600 disabled:opacity-50 transition-colors text-xs font-medium"
-                >
-                  {isBusy ? "…" : endLabel}
-                </button>
-              </>
-            )}
-
-            {/* DONE → End (reset) */}
-            {state === "done" && (
-              <button
-                onClick={handleEnd}
-                disabled={isBusy}
-                className="px-3 py-1 bg-green-600 text-white rounded-md hover:bg-green-700 disabled:opacity-50 transition-colors text-xs font-medium"
-              >
-                {isBusy ? "…" : endLabel}
-              </button>
-            )}
-          </div>
-
-          {/* Label below bar — only when labelExpr is provided */}
-          {resolvedLabel && <p className="text-xs text-gray-500 mt-0.5">{resolvedLabel}</p>}
-        </div>
-      )}
-    </div>
-  );
-};
-
-export default ProcessRunner;

package/dist/components/action/Refresh.tsx

@@ -1,35 +0,0 @@
-"use client";
-
-import { usePageContext } from "../../core/PageContext";
-import { AbstractComponent } from "../../types/component";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface RefreshProps extends AbstractComponent {
-  className?: string;
-  title?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const Refresh = (props: RefreshProps) => {
-  const { className = "", title } = props ?? {};
-  const pageContext = usePageContext();
-
-  /* ---------------------- Events ---------------------- */
-  const handleClick = () => {
-    // console.log("Refresh button", pageContext.refresh());
-    pageContext.notifyDepends();
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-      {title || "Refresh"}
-    </button>
-  );
-};
-
-export default Refresh;

package/dist/components/action/SaveData.tsx

@@ -1,74 +0,0 @@
-"use client";
-
-import { usePageContext } from "../../core/PageContext";
-import { usePageViewContext } from "../../core/PageViewContext";
-import { getValue } from "../../lib/utils/BeanUtils";
-import { getUrlPageParams } from "../../lib/utils/PageUtils";
-import { AbstractComponent } from "../../types/component";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface SaveDataProps extends AbstractComponent {
-  className?: string;
-  title?: string;
-  api: string;
-  params?: string;
-  data?: Record<string, any> | null;
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const SaveData = (props: SaveDataProps) => {
-  const { className = "", title, api, params, data = {} } = props ?? {};
-  // console.log("save data props", { api, params, props });
-  const pageContext = usePageContext();
-  const pageViewContext = usePageViewContext();
-
-  /* ---------------------- Events ---------------------- */
-  const handleClick = async (e: React.MouseEvent<HTMLButtonElement>) => {
-    e.preventDefault();
-
-    try {
-      if (!api) throw new Error("api not defined");
-      if (params) {
-        const allData = pageContext?.getAllData() ?? {};
-        // console.log("save data 1.1", allData);
-        const urlParams = getUrlPageParams() ?? {};
-        // console.log("save data 1.2", urlParams);
-        const d = getValue(params, { ...allData, ...urlParams?.params });
-        // console.log("save data", { api, d });
-
-        // console.log("data before save is ", params, d);
-        // throw new Error("test error");
-        await pageContext?.execService(api, d);
-      } else {
-        const vdata = pageContext?.getData() ?? {};
-        const req = {
-          data: vdata,
-        };
-        // console.log("save data", { api, vdata });
-        await pageContext?.execService(api, req);
-      }
-
-      const eventHandler = pageViewContext.getEventHandler() ?? {};
-      const { onSave } = eventHandler;
-      if (typeof onSave === "function") {
-        onSave({});
-      }
-    } catch (err: any) {
-      console.log("error save data", err);
-      alert(err.message);
-    }
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-      {title || "Save"}
-    </button>
-  );
-};
-
-export default SaveData;

package/dist/components/action/SelectData.tsx

@@ -1,47 +0,0 @@
-"use client";
-
-import { usePageContext } from "../../core/PageContext";
-import { usePageViewContext } from "../../core/PageViewContext";
-import { AbstractComponent } from "../../types/component";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface SelectDataProps extends AbstractComponent {
-  className?: string;
-  title?: string;
-  name: string; //target name of data to extract
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const SelectData = (props: SelectDataProps) => {
-  const { className = "", title, name } = props ?? {};
-  const pageContext = usePageContext();
-  const pageViewContext = usePageViewContext();
-
-  /* ---------------------- Events ---------------------- */
-  const handleClick = async () => {
-    try {
-      const eventHandler = pageViewContext.getEventHandler() ?? {};
-      const { onSelect } = eventHandler;
-
-      if (typeof onSelect === "function") {
-        const d = pageContext.get(name);
-        onSelect(d);
-      }
-    } catch (err: any) {
-      alert(err.message);
-    }
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-      {title || "Save"}
-    </button>
-  );
-};
-
-export default SelectData;

package/dist/components/action/Undo.tsx

@@ -1,50 +0,0 @@
-"use client";
-
-import { usePageContext } from "../../core/PageContext";
-import { AbstractComponent } from "../../types/component";
-
-/* ------------------------------------------------------------------ */
-/* Types */
-
-interface UndoProps extends AbstractComponent {
-  className?: string;
-  title?: string;
-  api: string;
-  data?: string;
-}
-
-/* ------------------------------------------------------------------ */
-/* Component */
-
-const Undo = (props: UndoProps) => {
-  const { className = "", title, api, data } = props ?? {};
-  const pageContext = usePageContext();
-
-  /* ---------------------- Events ---------------------- */
-  const handleClick = async () => {
-    try {
-      /*
-      if(!api) throw new Error("api not defined");
-      const allData = pageContext?.getAllData() ?? {};
-      if( data ) {
-        const d = getValue( data, allData );
-        await pageContext?.execService( api, d );
-      }
-      else {
-        await pageContext?.execService( api, allData );
-      }
-      */
-    } catch (err: any) {
-      alert(err.message);
-    }
-  };
-
-  /* ---------------------- Render ---------------------- */
-  return (
-    <button onClick={handleClick} className={`px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors ${className}`}>
-      {title || "Update Context"}
-    </button>
-  );
-};
-
-export default Undo;