jordy 0.12.0

package/README.md

@@ -0,0 +1,11 @@
+# jordy
+
+업무용 프론트엔드 프로젝트에서 아키텍쳐 도입시 쓰이는 툴킷 모음 입니다.
+
+## Requires
+- react-router
+- react-router-dom
+- axios
+- redux
+- react-redux
+- @reduxjs/toolkit

package/esm5/adaptive-render/AdaptiveRender.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { useIsMobile, useIsTablet } from './DeviceDetectContext';
+export var AdaptiveRender = function (_a) {
+    var mobile = _a.mobile, notTablet = _a.notTablet, children = _a.children;
+    var isMobile = useIsMobile();
+    var isTablet = useIsTablet();
+    if (notTablet && isTablet) {
+        return null;
+    }
+    if ((mobile && isMobile) || (!mobile && !isMobile)) {
+        return React.createElement(React.Fragment, null, children);
+    }
+    return null;
+};

package/esm5/adaptive-render/DeviceDetectContext.js

@@ -0,0 +1,62 @@
+import React, { createContext, useContext, useEffect, useMemo, useState, } from 'react';
+import { isMobile as isMobileCheck, isNativeApp as isNativeAppCheck, isServer, isTablet as isTabletCheck, } from '../util/envCheck';
+import { DeviceSizeEnum } from './device.type';
+function getIsMobile() {
+    if (isServer()) {
+        try {
+            return isMobileCheck();
+        }
+        catch (error) {
+        }
+        return false;
+    }
+    return isMobileCheck() || window.innerWidth < DeviceSizeEnum.TABLET;
+}
+function getIsTablet() {
+    if (isServer()) {
+        try {
+            return isTabletCheck();
+        }
+        catch (error) {
+        }
+        return false;
+    }
+    return (isTabletCheck() ||
+        (window.innerWidth >= DeviceSizeEnum.TABLET &&
+            window.innerWidth <= DeviceSizeEnum.DESKTOP_SM - 1));
+}
+export var DeviceDetectContext = createContext([
+    getIsMobile(),
+    getIsTablet(),
+    isNativeAppCheck(),
+]);
+var DeviceDetectContextProvider = DeviceDetectContext.Provider;
+export var DeviceDetectProvider = function (_a) {
+    var children = _a.children;
+    var _b = useState(getIsMobile()), isMobile = _b[0], setIsMobile = _b[1];
+    var _c = useState(getIsTablet()), isTablet = _c[0], setIsTablet = _c[1];
+    var isNative = useMemo(isNativeAppCheck, []);
+    useEffect(function () {
+        if (isServer() || !window || typeof window.matchMedia !== 'function') {
+            return undefined;
+        }
+        var mqMobile = window.matchMedia("screen and (max-width: ".concat(DeviceSizeEnum.TABLET - 1, "px)"));
+        var mqTablet = window.matchMedia("screen and (min-width: ".concat(DeviceSizeEnum.TABLET, "px) and (max-width: ").concat(DeviceSizeEnum.DESKTOP_SM - 1, "px)"));
+        var handleResizeForMobile = function (e) {
+            setIsMobile(e.matches);
+        };
+        var handleResizeForTablet = function (e) {
+            setIsTablet(e.matches);
+        };
+        mqMobile.addEventListener('change', handleResizeForMobile);
+        mqTablet.addEventListener('change', handleResizeForTablet);
+        return function () {
+            mqMobile.removeEventListener('change', handleResizeForMobile);
+            mqTablet.removeEventListener('change', handleResizeForTablet);
+        };
+    }, []);
+    return (React.createElement(DeviceDetectContextProvider, { value: [isMobile, isTablet, isNative] }, children));
+};
+export var useIsMobile = function () { return useContext(DeviceDetectContext)[0]; };
+export var useIsTablet = function () { return useContext(DeviceDetectContext)[1]; };
+export var useIsNative = function () { return useContext(DeviceDetectContext)[2]; };

package/esm5/adaptive-render/adaptive-render.type.js

@@ -0,0 +1 @@
+export {};

package/esm5/adaptive-render/device.type.js

