react-hook-core 0.0.1 → 0.1.3

package/src/useView.ts

@@ -1,5 +1,6 @@
 import {useEffect, useState} from 'react';
-import {buildId, getModelName as getModelName2, HistoryProps, initForm, LoadingService, Locale, message, messageByHttpStatus, ResourceService, ViewParameter, ViewService} from './core';
+import {RouteComponentProps} from 'react-router';
+import {buildId, getModelName as getModelName2, hideLoading, initForm, LoadingService, Locale, message, messageByHttpStatus, ResourceService, showLoading, ViewParameter, ViewService} from './core';
 import {readOnly} from './formutil';
 import {DispatchWithCallback, useMergeState} from './merge';
 import {useRouter} from './router';
@@ -15,7 +16,7 @@ export interface HookBaseViewParameter<T, ID, S> extends BaseViewComponentParam<
   refForm: any;
   initialState: S;
   service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>;
-  resourceService: ResourceService;
+  resource: ResourceService;
   showError: (m: string, header?: string, detail?: string, callback?: () => void) => void;
   getLocale?: () => Locale;
   loading?: LoadingService;
@@ -25,88 +26,29 @@ export interface ViewComponentParam<T, ID, S> extends BaseViewComponentParam<T,
   initialize?: (id: ID, ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
   callback?: (m: T, showF: (model: T) => void) => void;
 }
