react-hook-core 0.1.16 → 0.1.18

package/src/route.ts

@@ -1,47 +1,87 @@
-import * as qs from 'query-string';
-
-export function buildFromUrl<S>(): S {
-  return buildParameters(window.location.search);
-}
-export function buildParameters<T>(url: string): T {
-
-  let urlSearch = url;
-  const i = urlSearch.indexOf('?');
-  if (i >= 0) {
-    urlSearch = url.substring(i + 1);
-  }
-  try {
-    const parsed: any = convertToObject(qs.parse(urlSearch));
-    return parsed;
-    
-  } catch (error) {
-    console.log(error);
-    throw error;
-  }
-}
-
-export function convertToObject(input: any) {
-  const output = {};
-
-  for (let key in input) {
-    const value = input[key];
-    const keys = key.split('.');
-
-    let currentObj = output as any;
-    for (let i = 0; i < keys.length; i++) {
-      const currentKey = keys[i];
-
-      if (!currentObj[currentKey]) {
-        if (i === keys.length - 1) {
-          currentObj[currentKey] = value;
-        } else {
-          currentObj[currentKey] = {};
-        }
-      }
-
-      currentObj = currentObj[currentKey];
-    }
-  }
-
-  return output;
-}
+import * as qs from "query-string";
+
+export function buildFromUrl<S>(modelT?: S): S {
+  return buildParameters<S>(window.location.search, modelT);
+}
+export function buildParameters<T>(url: string, model?: T): T {
+  let urlSearch = url;
+  const i = urlSearch.indexOf("?");
+  if (i >= 0) {
+    urlSearch = url.substring(i + 1);
+  }
+  try {
+    const parsed: any = convertToObject<T>(qs.parse(urlSearch), model);
+    return parsed;
+  } catch (error) {
+    console.log(error);
+    throw error;
+  }
+}
+
+export function convertToObject<T>(input: any, model?: T): T {
+  if (model){
+   return parseToModel(input, model);
+  }
+  const output: any = {};
+
+  for (let key in input) {
+    const value = input[key];
+    const keys = key.split(".");
+
+    let currentObj: any = output;
+    for (let i = 0; i < keys.length; i++) {
+      const currentKey = keys[i];
+
+      if (!currentObj[currentKey]) {
+        if (i === keys.length - 1) {
+          currentObj[currentKey] = parseValue(value);
+        } else {
+          currentObj[currentKey] = {};
+        }
+      }
+
+      currentObj = currentObj[currentKey];
+    }
+  }
+
+  return output as T;
+}
+
+function parseToModel(dest: any, src: any) {
+  if (typeof dest !== 'object' || typeof src !== 'object') {
+    return dest;
+  }
+  dest = convertToObject(dest)
+  for (let key in src) {
+    if (!Object.hasOwn(dest, key)) continue;
+    if (src.hasOwnProperty(key)) {
+      if (src[key] && src[key].constructor === Object) {
+        if (!dest[key] || dest[key].constructor !== Object) {
+          dest[key] = {};
+        }
+        parseToModel(dest[key], src[key]);
+      } else if (src[key] instanceof Date) {
+        dest[key] = new Date(dest[key]);
+      } else if (typeof src[key] === 'boolean') {
+        if (dest[key].length >0){
+          dest[key] = new Boolean(dest[key]);
+        }
+      } else if (typeof src[key] === 'number') {
+        if ( typeof dest[key] === 'string' && dest[key].indexOf(".") !== -1){
+          dest[key] = parseFloat(dest[key]);
+        }else{
+          dest[key] = parseInt(dest[key], 10);
+        }
+      }
+    }
+  }
+  return dest;
+}
+
+function parseValue(value: any): any {
+  // Check if the value is a string representing a number and parse it to a number
+  if (!isNaN(value) && !isNaN(parseFloat(value))) {
+    return parseFloat(value);
+  }
+  return value;
+}

package/src/search.ts