@@ -0,0 +1,9 @@
+export var DeviceSizeEnum;
+(function (DeviceSizeEnum) {
+    DeviceSizeEnum[DeviceSizeEnum["MOBILE_SM"] = 320] = "MOBILE_SM";
+    DeviceSizeEnum[DeviceSizeEnum["MOBILE"] = 481] = "MOBILE";
+    DeviceSizeEnum[DeviceSizeEnum["TABLET_SM"] = 768] = "TABLET_SM";
+    DeviceSizeEnum[DeviceSizeEnum["TABLET"] = 961] = "TABLET";
+    DeviceSizeEnum[DeviceSizeEnum["DESKTOP_SM"] = 1025] = "DESKTOP_SM";
+    DeviceSizeEnum[DeviceSizeEnum["DESKTOP"] = 1120] = "DESKTOP";
+})(DeviceSizeEnum || (DeviceSizeEnum = {}));

package/esm5/adaptive-render/index.js

@@ -0,0 +1,4 @@
+export * from './AdaptiveRender';
+export * from './DeviceDetectContext';
+export * from './adaptive-render.type';
+export * from './withAdaptiveRender';

package/esm5/adaptive-render/withAdaptiveRender.js

@@ -0,0 +1,29 @@
+import { __assign } from "tslib";
+import React from 'react';
+import { useIsMobile, useIsTablet, useIsNative } from './DeviceDetectContext';
+export function withAdaptiveRender(settings) {
+    var FnComp = function (props) {
+        var isMobile = useIsMobile();
+        var isTablet = useIsTablet();
+        var isNative = useIsNative();
+        var DesktopComp = settings.desktop, TabletComp = settings.tablet, MobileComp = settings.mobile, NativeAppComp = settings.native;
+        var Comp;
+        if (isNative && NativeAppComp) {
+            Comp = NativeAppComp;
+        }
+        else if (isMobile && MobileComp) {
+            Comp = MobileComp;
+        }
+        else if (isTablet && TabletComp) {
+            Comp = TabletComp;
+        }
+        else if (!isMobile && !isTablet && DesktopComp) {
+            Comp = DesktopComp;
+        }
+        else {
+            return null;
+        }
+        return React.createElement(Comp, __assign({}, props));
+    };
+    return FnComp;
+}

package/esm5/hooks/index.js

@@ -0,0 +1,3 @@
+export * from './useDebounce';
+export * from './useQueryParams';
+export * from './useThrottle';

package/esm5/hooks/useDebounce.js

@@ -0,0 +1,26 @@
+import { useCallback, useEffect, useRef } from 'react';
+import { useMemo } from 'react';
+export function useDebounce(fn, time, deps) {
+    if (time === void 0) { time = 300; }
+    if (deps === void 0) { deps = []; }
+    var timerRef = useRef(0);
+    var memoizeFn = useCallback(fn, deps);
+    useEffect(function () { return function () { return clearTimeout(timerRef.current); }; }, [memoizeFn]);
+    var callback = useMemo(function () {
+        var result = (function (args) {
+            if (timerRef.current) {
+                clearTimeout(timerRef.current);
+            }
+            timerRef.current = setTimeout(function () {
+                memoizeFn(args);
+            }, time);
+        });
+        result.stop = function () {
+            if (timerRef.current) {
+                clearTimeout(timerRef.current);
+            }
+        };
+        return result;
+    }, [memoizeFn]);
+    return callback;
+}

package/esm5/hooks/useQueryParams.js

@@ -0,0 +1,20 @@
+import { __assign } from "tslib";
+import { useCallback, useMemo } from 'react';
+import { useLocation, useParams } from 'react-router-dom';
+import { qs } from '../util/queryString';
+var defSelector = function (params) {
+    return params;
+};
+export function useQueryParams(selector) {
+    if (selector === void 0) { selector = defSelector; }
+    var selConverter = useCallback(selector, []);
+    var location = useLocation();
+    var params = useParams();
+    var searchString = location.search;
+    var result = useMemo(function () {
+        var query = qs.parse(searchString);
+        var innerResult = __assign(__assign({}, query), params);
+        return selConverter(innerResult);
+    }, [searchString, params, selConverter]);
+    return result;
+}

package/esm5/hooks/useThrottle.js

@@ -0,0 +1,18 @@
+import { useRef, useEffect, useCallback } from 'react';
+export function useThrottle(fn, time, deps) {
+    if (time === void 0) { time = 300; }
+    if (deps === void 0) { deps = []; }
+    var timerRef = useRef(0);
+    var memoizeFn = useCallback(fn, deps);
+    useEffect(function () { return function () { return clearTimeout(timerRef.current); }; }, [memoizeFn]);
+    var callback = useCallback(function (args) {
+        if (timerRef.current) {
+            return;
+        }
+        timerRef.current = setTimeout(function () {
+            timerRef.current = 0;
+        }, time);
+        memoizeFn(args);
+    }, [memoizeFn]);
+    return callback;
+}