-export interface HookPropsViewParameter<T, ID, S, P extends HistoryProps> extends HookPropsBaseViewParameter<T, ID, S, P> {
+export interface HookPropsViewParameter<T, ID, S, P extends RouteComponentProps> extends HookPropsBaseViewParameter<T, ID, S, P> {
   keys?: string[];
   initialize?: (id: ID, ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
   callback?: (m: T, showF: (model: T) => void) => void;
 }
-export interface HookPropsBaseViewParameter<T, ID, S, P extends HistoryProps> extends HookBaseViewParameter<T, ID, S> {
-  props?: P;
+export interface HookPropsBaseViewParameter<T, ID, S, P> extends HookBaseViewParameter<T, ID, S> {
+  props: P;
 }
-export const useBaseView = <T, ID, S, P extends HistoryProps>(
-  props: P,
-  refForm: any,
-  initialState: S,
-  service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
-  p1: ViewParameter,
-  p2?: BaseViewComponentParam<T, ID>
-  ) => {
-  const p4: BaseViewComponentParam<T, ID> = (p2 ? p2 : {} as any);
-  const p6: HookPropsBaseViewParameter<T, ID, S, P> = {
-    props,
-    refForm,
-    initialState,
-    service,
-    resourceService: p1.resource,
-    showError: p1.showError,
-    getLocale: p1.getLocale,
-    loading: p1.loading,
-    name: p4.name,
-    handleNotFound: p4.handleNotFound,
-    getModelName: p4.getModelName,
-    showModel: p4.showModel,
-    load: p4.load
-  };
-  return useBaseViewOne(p6);
+export const useViewOneProps = <T, ID, S, P extends RouteComponentProps>(p: HookPropsViewParameter<T, ID, S, P>) => {
+  return useViewProps(p.props, p.refForm, p.initialState, p.service, p, p);
 };
-export const useView = <T, ID, S, P extends HistoryProps>(
-  props: P,
+export const useViewOne = <T, ID, S>(p: HookBaseViewParameter<T, ID, S>) => {
+  return useView(p.refForm, p.initialState, p.service, p, p);
+};
+export const useView = <T, ID, S>(
   refForm: any,
   initialState: S,
   service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
   p1: ViewParameter,
-  p2?: ViewComponentParam<T, ID, S>
+  p?: ViewComponentParam<T, ID, S>
   ) => {
-  const p4: ViewComponentParam<T, ID, S> = (p2 ? p2 : {} as any);
-  const p: HookPropsViewParameter<T, ID, S, P> = {
-    props,
-    refForm,
-    keys: p4.keys,
-    initialize: p4.initialize,
-    callback: p4.callback,
-    initialState,
-    service,
-    resourceService: p1.resource,
-    showError: p1.showError,
-    getLocale: p1.getLocale,
-    loading: p1.loading,
-    name: p4.name,
-    handleNotFound: p4.handleNotFound,
-    getModelName: p4.getModelName,
-    showModel: p4.showModel,
-    load: p4.load
-  };
-  return useViewOne(p);
-};
-export const useViewOne = <T, ID, S, P extends HistoryProps>(p: HookPropsViewParameter<T, ID, S, P>) => {
-  const baseProps = useBaseViewOne(p);
-  const [state, setState] = useMergeState<S>(p.initialState);
-  useEffect(() => {
-    if (baseProps.refForm) {
-      initForm(baseProps.refForm.current);
-    }
-    const id = buildId<ID>(p.props, p.keys);
-    if (p && p.initialize) {
-      p.initialize(id, baseProps.load, setState, p.callback);
-    } else {
-      baseProps.load(id, p.callback);
-    }
-  }, []);
-  return {...baseProps};
-};
-export const useBaseViewOne = <T, ID, S, P extends HistoryProps>(p: HookPropsBaseViewParameter<T, ID, S, P>) => {
-  const [state, setState] = useMergeState<S>(p.initialState);
-  const [running, setRunning] = useState(undefined);
+  const [state, setState] = useMergeState<S>(initialState);
+  const [running, setRunning] = useState<boolean>();
   const {goBack} = useRouter();
 
   const back = (event: any) => {
@@ -117,40 +59,37 @@ export const useBaseViewOne = <T, ID, S, P extends HistoryProps>(p: HookPropsBas
   };
 
   const getModelName = (f?: HTMLFormElement) => {
-    if (p.name) {
+    if (p && p.name) {
       return p.name;
     }
-    return getModelName2(f);
+    return getModelName2(f, 'model');
   };
 
   const showModel = (model: T) => {
-    const n: string = getModelName(p.refForm.current);
+    const n: string = getModelName(refForm.current);
     const objSet: any = {};
     objSet[n] = model;
     setState(objSet);
   };
 
   const _handleNotFound = (form?: any): void => {
-    const msg = message(p.resourceService.value, 'error_not_found', 'error');
+    const msg = message(p1.resource.value, 'error_not_found', 'error');
     if (form) {
       readOnly(form);
     }
-    p.showError(msg.message, msg.title);
+    p1.showError(msg.message, msg.title);
   };
-  const handleNotFound = (p.handleNotFound ? p.handleNotFound : _handleNotFound);
+  const handleNotFound = (p && p.handleNotFound ? p.handleNotFound : _handleNotFound);
 
-  const _load = async (_id: ID, callback?: (m: T, showM: (m2: T) => void) => void) => {
+  const _load = (_id: ID, callback?: (m: T, showM: (m2: T) => void) => void) => {
     const id: any = _id;
     if (id != null && id !== '') {
-      try {
-        let obj: T;
-        if (typeof p.service === 'function') {
-          obj = await p.service(id);
-        } else {
-          obj = await p.service.load(id);
-        }
+      setRunning(true);
+      showLoading(p1.loading);
+      const fn = (typeof service === 'function' ? service : service.load);
+      fn(id).then(obj => {
         if (!obj) {
-          handleNotFound(p.refForm.current);
+          handleNotFound(refForm.current);
         } else {
           if (callback) {
             callback(obj, showModel);
@@ -158,35 +97,34 @@ export const useBaseViewOne = <T, ID, S, P extends HistoryProps>(p: HookPropsBas
             showModel(obj);
           }
         }
-      } catch (err) {
+        setRunning(false);
+        hideLoading(p1.loading);
+      }).catch(err => {
         const data = (err &&  err.response) ? err.response : err;
-        const r = p.resourceService;
+        const r = p1.resource;
         const title = r.value('error');
         let msg = r.value('error_internal');
         if (data && data.status === 404) {
-          handleNotFound(p.refForm.current);
+          handleNotFound(refForm.current);
         } else {
           if (data && data.status) {
             msg = messageByHttpStatus(data.status, r.value);
           }
-          readOnly(p.refForm.current);
-          p.showError(msg, title);
+          readOnly(refForm.current);
+          p1.showError(msg, title);
         }
-      } finally {
         setRunning(false);
-        if (p.loading) {
-          p.loading.hideLoading();
-        }
-      }
+        hideLoading(p1.loading);
+      });
     }
   };
-  const load = (p.load ? p.load : _load);
+  const load = (p && p.load ? p.load : _load);
 
   return {
     state,
     setState,
-    refForm: p.refForm,
-    resource: p.resourceService.resource(),
+    refForm,
+    resource: p1.resource.resource(),
     running,
     setRunning,
     showModel,
@@ -196,3 +134,28 @@ export const useBaseViewOne = <T, ID, S, P extends HistoryProps>(p: HookPropsBas
     back
   };
 };
+export const useViewProps = <T, ID, S, P extends RouteComponentProps>(
+  props: P,
+  refForm: any,
+  initialState: S,
+  service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
+  p1: ViewParameter,
+  p?: ViewComponentParam<T, ID, S>
+  ) => {
+  const baseProps = useView(refForm, initialState, service, p1, p);
+  const [state, setState] = useMergeState<S>(initialState);
+  useEffect(() => {
+    if (baseProps.refForm) {
+      initForm(baseProps.refForm.current);
+    }
+    const id = buildId<ID>(props, p ? p.keys : undefined);
+    if (id) {
+      if (p && p.initialize) {
+        p.initialize(id, baseProps.load, setState, p.callback);
+      } else {
+        baseProps.load(id, p ? p.callback : undefined);
+      }
+    }
+  }, []);
+  return {...baseProps};
+};

package/src/util.ts

@@ -1,4 +1,5 @@
 import {Locale} from './core';
+import {enLocale} from './state';
 
 const r1 = / |,|\$|€|£|¥|'|٬|،| /g;
 const r2 = / |\.|\$|€|£|¥|'|٬|،| /g;
@@ -26,10 +27,10 @@ export function valueOf(ctrl: HTMLInputElement, locale?: Locale, eventType?: str
       } else {
         v = ctrl.value.replace(r1, '');
       }
-      return isNaN(v) ? { mustChange: false } : { mustChange: true, value: parseFloat(v) };
+      return isNaN(v as any) ? { mustChange: false } : { mustChange: true, value: parseFloat(v) };
     } else if (datatype === 'currency' || datatype === 'string-currency') {
       const ml = ctrl.getAttribute('maxlength');
-      const nm = (isNaN(ml as any) ? null : parseInt(ml, 10));
+      const nm = (ml != null && !isNaN(ml as any) ? parseInt(ml, 10) : undefined);
       const res: any = getStringCurrency(ctrl.value, datatype, locale, nm, eventType === 'blur');
       return res;
     } else {
@@ -38,7 +39,7 @@ export function valueOf(ctrl: HTMLInputElement, locale?: Locale, eventType?: str
   }
 }
 
-function getStringCurrency(value: string, datatype: string, locale: Locale, maxLength?: number, isOnBlur?: boolean): { mustChange: any, value?: string } {
+function getStringCurrency(value: string, datatype: string, locale?: Locale, maxLength?: number, isOnBlur?: boolean): { mustChange: any, value?: string } {
   if (locale && locale.decimalSeparator !== '.') {
     value = value.replace(r2, '');
     if (value.indexOf(locale.decimalSeparator) >= 0) {
@@ -57,6 +58,9 @@ function getStringCurrency(value: string, datatype: string, locale: Locale, maxL
     return { mustChange: true, value: value.substring(1) };
   }
 
+  if (!locale) {
+    locale = enLocale;
+  }
   const decimalDigits = locale ? locale.decimalDigits : 2;
   const groupDigits = 3; // TODO in database locale don't have data
   const decimalSeparator = locale.decimalSeparator; // '.'
@@ -86,7 +90,7 @@ function getStringCurrency(value: string, datatype: string, locale: Locale, maxL
       afterDot = afterDot.substr(0, decimalDigits);
     }
   }
-  if (beforeDot.length > maxLength - (decimalDigits + 1)) {
+  if (maxLength && beforeDot.length > maxLength - (decimalDigits + 1)) {
     return { mustChange: false };
   }
 

package/tsconfig.json

@@ -6,6 +6,7 @@
     "outDir": "./lib",
     "module": "commonjs",
     "moduleResolution": "node",
+    "strict": true,
     "pretty": true,
     "sourceMap": false,
     "declaration": false,