jp
0917366cdf
- vm_api.py: pure FastAPI JSON API on :8098 with CORS - vm-api.service: systemd unit for API (replaces inline HTML vm_web.py for frontend) - vm_web.py: kept intact as fallback; Apache now proxies /api/ -> :8098 - frontend/: Vite + React + TanStack Query scaffold - Apache vhost updated: DocumentRoot -> frontend/dist, /api/ proxy, SPA fallback - All original HTML pages still functional via :8099 during transition
56 lines
1.7 KiB
JavaScript
56 lines
1.7 KiB
JavaScript
"use client";
|
|
const require_runtime = require("./_virtual/_rolldown/runtime.cjs");
|
|
let react = require("react");
|
|
react = require_runtime.__toESM(react, 1);
|
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
//#region src/ClientOnly.tsx
|
|
/**
|
|
* Render the children only after the JS has loaded client-side. Use an optional
|
|
* fallback component if the JS is not yet loaded.
|
|
*
|
|
* @example
|
|
* Render a Chart component if JS loads, renders a simple FakeChart
|
|
* component server-side or if there is no JS. The FakeChart can have only the
|
|
* UI without the behavior or be a loading spinner or skeleton.
|
|
*
|
|
* ```tsx
|
|
* return (
|
|
* <ClientOnly fallback={<FakeChart />}>
|
|
* <Chart />
|
|
* </ClientOnly>
|
|
* )
|
|
* ```
|
|
*/
|
|
function ClientOnly({ children, fallback = null }) {
|
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: useHydrated() ? children : fallback });
|
|
}
|
|
/**
|
|
* Return a boolean indicating if the JS has been hydrated already.
|
|
* When doing Server-Side Rendering, the result will always be false.
|
|
* When doing Client-Side Rendering, the result will always be false on the
|
|
* first render and true from then on. Even if a new component renders it will
|
|
* always start with true.
|
|
*
|
|
* @example
|
|
* ```tsx
|
|
* // Disable a button that needs JS to work.
|
|
* let hydrated = useHydrated()
|
|
* return (
|
|
* <button type="button" disabled={!hydrated} onClick={doSomethingCustom}>
|
|
* Click me
|
|
* </button>
|
|
* )
|
|
* ```
|
|
* @returns True if the JS has been hydrated already, false otherwise.
|
|
*/
|
|
function useHydrated() {
|
|
return react.default.useSyncExternalStore(subscribe, () => true, () => false);
|
|
}
|
|
function subscribe() {
|
|
return () => {};
|
|
}
|
|
//#endregion
|
|
exports.ClientOnly = ClientOnly;
|
|
exports.useHydrated = useHydrated;
|
|
|
|
//# sourceMappingURL=ClientOnly.cjs.map
|