package/esm5/http-api/httpApi.factory.js

@@ -0,0 +1,143 @@
+import axios from 'axios';
+import { getFileName, qs } from '../util';
+import { axiosCreateHeader, axiosResponseToData, axiosUploadCommon as uploadCommon, convertToFormData, throwNewErrorForLib, } from './networkParser';
+export var createHttpApi = function (baseUrl, parserVisitor, headerProvider, withCredentials, paramsSerializer) {
+    if (headerProvider === void 0) { headerProvider = function () { return ({}); }; }
+    if (withCredentials === void 0) { withCredentials = true; }
+    if (paramsSerializer === void 0) { paramsSerializer = qs.serialize; }
+    var fnUploadCommon = uploadCommon(baseUrl, parserVisitor, headerProvider, withCredentials);
+    var fnCatchCommon = throwNewErrorForLib(parserVisitor);
+    var fnExceptCommon = parserVisitor.throwOther;
+    return {
+        delete: function (url, params, timeout) {
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .delete("".concat(baseUrl).concat(url), {
+                    headers: headers,
+                    params: params,
+                    withCredentials: withCredentials,
+                    timeout: timeout,
+                    paramsSerializer: paramsSerializer,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        get: function (url, params, timeout) {
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .get("".concat(baseUrl).concat(url), {
+                    headers: headers,
+                    params: params,
+                    withCredentials: withCredentials,
+                    timeout: timeout,
+                    paramsSerializer: paramsSerializer,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        getFile: function (url, params, filename) {
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .get(baseUrl + url, {
+                    headers: headers,
+                    params: params,
+                    responseType: 'blob',
+                    withCredentials: withCredentials,
+                    paramsSerializer: paramsSerializer,
+                })
+                    .then(axiosResponseToData)
+                    .then(function (blob) { return new File([blob], filename || getFileName(url)); })
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        getBlob: function (url, params) {
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .get(baseUrl + url, {
+                    headers: headers,
+                    params: params,
+                    responseType: 'blob',
+                    withCredentials: withCredentials,
+                    paramsSerializer: paramsSerializer,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        post: function (url, data, timeout) {
+            if (data === void 0) { data = null; }
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .post(baseUrl + url, data, {
+                    headers: headers,
+                    withCredentials: withCredentials,
+                    timeout: timeout,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        postUpload: function (url, data, progCallback, timeout) {
+            return fnUploadCommon('post', url, convertToFormData(data), progCallback, timeout);
+        },
+        put: function (url, data, timeout) {
+            if (data === void 0) { data = null; }
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .put(baseUrl + url, data, {
+                    headers: headers,
+                    withCredentials: withCredentials,
+                    timeout: timeout,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+        putUpload: function (url, data, progCallback, timeout) {
+            return fnUploadCommon('put', url, convertToFormData(data), progCallback, timeout);
+        },
+        patch: function (url, data, timeout) {
+            if (data === void 0) { data = null; }
+            try {
+                var headers = axiosCreateHeader(headerProvider);
+                return axios
+                    .patch(baseUrl + url, data, {
+                    headers: headers,
+                    withCredentials: withCredentials,
+                    timeout: timeout,
+                })
+                    .then(axiosResponseToData)
+                    .catch(fnCatchCommon);
+            }
+            catch (error) {
+                return Promise.reject(error).catch(fnExceptCommon);
+            }
+        },
+    };
+};

package/esm5/http-api/httpHeader.factory.js

@@ -0,0 +1,46 @@
+import { isServer } from '../util/envCheck';
+var acceptContentType = function (headerData) {
+    headerData.Accept = 'application/json';
+    return headerData;
+};
+var contentTypeFormPost = function (headerData) {
+    headerData['Content-Type'] = 'application/x-www-form-urlencoded';
+    return headerData;
+};
+var contentTypeFormMultipart = function (headerData) {
+    headerData['Content-Type'] = 'multipart/form-data';
+    return headerData;
+};
+var contentTypeJson = function (headerData) {
+    headerData['Content-Type'] = 'application/json; charset=utf-8';
+    return headerData;
+};
+var bearerToken = function (headerData, token) {
+    if (token) {
+        headerData.Authorization = "Bearer ".concat(token);
+    }
+    return headerData;
+};
+export var headerPipe = {
+    acceptContentType: acceptContentType,
+    contentTypeFormPost: contentTypeFormPost,
+    contentTypeFormMultipart: contentTypeFormMultipart,
+    contentTypeJson: contentTypeJson,
+    bearerToken: bearerToken,
+};
+export var createHttpHeaderProvider = function (tokenProvider) {
+    return function () {
+        var pipes = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            pipes[_i] = arguments[_i];
+        }
+        var token = '';
+        if (tokenProvider) {
+            token = tokenProvider.get();
+            if (!token && !isServer()) {
+                throw new Error('로그인 상태가 만료 되었습니다.\n다시 로그인 하여 주시기 바랍니다.');
+            }
+        }
+        return pipes.reduce(function (prev, fn) { return fn(prev, token); }, {});
+    };
+};

package/esm5/http-api/index.js

@@ -0,0 +1,3 @@
+export * from './httpApi.factory';
+export * from './httpHeader.factory';
+export * from './network.type';

package/esm5/http-api/network.type.js

@@ -0,0 +1 @@
+export {};

package/esm5/http-api/networkParser.js

@@ -0,0 +1,73 @@
+import axios from 'axios';
+export var axiosResponseToData = function (axiosRes) {
+    return axiosRes.data;
+};
+export function axiosCreateHeader(headerProvider) {
+    return {
+        common: headerProvider(),
+    };
+}
+export var throwNewErrorForLib = function (parserVisitor) {
+    return function (anyError) {
+        var newError = parserVisitor.parse(anyError);
+        return parserVisitor.interrupt(newError).then(function () {
+            throw newError;
+        });
+    };
+};
+export var axiosUploadCommon = function (baseUrl, parserVisitor, headerProvider, withCredentials) {
+    if (withCredentials === void 0) { withCredentials = true; }
+    return function (method, url, data, progCallback, timeout) {
+        try {
+            var headers = axiosCreateHeader(headerProvider);
+            var fnCatchCommon = throwNewErrorForLib(parserVisitor);
+            return axios(baseUrl + url, {
+                data: data,
+                headers: headers,
+                method: method,
+                onUploadProgress: function (_a) {
+                    var loaded = _a.loaded, total = _a.total;
+                    var args = {
+                        completed: loaded >= total,
+                        loaded: loaded,
+                        progress: Math.floor((loaded * 1000) / total) / 10,
+                        total: total,
+                    };
+                    if (progCallback) {
+                        progCallback(args);
+                    }
+                },
+                withCredentials: withCredentials,
+                timeout: timeout,
+            })
+                .then(axiosResponseToData)
+                .catch(fnCatchCommon);
+        }
+        catch (error) {
+            return Promise.reject(error);
+        }
+    };
+};
+export function convertToFormData(data) {
+    var formData = new FormData();
+    var keys = Object.keys(data);
+    var key = '';
+    for (var i = 0; i < keys.length; i++) {
+        key = keys[i];
+        if (!Object.prototype.hasOwnProperty.call(data, key)) {
+            continue;
+        }
+        var value = data[key];
+        if (Array.isArray(value)) {
+            var len = value.length;
+            for (var idx = 0; idx < len; idx++) {
+                var file = value[idx];
+                formData.append(key, file, file.name);
+            }
+        }
+        else {
+            formData.set(key, value);
+        }
+    }
+    return formData;
+}

package/esm5/index.js

@@ -0,0 +1,11 @@
+import { DeviceDetectProvider, withAdaptiveRender } from './adaptive-render';
+import { createHttpApi, createHttpHeaderProvider, headerPipe, } from './http-api';
+import { cache } from './proxies';
+import { createGuardDispatch, createGuardSelector, renderRouteSystem, } from './route-system';
+import validate, { mergeValidates, } from './validate';
+export * from './queries';
+export * from './storage';
+export * from './hooks';
+export * from './util';
+export * from './types';
+export { DeviceDetectProvider, withAdaptiveRender, createHttpApi, headerPipe, createHttpHeaderProvider, cache, renderRouteSystem, createGuardDispatch, createGuardSelector, validate, mergeValidates, };

package/esm5/proxies/cache.proxy.js

@@ -0,0 +1,40 @@
+import { __spreadArray } from "tslib";
+import { createStorage } from '../storage';
+import { isServer } from '../util/envCheck';
+var FORCE_NOT_CACHE = false;
+function createKey(url, params) {
+    if (params) {
+        return "".concat(url, "-").concat(JSON.stringify(params));
+    }
+    return url;
+}
+export function cache(type, expiredTime) {
+    if (expiredTime === void 0) { expiredTime = 0; }
+    if (isServer() || FORCE_NOT_CACHE) {
+        return function (baseApi) {
+            return baseApi.get;
+        };
+    }
+    var cacheProxy = function (fn) {
+        return function (url, params) {
+            var storage = createStorage(type, createKey(url, params), expiredTime);
+            var value = storage.get();
+            if (value) {
+                return Promise.resolve(value);
+            }
+            return fn(url, params).then(function (data) {
+                storage.set(data);
+                return data;
+            });
+        };
+    };
+    return function (baseApi) {
+        return cacheProxy(function () {
+            var args = [];
+            for (var _i = 0; _i < arguments.length; _i++) {
+                args[_i] = arguments[_i];
+            }
+            return baseApi.get.apply(baseApi, __spreadArray([], args, true));
+        });
+    };
+}

package/esm5/proxies/index.js

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

package/esm5/queries/buildMutationCreator.js

@@ -0,0 +1,87 @@
+import { __awaiter, __generator } from "tslib";
+import { useCallback, useRef, useState } from 'react';
+function defineConverter(args) {
+    return args;
+}
+export function buildMutationCreator(store) {
+    var keyDic = {};
+    return function createRepositoryMutation(_a) {
+        var _this = this;
+        var key = _a.key, mutator = _a.mutator, _b = _a.parameterConverter, parameterConverter = _b === void 0 ? defineConverter : _b, _c = _a.resultConverter, resultConverter = _c === void 0 ? defineConverter : _c;
+        if (key) {
+            if (keyDic[key]) {
+                console.warn("Mutation hooks key \"".concat(key, "\" already exists. Please change the key."));
+            }
+            keyDic[key] = true;
+        }
+        var resultHooks = function () {
+            var refFetching = useRef(false);
+            var _a = useState(null), data = _a[0], setData = _a[1];
+            var _b = useState(undefined), error = _b[0], setError = _b[1];
+            var _c = useState(false), loading = _c[0], setLoading = _c[1];
+            var mutate = useCallback(function (params, throwable) {
+                if (throwable === void 0) { throwable = false; }
+                return __awaiter(_this, void 0, void 0, function () {
+                    var prm;
+                    return __generator(this, function (_a) {
+                        switch (_a.label) {
+                            case 0:
+                                if (refFetching.current) {
+                                    if (throwable) {
+                                        throw new Error('이미 수행 중입니다.');
+                                    }
+                                    return [2, false];
+                                }
+                                setError(undefined);
+                                setLoading(true);
+                                refFetching.current = true;
+                                if (key) {
+                                    store.dispatch({ type: "MutationHooks/".concat(key, "/pending"), params: params });
+                                }
+                                prm = mutator(parameterConverter(params, store.getState));
+                                return [4, prm
+                                        .then(function (res) {
+                                        var convertedData = resultConverter(res, store.getState);
+                                        if (key) {
+                                            store.dispatch({
+                                                type: "MutationHooks/".concat(key, "/fulfilled"),
+                                                params: params,
+                                                payload: convertedData,
+                                            });
+                                        }
+                                        setData(convertedData);
+                                        setLoading(false);
+                                        refFetching.current = false;
+                                        return true;
+                                    })
+                                        .catch(function (err) {
+                                        if (key) {
+                                            store.dispatch({
+                                                type: "MutationHooks/".concat(key, "/rejected"),
+                                                params: params,
+                                                payload: err,
+                                            });
+                                        }
+                                        setError(err);
+                                        setLoading(false);
+                                        refFetching.current = false;
+                                        if (throwable) {
+                                            throw err;
+                                        }
+                                        return false;
+                                    })];
+                            case 1: return [2, _a.sent()];
+                        }
+                    });
+                });
+            }, []);
+            return {
+                data: data,
+                error: error,
+                loading: loading,
+                mutate: mutate,
+            };
+        };
+        return resultHooks;
+    };
+}