quidproquo-web-react 0.0.248 → 0.0.249

package/lib/commonjs/hooks/index.d.ts

@@ -1,5 +1,8 @@
 export * from './useAsyncEffect';
+export * from './useBubbleReducer';
 export * from './useFastCallback';
 export * from './useOnKeyDownEffect';
+export * from './useQpq';
+export * from './useQpqReducer';
 export * from './useRunEvery';
 export * from './useThrottledMemo';

package/lib/commonjs/hooks/index.js

@@ -15,7 +15,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./useAsyncEffect"), exports);
+__exportStar(require("./useBubbleReducer"), exports);
 __exportStar(require("./useFastCallback"), exports);
 __exportStar(require("./useOnKeyDownEffect"), exports);
+__exportStar(require("./useQpq"), exports);
+__exportStar(require("./useQpqReducer"), exports);
 __exportStar(require("./useRunEvery"), exports);
 __exportStar(require("./useThrottledMemo"), exports);

package/lib/commonjs/hooks/useBubbleReducer.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export type QpqBubbleReducer<S, A> = (prevState: S, action: A) => [S, boolean];
+export declare const useBubblingReducer: <TState, TAction>(reducer: QpqBubbleReducer<TState, TAction>, initialState: TState) => [TState, (action: TAction) => void];
+export declare const BubbleReducerDispatchProvider: ({ children, dispatch }: {
+    children: ReactNode;
+    dispatch: (action: any) => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/commonjs/hooks/useBubbleReducer.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BubbleReducerDispatchProvider = exports.useBubblingReducer = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+// Create a context with a default NOOP dispatcher
+const BubbleReducerDispatchContext = (0, react_1.createContext)((_action) => {
+    // NOOP
+});
+const useBubblingReducer = (reducer, initialState) => {
+    const ref = (0, react_1.useRef)(initialState);
+    // Use useState so we can leverage functional updates
+    const [state, setState] = (0, react_1.useState)(ref.current);
+    // Get the parent dispatch from the context
+    const parentDispatch = (0, react_1.useContext)(BubbleReducerDispatchContext);
+    // Custom Dispatch using functional updates
+    const dispatch = (action) => {
+        const [newState, preventBubble] = reducer(ref.current, action);
+        if (preventBubble) {
+            // If the action was handled, update state
+            ref.current = newState;
+            setState(newState);
+        }
+        else {
+            parentDispatch(action);
+        }
+    };
+    return [state, dispatch];
+};
+exports.useBubblingReducer = useBubblingReducer;
+const BubbleReducerDispatchProvider = ({ children, dispatch }) => ((0, jsx_runtime_1.jsx)(BubbleReducerDispatchContext.Provider, Object.assign({ value: dispatch }, { children: children })));
+exports.BubbleReducerDispatchProvider = BubbleReducerDispatchProvider;

package/lib/commonjs/hooks/useQpq.d.ts

@@ -0,0 +1,2 @@
+import { ActionProcessorListResolver, StoryResolver } from 'quidproquo-core';
+export declare function useQpq(getActionProcessors?: ActionProcessorListResolver): StoryResolver;

package/lib/commonjs/hooks/useQpq.js

@@ -0,0 +1,42 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useQpq = void 0;
+const quidproquo_actionprocessor_node_1 = require("quidproquo-actionprocessor-node");
+const quidproquo_core_1 = require("quidproquo-core");
+// WIP ~ useFastCallback, wack things like loggers in a context, try to only make once instance of the runtime.
+// Also don't create every refresh.. useMemo / useCallback etc
+function useQpq(getActionProcessors = () => __awaiter(this, void 0, void 0, function* () { return ({}); })) {
+    const logger = {
+        enableLogs: () => __awaiter(this, void 0, void 0, function* () { }),
+        log: () => __awaiter(this, void 0, void 0, function* () { }),
+        waitToFinishWriting: () => __awaiter(this, void 0, void 0, function* () { }),
+        moveToPermanentStorage: () => __awaiter(this, void 0, void 0, function* () { }),
+    };
+    const resolveStory = (0, quidproquo_core_1.createRuntime)([(0, quidproquo_core_1.defineModule)('UI')], {
+        depth: 0,
+        context: {},
+    }, (qpqConfig, dynamicModuleLoader) => __awaiter(this, void 0, void 0, function* () {
+        return (Object.assign(Object.assign({}, (yield (0, quidproquo_actionprocessor_node_1.getCoreActionProcessor)(qpqConfig, dynamicModuleLoader))), (yield getActionProcessors(qpqConfig, dynamicModuleLoader))));
+    }), () => new Date().toISOString(), logger, `frontend::${'uuid'}`, quidproquo_core_1.QpqRuntimeType.UI, (_runtime) => __awaiter(this, void 0, void 0, function* () {
+        // noop
+    }));
+    return function getStoryExecutor(story) {
+        return (...args) => __awaiter(this, void 0, void 0, function* () {
+            const result = yield resolveStory(story, args);
+            if (result.error) {
+                throw new Error(result.error.errorText);
+            }
+            return result.result;
+        });
+    };
+}
+exports.useQpq = useQpq;

package/lib/commonjs/hooks/useQpqReducer/actionProcessor/getStateDispatchActionProcessor.d.ts

@@ -0,0 +1,3 @@
+import { ActionProcessorListResolver } from 'quidproquo-core';
+import { Dispatch } from 'react';
+export declare const getStateDispatchActionListResolver: (dispatch: Dispatch<any>) => ActionProcessorListResolver;

package/lib/commonjs/hooks/useQpqReducer/actionProcessor/getStateDispatchActionProcessor.js

@@ -0,0 +1,23 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStateDispatchActionListResolver = void 0;
+const quidproquo_core_1 = require("quidproquo-core");
+const getProcessStateDispatch = (dispatch) => ({ action }) => __awaiter(void 0, void 0, void 0, function* () {
+    dispatch(action);
+    return (0, quidproquo_core_1.actionResult)(undefined);
+});
+const getStateDispatchActionListResolver = (dispatch) => (_qpqConfig, _dynamicModuleLoader) => __awaiter(void 0, void 0, void 0, function* () {
+    return ({
+        [quidproquo_core_1.StateActionType.Dispatch]: getProcessStateDispatch(dispatch),
+    });
+});
+exports.getStateDispatchActionListResolver = getStateDispatchActionListResolver;

package/lib/commonjs/hooks/useQpqReducer/actionProcessor/index.d.ts

@@ -0,0 +1 @@
+export * from './getStateDispatchActionProcessor';

package/lib/commonjs/hooks/useQpqReducer/actionProcessor/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./getStateDispatchActionProcessor"), exports);

package/lib/commonjs/hooks/useQpqReducer/index.d.ts

@@ -0,0 +1 @@
+export * from './useQpqReducer';

package/lib/commonjs/hooks/useQpqReducer/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useQpqReducer"), exports);

package/lib/commonjs/hooks/useQpqReducer/useQpqReducer.d.ts

@@ -0,0 +1 @@
+export declare const useQpqReducer: () => void;

package/lib/commonjs/hooks/useQpqReducer/useQpqReducer.js

@@ -0,0 +1,63 @@
+"use strict";
+/*
+import { AskResponseReturnType, Story } from 'quidproquo-core';
+
+import { useMemo, useState } from 'react';
+
+import { QpqBubbleReducer, useBubblingReducer } from '../useBubbleReducer';
+import { useQpq } from '../useQpq';
+import { getStateDispatchActionListResolver } from './actionProcessor';
+
+// Helper type to remap keys from "askXyz" to "xyz" (with lowercase first letter)
+type RemoveAskPrefix<K extends string> = K extends `ask${infer R}` ? Uncapitalize<R> : never;
+
+// Define the mapped API type.
+// We extract only string keys and then use a conditional type to infer parameters and return type.
+type MappedApi<TApi extends Record<`ask${string}`, Story<any, any>>> = {
+  [K in Extract<keyof TApi, string> as RemoveAskPrefix<K>]: TApi[K] extends (...args: infer P) => infer R
+    ? (...args: P) => Promise<AskResponseReturnType<R>>
+    : never;
+};
+
+export function useQpqReducer<
+  TState,
+  TAction,
+  // Constrain TApi so that all keys must start with "ask"
+  TApi extends Record<`ask${string}`, Story<any, any>>,
+>(
+  apiGenerators: TApi,
+  reducer: QpqBubbleReducer<TState, TAction> = (s) => [s, false],
+  initialState: TState = {} as TState,
+): [MappedApi<TApi>, TState, (action: any) => void] {
+  const [state, dispatch] = useBubblingReducer(reducer, initialState);
+
+  // Api generators are memoized to prevent unnecessary re-renders.
+  const [memoedApiGenerators] = useState(() => apiGenerators);
+  const resolver = useQpq(getStateDispatchActionListResolver(dispatch));
+
+  // Wrap and remap each API generator using the resolver.
+  const api = useMemo(() => {
+    const wrapped = {} as MappedApi<TApi>;
+    for (const key in memoedApiGenerators) {
+      if (Object.prototype.hasOwnProperty.call(memoedApiGenerators, key)) {
+        // Remove the 'ask' prefix and lower-case the first character.
+        const withoutAsk = key.slice(3); // e.g., "FetchTodos"
+        const newKey = withoutAsk.charAt(0).toLowerCase() + withoutAsk.slice(1); // "fetchTodos"
+        // We know newKey matches our mapped type so we can assign.
+        // (A type assertion is used here to quiet the compiler.)
+        wrapped[newKey as RemoveAskPrefix<typeof key>] = resolver(memoedApiGenerators[key as any]) as any;
+      }
+    }
+    return wrapped;
+  }, [resolver, memoedApiGenerators]);
+
+  return [api, state, dispatch];
+}
+
+*/
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useQpqReducer = void 0;
+const useQpqReducer = () => {
+    // NOOP
+};
+exports.useQpqReducer = useQpqReducer;

package/lib/esm/hooks/index.d.ts

@@ -1,5 +1,8 @@
 export * from './useAsyncEffect';
+export * from './useBubbleReducer';
 export * from './useFastCallback';
 export * from './useOnKeyDownEffect';
+export * from './useQpq';
+export * from './useQpqReducer';
 export * from './useRunEvery';
 export * from './useThrottledMemo';

package/lib/esm/hooks/index.js

@@ -1,5 +1,8 @@
 export * from './useAsyncEffect';
+export * from './useBubbleReducer';
 export * from './useFastCallback';
 export * from './useOnKeyDownEffect';
+export * from './useQpq';
+export * from './useQpqReducer';
 export * from './useRunEvery';
 export * from './useThrottledMemo';

package/lib/esm/hooks/useBubbleReducer.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export type QpqBubbleReducer<S, A> = (prevState: S, action: A) => [S, boolean];
+export declare const useBubblingReducer: <TState, TAction>(reducer: QpqBubbleReducer<TState, TAction>, initialState: TState) => [TState, (action: TAction) => void];
+export declare const BubbleReducerDispatchProvider: ({ children, dispatch }: {
+    children: ReactNode;
+    dispatch: (action: any) => void;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/esm/hooks/useBubbleReducer.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useRef, useState } from 'react';
+// Create a context with a default NOOP dispatcher
+const BubbleReducerDispatchContext = createContext((_action) => {
+    // NOOP
+});
+export const useBubblingReducer = (reducer, initialState) => {
+    const ref = useRef(initialState);
+    // Use useState so we can leverage functional updates
+    const [state, setState] = useState(ref.current);
+    // Get the parent dispatch from the context
+    const parentDispatch = useContext(BubbleReducerDispatchContext);
+    // Custom Dispatch using functional updates
+    const dispatch = (action) => {
+        const [newState, preventBubble] = reducer(ref.current, action);
+        if (preventBubble) {
+            // If the action was handled, update state
+            ref.current = newState;
+            setState(newState);
+        }
+        else {
+            parentDispatch(action);
+        }
+    };
+    return [state, dispatch];
+};
+export const BubbleReducerDispatchProvider = ({ children, dispatch }) => (_jsx(BubbleReducerDispatchContext.Provider, { value: dispatch, children: children }));

package/lib/esm/hooks/useQpq.d.ts

@@ -0,0 +1,2 @@
+import { ActionProcessorListResolver, StoryResolver } from 'quidproquo-core';
+export declare function useQpq(getActionProcessors?: ActionProcessorListResolver): StoryResolver;

package/lib/esm/hooks/useQpq.js

@@ -0,0 +1,30 @@
+import { getCoreActionProcessor } from 'quidproquo-actionprocessor-node';
+import { createRuntime, defineModule, QpqRuntimeType, } from 'quidproquo-core';
+// WIP ~ useFastCallback, wack things like loggers in a context, try to only make once instance of the runtime.
+// Also don't create every refresh.. useMemo / useCallback etc
+export function useQpq(getActionProcessors = async () => ({})) {
+    const logger = {
+        enableLogs: async () => { },
+        log: async () => { },
+        waitToFinishWriting: async () => { },
+        moveToPermanentStorage: async () => { },
+    };
+    const resolveStory = createRuntime([defineModule('UI')], {
+        depth: 0,
+        context: {},
+    }, async (qpqConfig, dynamicModuleLoader) => ({
+        ...(await getCoreActionProcessor(qpqConfig, dynamicModuleLoader)),
+        ...(await getActionProcessors(qpqConfig, dynamicModuleLoader)),
+    }), () => new Date().toISOString(), logger, `frontend::${'uuid'}`, QpqRuntimeType.UI, async (_runtime) => {
+        // noop
+    });
+    return function getStoryExecutor(story) {
+        return async (...args) => {
+            const result = await resolveStory(story, args);
+            if (result.error) {
+                throw new Error(result.error.errorText);
+            }
+            return result.result;
+        };
+    };
+}

package/lib/esm/hooks/useQpqReducer/actionProcessor/getStateDispatchActionProcessor.d.ts

@@ -0,0 +1,3 @@
+import { ActionProcessorListResolver } from 'quidproquo-core';
+import { Dispatch } from 'react';
+export declare const getStateDispatchActionListResolver: (dispatch: Dispatch<any>) => ActionProcessorListResolver;

package/lib/esm/hooks/useQpqReducer/actionProcessor/getStateDispatchActionProcessor.js

@@ -0,0 +1,8 @@
+import { actionResult, StateActionType } from 'quidproquo-core';
+const getProcessStateDispatch = (dispatch) => async ({ action }) => {
+    dispatch(action);
+    return actionResult(undefined);
+};
+export const getStateDispatchActionListResolver = (dispatch) => async (_qpqConfig, _dynamicModuleLoader) => ({
+    [StateActionType.Dispatch]: getProcessStateDispatch(dispatch),
+});

package/lib/esm/hooks/useQpqReducer/actionProcessor/index.d.ts

@@ -0,0 +1 @@
+export * from './getStateDispatchActionProcessor';

package/lib/esm/hooks/useQpqReducer/actionProcessor/index.js

@@ -0,0 +1 @@
+export * from './getStateDispatchActionProcessor';

package/lib/esm/hooks/useQpqReducer/index.d.ts

@@ -0,0 +1 @@
+export * from './useQpqReducer';

package/lib/esm/hooks/useQpqReducer/index.js

@@ -0,0 +1 @@
+export * from './useQpqReducer';

package/lib/esm/hooks/useQpqReducer/useQpqReducer.d.ts

@@ -0,0 +1 @@
+export declare const useQpqReducer: () => void;

package/lib/esm/hooks/useQpqReducer/useQpqReducer.js

@@ -0,0 +1,59 @@
+/*
+import { AskResponseReturnType, Story } from 'quidproquo-core';
+
+import { useMemo, useState } from 'react';
+
+import { QpqBubbleReducer, useBubblingReducer } from '../useBubbleReducer';
+import { useQpq } from '../useQpq';
+import { getStateDispatchActionListResolver } from './actionProcessor';
+
+// Helper type to remap keys from "askXyz" to "xyz" (with lowercase first letter)
+type RemoveAskPrefix<K extends string> = K extends `ask${infer R}` ? Uncapitalize<R> : never;
+
+// Define the mapped API type.
+// We extract only string keys and then use a conditional type to infer parameters and return type.
+type MappedApi<TApi extends Record<`ask${string}`, Story<any, any>>> = {
+  [K in Extract<keyof TApi, string> as RemoveAskPrefix<K>]: TApi[K] extends (...args: infer P) => infer R
+    ? (...args: P) => Promise<AskResponseReturnType<R>>
+    : never;
+};
+
+export function useQpqReducer<
+  TState,
+  TAction,
+  // Constrain TApi so that all keys must start with "ask"
+  TApi extends Record<`ask${string}`, Story<any, any>>,
+>(
+  apiGenerators: TApi,
+  reducer: QpqBubbleReducer<TState, TAction> = (s) => [s, false],
+  initialState: TState = {} as TState,
+): [MappedApi<TApi>, TState, (action: any) => void] {
+  const [state, dispatch] = useBubblingReducer(reducer, initialState);
+
+  // Api generators are memoized to prevent unnecessary re-renders.
+  const [memoedApiGenerators] = useState(() => apiGenerators);
+  const resolver = useQpq(getStateDispatchActionListResolver(dispatch));
+
+  // Wrap and remap each API generator using the resolver.
+  const api = useMemo(() => {
+    const wrapped = {} as MappedApi<TApi>;
+    for (const key in memoedApiGenerators) {
+      if (Object.prototype.hasOwnProperty.call(memoedApiGenerators, key)) {
+        // Remove the 'ask' prefix and lower-case the first character.
+        const withoutAsk = key.slice(3); // e.g., "FetchTodos"
+        const newKey = withoutAsk.charAt(0).toLowerCase() + withoutAsk.slice(1); // "fetchTodos"
+        // We know newKey matches our mapped type so we can assign.
+        // (A type assertion is used here to quiet the compiler.)
+        wrapped[newKey as RemoveAskPrefix<typeof key>] = resolver(memoedApiGenerators[key as any]) as any;
+      }
+    }
+    return wrapped;
+  }, [resolver, memoedApiGenerators]);
+
+  return [api, state, dispatch];
+}
+
+*/
+export const useQpqReducer = () => {
+    // NOOP
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quidproquo-web-react",
-  "version": "0.0.248",
+  "version": "0.0.249",
   "description": "",
   "main": "./lib/commonjs/index.js",
   "module": "./lib/esm/index.js",
@@ -32,10 +32,10 @@
   },
   "homepage": "https://github.com/joe-coady/quidproquo#readme",
   "devDependencies": {
-    "quidproquo-core": "0.0.248",
-    "quidproquo-tsconfig": "0.0.248",
-    "quidproquo-webserver": "0.0.248",
-    "quidproquo-web": "0.0.248",
+    "quidproquo-core": "0.0.249",
+    "quidproquo-tsconfig": "0.0.249",
+    "quidproquo-webserver": "0.0.249",
+    "quidproquo-web": "0.0.249",
     "typescript": "^4.9.3"
   },
   "peerDependencies": {