@@ -36,6 +36,7 @@ export interface Sortable {
 export interface Pagination {
   initPageSize?: number;
   pageSize?: number;
+  limit?: number;
   pageIndex?: number;
   total?: number;
   pages?: number;
@@ -171,13 +172,19 @@ export function changePage(com: Pagination, pageIndex: number, pageSize: number)
   com.append = false;
 }
 export function optimizeFilter<S extends Filter>(obj: S, searchable: Searchable, fields?: string[]): S {
+  const sLimit = searchable.limit;
   obj.fields = fields;
   if (searchable.pageIndex && searchable.pageIndex > 1) {
     obj.page = searchable.pageIndex;
   } else {
     delete obj.page;
   }
-  obj.limit = searchable.pageSize;
+  if (sLimit){
+    obj.limit = searchable.limit;
+  }else{
+    obj.limit = searchable.pageSize;
+  }
+
   if (searchable.appendMode && searchable.initPageSize !== searchable.pageSize) {
     obj.firstLimit = searchable.initPageSize;
   } else {
@@ -194,21 +201,19 @@ export function optimizeFilter<S extends Filter>(obj: S, searchable: Searchable,
   return obj;
 }
 
-function mapObjects(objA: any, objB: any): void {
-  for (let key in objA) {
-    if (objB.hasOwnProperty(key) && objB[key] !== null && objB[key] !== undefined) {
-      if(Array.isArray(objA[key])) {
-        objA[key] = [];
-        if(!(Array.isArray(objB[key]) && objB[key].length === 0) &&typeof objB[key] === 'string') {
-          const arrayObjKeyB = objB[key].length > 0 ?  (objB[key])?.split(',') : [];
-          if(arrayObjKeyB && arrayObjKeyB.length > 1) {
-            objA[key] = [...arrayObjKeyB];
+function mapObjects(dest: any, src: any): void {
+  for (let key in dest) {
+    if (src.hasOwnProperty(key) && src[key] !== null && src[key] !== undefined) {
+      if(Array.isArray(dest[key]) && typeof src[key] === 'string' && src[key].length > 0) {
+          const arrayObjKeySrc = src[key].length > 0 ?  (src[key])?.split(',') : [];
+          if(arrayObjKeySrc && arrayObjKeySrc.length > 1) {
+            dest[key] = [...arrayObjKeySrc];
           } else {
-            objA[key].push(objB[key])
+            dest[key] = [];
+            dest[key].push(src[key])
           }
-        }
       } else {
-        objA[key] = objB[key];
+        dest[key] = src[key];
       }
     }
   }
@@ -576,6 +581,7 @@ export function toggleSortStyle(target: HTMLElement): string {
 }
 export function getModel<T, S extends Filter>(state: any, modelName: string, searchable: Searchable, fields?: string[], excluding?: string[]|number[]): S {
   let obj2 = getModelFromState(state, modelName);
+
   const obj: any = obj2 ? obj2 : {};
   const obj3 = optimizeFilter(obj, searchable, fields);
   obj3.excluding = excluding;

package/src/state.ts

@@ -75,6 +75,7 @@ export function buildState<S, K extends keyof S>(e: any, state: Readonly<S>, ctr
       const dataField = ctrl.getAttribute('data-field');
       const field = (dataField ? dataField : ctrl.name);
       const model = Object.assign({}, ex);
+      const dType= 'array'
       if (type && type.toLowerCase() === 'checkbox') {
         let value = model[field];
         if (ctrl.id && ctrl.name !== ctrl.id) {
@@ -82,7 +83,14 @@ export function buildState<S, K extends keyof S>(e: any, state: Readonly<S>, ctr
             value = [];
           }
           value.includes(ctrl.value) ? value = value.filter((v: string) => v !== ctrl.value) : value.push(ctrl.value);
+          // if (dType == 'array'){
+          //   if (value === 'string'){
+          //     value = [value]
+          //   }
+          // }
           model[field] = value;
+          // console.log(model,  modelName, model, model[field], field, value )
+          // setValue(model, field, value);
         } else {
           const v = valueOfCheckbox(ctrl);
           model[field] = v;
@@ -103,7 +111,7 @@ export function buildState<S, K extends keyof S>(e: any, state: Readonly<S>, ctr
         const objSet: any = {};
         try {
           const selectedDate = new Date(ctrl.value);
-          setValue(model, field, ctrl.value && ctrl.value!== '' ? selectedDate.toISOString() : '');
+          setValue(model, field, ctrl.value && ctrl.value!== '' ? selectedDate.toISOString() : null);
           objSet[modelName] = model;
           return objSet;
         } catch (error) {

package/src/update.ts

@@ -1,74 +1,86 @@
-import {getModelName as getModelName2, Locale, removePhoneFormat} from './core';
-import {useMergeState} from './merge';
-import {buildFlatState, buildState, handleEvent, localeOf} from './state';
-
-const m = 'model';
-const _getModelName = (f2?: HTMLFormElement|null): string => {
-  return getModelName2(f2, m);
-};
-export const useUpdate = <T>(initialState: T, getName?: ((f?: HTMLFormElement|null) => string) | string, getLocale?: (() => Locale) | Locale, removeErr?: (ctrl: HTMLInputElement) => void) => {
-  const [state, setState] = useMergeState<T>(initialState);
-
-  const updatePhoneState = (event: any) => {
-    const re = /^[0-9\b]+$/;
-    const target = event.currentTarget as HTMLInputElement;
-    const value = removePhoneFormat(target.value);
-    if (re.test(value) || !value) {
-      updateState(event);
-    } else {
-      const splitArr = value.split('');
-      let responseStr = '';
-      splitArr.forEach(element => {
-        if (re.test(element)) {
-          responseStr += element;
-        }
-      });
-      target.value = responseStr;
-      updateState(event);
-    }
-  };
-  const getModelName: (f2?: HTMLFormElement|null) => string = (typeof getName === 'function' ? getName : _getModelName);
-
-  const updateState = (e: any, callback?: () => void, lc?: Locale) => {
-    const ctrl = e.currentTarget as HTMLInputElement;
-    let mn: string = m;
-    if (getName) {
-      if (typeof getName === 'string') {
-        mn = getName;
-      } else {
-        mn = getName(ctrl.form);
-      }
-    } else {
-      mn = _getModelName(ctrl.form);
-    }
-    const l = localeOf(lc, getLocale);
-    handleEvent(e, removeErr);
-    const objSet = buildState<T, any>(e, state, ctrl, mn, l);
-    if (objSet) {
-      if (callback) {
-        setState(objSet, callback);
-      } else {
-        setState(objSet);
-      }
-    }
-  };
-  const updateFlatState = (e: any, callback?: () => void, lc?: Locale) => {
-    const objSet = buildFlatState<T, any>(e, state, lc);
-    if (objSet) {
-      if (callback) {
-        setState(objSet, callback);
-      } else {
-        setState(objSet);
-      }
-    }
-  };
-  return {
-    getModelName,
-    updateState,
-    updatePhoneState,
-    updateFlatState,
-    getLocale,
-    setState,
-    state
-  };
-};
+import { getModelName as getModelName2, Locale, removePhoneFormat } from "./core";
+import { useMergeState } from "./merge";
+import { buildFlatState, buildState, handleEvent, localeOf } from "./state";
+import { useEffect, useState } from "react";
+
+const m = "model";
+const _getModelName = (f2?: HTMLFormElement | null): string => {
+  return getModelName2(f2, m);
+};
+export const useUpdate = <T>(
+  initialState: T,
+  getName?: ((f?: HTMLFormElement | null) => string) | string,
+  getLocale?: (() => Locale) | Locale,
+  removeErr?: (ctrl: HTMLInputElement) => void
+) => {
+  const [state, setState] = useMergeState<T>(initialState);
+  const [rerender, setRerender] = useState(false);
+
+  // trigger re-render page when change state in useSearch
+  useEffect(() => {
+    setRerender(!rerender);
+  }, [state]);
+
+  const updatePhoneState = (event: any) => {
+    const re = /^[0-9\b]+$/;
+    const target = event.currentTarget as HTMLInputElement;
+    const value = removePhoneFormat(target.value);
+    if (re.test(value) || !value) {
+      updateState(event);
+    } else {
+      const splitArr = value.split("");
+      let responseStr = "";
+      splitArr.forEach((element) => {
+        if (re.test(element)) {
+          responseStr += element;
+        }
+      });
+      target.value = responseStr;
+      updateState(event);
+    }
+  };
+  const getModelName: (f2?: HTMLFormElement | null) => string = typeof getName === "function" ? getName : _getModelName;
+
+  const updateState = (e: any, callback?: (prev: any) => void, lc?: Locale) => {
+    const ctrl = e.currentTarget as HTMLInputElement;
+    let mn: string = m;
+    if (getName) {
+      if (typeof getName === "string") {
+        mn = getName;
+      } else {
+        mn = getName(ctrl.form);
+      }
+    } else {
+      mn = _getModelName(ctrl.form);
+    }
+    const l = localeOf(lc, getLocale);
+    handleEvent(e, removeErr);
+    const objSet = buildState<T, any>(e, state, ctrl, mn, l);
+    if (objSet) {
+      if (callback) {
+        setState({ ...objSet }, callback);
+      } else {
+        setState(objSet);
+      }
+    }
+  };
+  const updateFlatState = (e: any, callback?: () => void, lc?: Locale) => {
+    const objSet = buildFlatState<T, any>(e, state, lc);
+    if (objSet) {
+      if (callback) {
+        setState(objSet, callback);
+      } else {
+        setState(objSet);
+      }
+    }
+  };
+  return {
+    getModelName,
+    updateState,
+    updatePhoneState,
+    updateFlatState,
+    getLocale,
+    setState,
+    state,
+  };
+};

package/src/useEdit.ts

@@ -215,11 +215,11 @@ export const useCoreEdit = <T, ID, S, P>(
   };
 
   const _handleNotFound = (form?: any): void => {
-    const msg = message(p1.resource.value, 'error_not_found', 'error');
+    const msg = message(p1.resource.value, 'error_404', 'error');
     if (form) {
       setReadOnly(form);
     }
-    p1.showError(msg.message, msg.title);
+    p1.showError(msg.message, msg.title, undefined, () => window.history.back);
   };
   const handleNotFound = (p && p.handleNotFound ? p.handleNotFound : _handleNotFound);
 
@@ -371,14 +371,10 @@ export const useCoreEdit = <T, ID, S, P>(
         const unmappedErrors = u.showFormError(f, errors);
         focusFirstError(f);
         if (!result.message) {
-          if (errors && errors.length === 1) {
-            result.message = errors[0].message;
+          if (p1.ui && p1.ui.buildErrorMessage) {
+            result.message = p1.ui.buildErrorMessage(unmappedErrors);
           } else {
-            if (p1.ui && p1.ui.buildErrorMessage) {
-              result.message = p1.ui.buildErrorMessage(unmappedErrors);
-            } else {
-              result.message = errors[0].message;
-            }
+            result.message = errors[0].message;
           }
         }
         if (result.message) {
@@ -492,16 +488,25 @@ export const useCoreEdit = <T, ID, S, P>(
         const r = p1.resource;
         const title = r.value('error');
         let msg = r.value('error_internal');
-        if (data && data.status === 404) {
-          handleNotFound(refForm.current);
-        } else {
-          if (data.status && !isNaN(data.status)) {
-            msg = messageByHttpStatus(data.status, r.value);
-          }
-          if (data && (data.status === 401 || data.status === 403)) {
-            setReadOnly(refForm.current);
+        const st = createEditStatus(p ? p.status : undefined);
+        if (data && data.status === 422) {
+          fail(err.response?.data);
+          const obj = err.response?.data?.value;
+          if (obj) {
+            callback ? callback(obj as T, showModel) : showModel(obj as T);
           }
-          p1.showError(msg, title);
+        } else {
+          if (data && data.status === 404) {
+            handleNotFound(refForm.current);
+          } else {
+            if (data.status && !isNaN(data.status)) {
+              msg = messageByHttpStatus(data.status, r.value);
+            }
+            if (data && (data.status === 401 || data.status === 403)) {
+              setReadOnly(refForm.current);
+            }
+            p1.showError(msg, title);
+          } 
         }
         setRunning(false);
         hideLoading(p1.loading);