cogsbox-state 0.5.459 → 0.5.460

package/src/CogsState.tsx

@@ -251,7 +251,8 @@ export type ValidationError = {
 };
 type EffectFunction<T, R> = (state: T, deps: any[]) => R;
 export type EndType<T, IsArrayElement = false> = {
-  addValidation: (errors: ValidationError[]) => void;
+  addZodValidation: (errors: ValidationError[]) => void;
+  clearZodValidation: (paths?: string[]) => void;
   applyJsonPatch: (patches: any[]) => void;
   update: UpdateType<T>;
   _path: string[];
@@ -297,7 +298,7 @@ export type StateObject<T> = (T extends any[]
     getAllFormRefs: () => Map<string, React.RefObject<any>>;
     _componentId: string | null;
     getComponents: () => ComponentsType;
-    validateZodSchema: () => void;
+
     _initialState: T;
     updateInitialState: (newState: T | null) => {
       fetchId: (field: keyof T) => string | number;
@@ -375,12 +376,23 @@ type ValidationOptionsType = {
 
   onBlur?: boolean;
 };
+type UseSyncType<T> = (state: T, a: SyncOptionsType<any>) => SyncApi;
+type SyncOptionsType<TApiParams> = {
+  apiParams: TApiParams;
+  stateKey?: string;
+  stateRoom:
+    | number
+    | string
+    | (({ clientId }: { clientId: string }) => string | null);
+  connect?: boolean;
+  inMemoryState?: boolean;
+};
 export type OptionsType<T extends unknown = unknown, TApiParams = never> = {
   log?: boolean;
   componentId?: string;
-  cogsSync?: (stateObject: StateObject<T>) => SyncApi;
-  validation?: ValidationOptionsType;
+  syncOptions?: SyncOptionsType<TApiParams>;
 
+  validation?: ValidationOptionsType;
   serverState?: {
     id?: string | number;
     data?: T;
@@ -390,9 +402,10 @@ export type OptionsType<T extends unknown = unknown, TApiParams = never> = {
       | boolean
       | {
           strategy: 'append' | 'prepend' | 'diff';
-          key?: string; // For diff strategy - which field to use as unique identifier
+          key?: string;
         };
   };
+
   sync?: {
     action: (state: T) => Promise<{
       success: boolean;
@@ -481,7 +494,6 @@ function setAndMergeOptions(stateKey: string, newOptions: OptionsType<any>) {
     ...newOptions,
   });
 }
-
 function setOptions<StateKey, Opt>({
   stateKey,
   options,
@@ -525,10 +537,19 @@ function setOptions<StateKey, Opt>({
     }
   }
 
+  // Always preserve syncOptions if it exists in mergedOptions but not in options
+  if (
+    mergedOptions.syncOptions &&
+    (!options || !options.hasOwnProperty('syncOptions'))
+  ) {
+    needToAdd = true;
+  }
+
   if (needToAdd) {
     setInitialStateOptions(stateKey as string, mergedOptions);
   }
 }
+
 export function addStateOptions<T extends unknown>(
   initialState: T,
   { formElements, validation }: OptionsType<T>
@@ -551,11 +572,12 @@ export const createCogsState = <State extends Record<StateKeys, unknown>>(
     validation?: ValidationOptionsType;
     __fromSyncSchema?: boolean;
     __syncNotifications?: Record<string, Function>;
-    __apiParamsMap?: Record<string, any>; // Add this
+    __apiParamsMap?: Record<string, any>;
+    __useSync?: UseSyncType<State>;
   }
 ) => {
   let newInitialState = initialState;
-
+  console.log('optsc', opt?.__useSync);
   const [statePart, initialOptionsPart] =
     transformStateFunc<State>(newInitialState);
 
@@ -626,17 +648,10 @@ export const createCogsState = <State extends Record<StateKeys, unknown>>(
     options?: Prettify<OptionsType<(typeof statePart)[StateKey]>>
   ) => {
     const [componentId] = useState(options?.componentId ?? uuidv4());
-    const apiParamsSchema = opt?.__apiParamsMap?.[stateKey as string];
-
-    // Merge apiParams into options
-    const enhancedOptions = {
-      ...options,
-      apiParamsSchema, // Add the schema here
-    } as any;
 
     setOptions({
       stateKey,
-      options: enhancedOptions,
+      options,
       initialOptionsPart,
     });
     const thiState =
@@ -657,6 +672,8 @@ export const createCogsState = <State extends Record<StateKeys, unknown>>(
       defaultState: options?.defaultState as any,
       dependencies: options?.dependencies,
       serverState: options?.serverState,
+      syncOptions: options?.syncOptions,
+      __useSync: opt?.__useSync as UseSyncType<(typeof statePart)[StateKey]>,
     });
 
     return updater;
@@ -682,17 +699,27 @@ export const createCogsState = <State extends Record<StateKeys, unknown>>(
 type UseCogsStateHook<
   T extends Record<string, any>,
   TApiParamsMap extends Record<string, any> = Record<string, never>,
-> = <StateKey extends keyof TransformedStateType<T>>(
+> = <StateKey extends keyof TransformedStateType<T> & string>(
   stateKey: StateKey,
   options?: Prettify<
-    OptionsType<TransformedStateType<T>[StateKey]> & {
-      apiParams?: StateKey extends keyof TApiParamsMap
-        ? TApiParamsMap[StateKey]
-        : never;
-    }
+    OptionsType<TransformedStateType<T>[StateKey], TApiParamsMap[StateKey]> &
+      // This is the conditional part that solves the problem
+      ([keyof TApiParamsMap] extends [never]
+        ? // If TApiParamsMap has NO keys, intersect with an empty object.
+          // This means `syncOptions` is NOT a valid property.
+          {}
+        : // If TApiParamsMap HAS keys, intersect with a type that REQUIRES `syncOptions`.
+          {
+            syncOptions: Prettify<
+              SyncOptionsType<
+                StateKey extends keyof TApiParamsMap
+                  ? TApiParamsMap[StateKey]
+                  : never
+              >
+            >;
+          })
   >
 ) => StateObject<TransformedStateType<T>[StateKey]>;
-
 // Updated CogsApi type
 type CogsApi<
   T extends Record<string, any>,
@@ -704,9 +731,9 @@ type CogsApi<
 type GetParamType<SchemaEntry> = SchemaEntry extends {
   api?: { queryData?: { _paramType?: infer P } };
 }
-  ? P // If the full path exists, infer the parameter type P.
-  : never; // Otherwise, the type is 'never', meaning no params.
-// Fixed createCogsStateFromSync return type
+  ? P
+  : never;
+
 export function createCogsStateFromSync<
   TSyncSchema extends {
     schemas: Record<
@@ -722,7 +749,8 @@ export function createCogsStateFromSync<
     notifications: Record<string, any>;
   },
 >(
-  syncSchema: TSyncSchema
+  syncSchema: TSyncSchema,
+  useSync: UseSyncType<any>
 ): CogsApi<
   {
     [K in keyof TSyncSchema['schemas']]: TSyncSchema['schemas'][K]['schemas']['defaultValues'];
@@ -748,20 +776,18 @@ export function createCogsStateFromSync<
     }
   }
 
-  // Pass the sync schema metadata to createCogsState
   return createCogsState(initialState, {
     __fromSyncSchema: true,
     __syncNotifications: syncSchema.notifications,
     __apiParamsMap: apiParamsMap,
+    __useSync: useSync,
   }) as any;
 }
 const {
   getInitialOptions,
-  getValidationErrors,
+
   setStateLog,
   updateInitialStateGlobal,
-  addValidationError,
-  removeValidationError,
 } = getGlobalStore.getState();
 const saveToLocalStorage = <T,>(
   state: T,
@@ -951,122 +977,6 @@ function markEntireStateAsServerSynced(
   }
 }
 
-const _notifySubscribedComponents = (
-  stateKey: string,
-  path: string[],
-  updateType: 'update' | 'insert' | 'cut',
-  oldValue: any,
-  newValue: any
-) => {
-  const store = getGlobalStore.getState();
-  const rootMeta = store.getShadowMetadata(stateKey, []);
-  if (!rootMeta?.components) {
-    return;
-  }
-
-  const notifiedComponents = new Set<string>();
-  const shadowMeta = store.getShadowMetadata(stateKey, path);
-
-  // --- PASS 1: Notify specific subscribers based on update type ---
-
-  if (updateType === 'update') {
-    if (shadowMeta?.pathComponents) {
-      shadowMeta.pathComponents.forEach((componentId) => {
-        if (notifiedComponents.has(componentId)) return;
-        const component = rootMeta.components?.get(componentId);
-        if (component) {
-          const reactiveTypes = Array.isArray(component.reactiveType)
-            ? component.reactiveType
-            : [component.reactiveType || 'component'];
-          if (!reactiveTypes.includes('none')) {
-            component.forceUpdate();
-            notifiedComponents.add(componentId);
-          }
-        }
-      });
-    }
-
-    if (
-      newValue &&
-      typeof newValue === 'object' &&
-      !isArray(newValue) &&
-      oldValue &&
-      typeof oldValue === 'object' &&
-      !isArray(oldValue)
-    ) {
-      const changedSubPaths = getDifferences(newValue, oldValue);
-      changedSubPaths.forEach((subPathString) => {
-        const subPath = subPathString.split('.');
-        const fullSubPath = [...path, ...subPath];
-        const subPathMeta = store.getShadowMetadata(stateKey, fullSubPath);
-        if (subPathMeta?.pathComponents) {
-          subPathMeta.pathComponents.forEach((componentId) => {
-            if (notifiedComponents.has(componentId)) return;
-            const component = rootMeta.components?.get(componentId);
-            if (component) {
-              const reactiveTypes = Array.isArray(component.reactiveType)
-                ? component.reactiveType
-                : [component.reactiveType || 'component'];
-              if (!reactiveTypes.includes('none')) {
-                component.forceUpdate();
-                notifiedComponents.add(componentId);
-              }
-            }
-          });
-        }
-      });
-    }
-  } else if (updateType === 'insert' || updateType === 'cut') {
-    const parentArrayPath = updateType === 'insert' ? path : path.slice(0, -1);
-    const parentMeta = store.getShadowMetadata(stateKey, parentArrayPath);
-    if (parentMeta?.pathComponents) {
-      parentMeta.pathComponents.forEach((componentId) => {
-        if (!notifiedComponents.has(componentId)) {
-          const component = rootMeta.components?.get(componentId);
-          if (component) {
-            component.forceUpdate();
-            notifiedComponents.add(componentId);
-          }
-        }
-      });
-    }
-  }
-
-  // --- PASS 2: Notify global subscribers ('all', 'deps') ---
-
-  rootMeta.components.forEach((component, componentId) => {
-    if (notifiedComponents.has(componentId)) {
-      return;
-    }
-
-    const reactiveTypes = Array.isArray(component.reactiveType)
-      ? component.reactiveType
-      : [component.reactiveType || 'component'];
-
-    if (reactiveTypes.includes('all')) {
-      component.forceUpdate();
-      notifiedComponents.add(componentId);
-      return;
-    }
-
-    if (reactiveTypes.includes('deps')) {
-      if (component.depsFunction) {
-        const currentState = store.getShadowValue(stateKey);
-        const newDeps = component.depsFunction(currentState);
-        let shouldUpdate = false;
-        if (newDeps === true || !isDeepEqual(component.prevDeps, newDeps)) {
-          if (Array.isArray(newDeps)) component.prevDeps = newDeps;
-          shouldUpdate = true;
-        }
-        if (shouldUpdate) {
-          component.forceUpdate();
-          notifiedComponents.add(componentId);
-        }
-      }
-    }
-  });
-};
-
 export function useCogsStateFn<TStateObject extends unknown>(
   stateObject: TStateObject,
   {
@@ -1081,12 +991,14 @@ export function useCogsStateFn<TStateObject extends unknown>(
     syncUpdate,
     dependencies,
     serverState,
-    apiParamsSchema,
+    __useSync,
+    syncOptions,
   }: {
     stateKey?: string;
     componentId?: string;
     defaultState?: TStateObject;
-    apiParamsSchema?: z.ZodObject<any>; // Add this type
+    __useSync?: UseSyncType<TStateObject>;
+    syncOptions?: SyncOptionsType<any>;
   } & OptionsType<TStateObject> = {}
 ) {
   const [reactiveForce, forceUpdate] = useState({}); //this is the key to reactivity
@@ -1189,7 +1101,7 @@ export function useCogsStateFn<TStateObject extends unknown>(
       .subscribeToPath(thisKey, (event) => {
         if (event?.type === 'SERVER_STATE_UPDATE') {
           const serverStateData = event.serverState;
-
+          console.log('SERVER_STATE_UPDATE', event);
           if (
             serverStateData?.status === 'success' &&
             serverStateData.data !== undefined
@@ -1208,13 +1120,12 @@ export function useCogsStateFn<TStateObject extends unknown>(
               .getState()
               .getShadowValue(thisKey);
             const incomingData = serverStateData.data;
-
             if (
               mergeConfig &&
               Array.isArray(currentState) &&
               Array.isArray(incomingData)
             ) {
-              const keyField = mergeConfig.key || 'id';
+              const keyField = mergeConfig.key;
               const existingIds = new Set(
                 currentState.map((item: any) => item[keyField])
               );
@@ -1656,11 +1567,7 @@ export function useCogsStateFn<TStateObject extends unknown>(
     const newState = getGlobalStore.getState().getShadowValue(thisKey);
     const rootMeta = getGlobalStore.getState().getShadowMetadata(thisKey, []);
     const notifiedComponents = new Set<string>();
-    console.log(
-      'rootMeta',
-      thisKey,
-      getGlobalStore.getState().shadowStateStore
-    );
+
     if (!rootMeta?.components) {
       return newState;
     }
@@ -1895,9 +1802,14 @@ export function useCogsStateFn<TStateObject extends unknown>(
     );
   }, [thisKey, sessionId]);
 
-  const cogsSyncFn = latestInitialOptionsRef.current?.cogsSync;
+  const cogsSyncFn = __useSync;
+  const syncOpt = latestInitialOptionsRef.current?.syncOptions;
+
   if (cogsSyncFn) {
-    syncApiRef.current = cogsSyncFn(updaterFinal);
+    syncApiRef.current = cogsSyncFn(
+      updaterFinal as any,
+      syncOpt ?? ({} as any)
+    );
   }
 
   return updaterFinal;
@@ -2169,14 +2081,14 @@ function createProxyHandler<T>(
                 response.errors &&
                 validationKey
               ) {
-                getGlobalStore.getState().removeValidationError(validationKey);
-                response.errors.forEach((error) => {
-                  const errorPath = [validationKey, ...error.path].join('.');
-                  getGlobalStore
-                    .getState()
-                    .addValidationError(errorPath, error.message);
-                });
-                notifyComponents(stateKey);
+                //  getGlobalStore.getState().removeValidationError(validationKey);
+                // response.errors.forEach((error) => {
+                //   const errorPath = [validationKey, ...error.path].join('.');
+                //   getGlobalStore
+                //     .getState()
+                //     .addValidationError(errorPath, error.message);
+                // });
+                //   notifyComponents(stateKey);
               }
 
               if (response?.success) {
@@ -3566,18 +3478,61 @@ function createProxyHandler<T>(
           return componentId;
         }
         if (path.length == 0) {
-          if (prop === 'addValidation') {
-            return (errors: ValidationError[]) => {
+          if (prop === 'addZodValidation') {
+            return (zodErrors: any[]) => {
               const init = getGlobalStore
                 .getState()
                 .getInitialOptions(stateKey)?.validation;
               if (!init?.key) throw new Error('Validation key not found');
-              removeValidationError(init.key);
-              errors.forEach((error) => {
-                const fullErrorPath = [init.key, ...error.path].join('.');
-                addValidationError(fullErrorPath, error.message);
+
+              // For each error, set shadow metadata
+              zodErrors.forEach((error) => {
+                const currentMeta =
+                  getGlobalStore
+                    .getState()
+                    .getShadowMetadata(stateKey, error.path) || {};
+
+                getGlobalStore
+                  .getState()
+                  .setShadowMetadata(stateKey, error.path, {
+                    ...currentMeta,
+                    validation: {
+                      status: 'VALIDATION_FAILED',
+                      message: error.message,
+                      validatedValue: undefined,
+                    },
+                  });
+                getGlobalStore.getState().notifyPathSubscribers(error.path, {
+                  type: 'VALIDATION_FAILED',
+                  message: error.message,
+                  validatedValue: undefined,
+                });
               });
-              notifyComponents(stateKey);
+            };
+          }
+          if (prop === 'clearZodValidation') {
+            return (path?: string[]) => {
+              // Clear specific paths
+              if (!path) {
+                throw new Error('clearZodValidation requires a path');
+                return;
+              }
+              const currentMeta =
+                getGlobalStore.getState().getShadowMetadata(stateKey, path) ||
+                {};
+
+              if (currentMeta.validation) {
+                getGlobalStore.getState().setShadowMetadata(stateKey, path, {
+                  ...currentMeta,
+                  validation: undefined,
+                });
+
+                getGlobalStore
+                  .getState()
+                  .notifyPathSubscribers([stateKey, ...path].join('.'), {
+                    type: 'VALIDATION_CLEARED',
+                  });
+              }
             };
           }
           if (prop === 'applyJsonPatch') {
@@ -3617,7 +3572,7 @@ function createProxyHandler<T>(
                         stateKey,
                         currentPath
                       );
-                      console.log('pathMeta', pathMeta);
+
                       if (pathMeta?.pathComponents) {
                         pathMeta.pathComponents.forEach((componentId) => {
                           if (!notifiedComponents.has(componentId)) {
@@ -3670,51 +3625,6 @@ function createProxyHandler<T>(
               }
             };
           }
-          if (prop === 'validateZodSchema') {
-            return () => {
-              const init = getGlobalStore
-                .getState()
-                .getInitialOptions(stateKey)?.validation;
-
-              // UPDATED: Select v4 schema, with a fallback to v3
-              const zodSchema = init?.zodSchemaV4 || init?.zodSchemaV3;
-
-              if (!zodSchema || !init?.key) {
-                throw new Error(
-                  'Zod schema (v3 or v4) or validation key not found'
-                );
-              }
-
-              removeValidationError(init.key);
-              const thisObject = getGlobalStore
-                .getState()
-                .getShadowValue(stateKey);
-
-              // Use the selected schema for parsing
-              const result = zodSchema.safeParse(thisObject);
-
-              if (!result.success) {
-                // This logic already handles both v3 and v4 error types correctly
-                if ('issues' in result.error) {
-                  // Zod v4 error
-                  result.error.issues.forEach((error) => {
-                    const fullErrorPath = [init.key, ...error.path].join('.');
-                    addValidationError(fullErrorPath, error.message);
-                  });
-                } else {
-                  // Zod v3 error
-                  (result.error as any).errors.forEach((error: any) => {
-                    const fullErrorPath = [init.key, ...error.path].join('.');
-                    addValidationError(fullErrorPath, error.message);
-                  });
-                }
-
-                notifyComponents(stateKey);
-                return false;
-              }
-              return true;
-            };
-          }
 
           if (prop === 'getComponents')
             return () =>
@@ -3834,22 +3744,10 @@ function createProxyHandler<T>(
   }
 
   const baseObj = {
-    removeValidation: (obj?: { validationKey?: string }) => {
-      if (obj?.validationKey) {
-        removeValidationError(obj.validationKey);
-      }
-    },
     revertToInitialState: (obj?: { validationKey?: string }) => {
       const init = getGlobalStore
         .getState()
         .getInitialOptions(stateKey)?.validation;
-      if (init?.key) {
-        removeValidationError(init.key);
-      }
-
-      if (obj?.validationKey) {
-        removeValidationError(obj.validationKey);
-      }
 
       const shadowMeta = getGlobalStore
         .getState()
@@ -4486,6 +4384,7 @@ function FormElementWrapper({
                 validation: {
                   status: 'VALID_LIVE',
                   validatedValue: newValue,
+                  message: undefined,
                 },
               });
             }
@@ -4496,6 +4395,7 @@ function FormElementWrapper({
               validation: {
                 status: 'VALID_LIVE',
                 validatedValue: newValue,
+                message: undefined,
               },
             });
           }

package/src/TRPCValidationLink.ts

@@ -1,3 +1,4 @@
+//@ts-nocheck
 import { observable } from '@trpc/server/observable';
 import type { AnyRouter } from '@trpc/server';
 import type { TRPCLink } from '@trpc/client';

package/src/store.ts

@@ -251,10 +251,6 @@ export type CogsGlobalState = {
   setInitialStateOptions: (key: string, value: OptionsType) => void;
 
   // --- Validation ---
-  validationErrors: Map<string, string[]>;
-  addValidationError: (path: string, message: string) => void;
-  getValidationErrors: (path: string) => string[];
-  removeValidationError: (path: string) => void;
 
   // --- Server Sync and Logging ---
 
@@ -863,95 +859,6 @@ export const getGlobalStore = create<CogsGlobalState>((set, get) => ({
     });
   },
 
-  addValidationError: (path, message) => {
-    set((prev) => {
-      const updatedErrors = new Map(prev.validationErrors);
-      const existingMessages = updatedErrors.get(path) || [];
-      console.log('addValidationError', path, message, existingMessages);
-      // Append the new message instead of replacing
-      updatedErrors.set(path, [...existingMessages, message]);
-      return { validationErrors: updatedErrors };
-    });
-  },
-  removeValidationError: (path) => {
-    set((prev) => {
-      const updatedErrors = new Map(prev.validationErrors);
-
-      let doSomething = false;
-      const pathArray = path.split('.');
-      Array.from(updatedErrors.keys()).forEach((key) => {
-        const keyArray = key.split('.');
-        if (keyArray.length >= pathArray.length) {
-          let match = true;
-          for (let i = 0; i < pathArray.length; i++) {
-            if (keyArray[i] !== pathArray[i]) {
-              match = false;
-              break;
-            }
-          }
-
-          if (match) {
-            doSomething = true;
-            updatedErrors.delete(key);
-          }
-        }
-      });
-
-      return doSomething ? { validationErrors: updatedErrors } : prev;
-    });
-  },
-  getValidationErrors: (path: string) => {
-    const errors: string[] = [];
-    const valErrors = get().validationErrors;
-    const pathArray = path.split('.');
-
-    // Helper to check if an index matches either a wildcard or is in an array of indices
-    const isIndexMatch = (pathSegment: string, keySegment: string) => {
-      if (pathSegment === '[*]') return true;
-      if (Array.isArray(pathSegment)) {
-        return pathSegment.includes(parseInt(keySegment));
-      }
-      return pathSegment === keySegment;
-    };
-
-    Array.from(valErrors.keys()).forEach((key) => {
-      const keyArray = key.split('.');
-      if (keyArray.length >= pathArray.length) {
-        let match = true;
-        for (let i = 0; i < pathArray.length; i++) {
-          const pathSegment = pathArray[i];
-          const keySegment = keyArray[i]!;
-
-          // If current path segment is a number or [*], we need special handling
-          if (pathSegment === '[*]' || Array.isArray(pathSegment)) {
-            // Key segment should be a number if we're using [*] or array indices
-            const keyIndex = parseInt(keySegment);
-            if (isNaN(keyIndex)) {
-              match = false;
-              break;
-            }
-
-            if (!isIndexMatch(pathSegment, keySegment)) {
-              match = false;
-              break;
-            }
-          } else if (pathSegment !== keySegment) {
-            match = false;
-            break;
-          }
-        }
-
-        if (match) {
-          const errorMessages = valErrors.get(key);
-          if (errorMessages) {
-            errors.push(...errorMessages);
-          }
-        }
-      }
-    });
-
-    return errors;
-  },
   getInitialOptions: (key) => {
     return get().initialStateOptions[key];
   },