@m4l/layouts 0.1.39 → 0.1.40

package/contexts/AuthContext/index.6f966215.js

@@ -1,130 +1,160 @@
-import { createContext as T, useReducer as y, useEffect as d } from "react";
-import { useHostTools as E, useNetwork as S, useEnvironment as v, useLocalStorageWithListener as N, EmitEvents as O, getLocalStorage as w, setLocalStorage as r } from "@m4l/core";
-import { jsx as D } from "react/jsx-runtime";
-var n = /* @__PURE__ */ ((e) => (e.Initial = "INITIALIZE", e.Login = "LOGIN", e.Logout = "LOGOUT", e))(n || {});
-const _ = {
-  isAuthenticated: !1,
-  isInitialized: !1,
+import { createContext, useReducer, useEffect } from "react";
+import { useHostTools, useNetwork, useEnvironment, useLocalStorageWithListener, EmitEvents, getLocalStorage, setLocalStorage } from "@m4l/core";
+import { jsx } from "react/jsx-runtime";
+var EnumTypes = /* @__PURE__ */ ((EnumTypes2) => {
+  EnumTypes2["Initial"] = "INITIALIZE";
+  EnumTypes2["Login"] = "LOGIN";
+  EnumTypes2["Logout"] = "LOGOUT";
+  return EnumTypes2;
+})(EnumTypes || {});
+const initialState = {
+  isAuthenticated: false,
+  isInitialized: false,
   user: null
-}, P = (e, t) => {
-  switch (t.type) {
+};
+const JWTReducer = (state, action) => {
+  switch (action.type) {
     case "INITIALIZE":
       return {
-        isAuthenticated: t.payload.isAuthenticated,
-        isInitialized: !0,
-        user: t.payload.user
+        isAuthenticated: action.payload.isAuthenticated,
+        isInitialized: true,
+        user: action.payload.user
       };
     case "LOGIN":
       return {
-        ...e,
-        isAuthenticated: !0,
-        user: t.payload.user
+        ...state,
+        isAuthenticated: true,
+        user: action.payload.user
       };
     case "LOGOUT":
       return {
-        ...e,
-        isAuthenticated: !1,
+        ...state,
+        isAuthenticated: false,
         user: null
       };
     default:
-      return e;
+      return state;
   }
-}, x = T(null);
-function z(e) {
-  e({
-    type: n.Initial,
+};
+const AuthContext = createContext(null);
+function dispatchInitial(dispatch) {
+  dispatch({
+    type: EnumTypes.Initial,
     payload: {
-      isAuthenticated: !1,
+      isAuthenticated: false,
       user: null
     }
   });
 }
-function R(e) {
+function AuthProvider(props) {
+  const {
+    children
+  } = props;
+  const [state, dispatch] = useReducer(JWTReducer, initialState);
+  const {
+    events_add_listener
+  } = useHostTools();
   const {
-    children: t
-  } = e, [h, s] = y(P, _), {
-    events_add_listener: I
-  } = E(), {
-    networkOperation: u
-  } = S(), {
-    domain_token: m
-  } = v(), [f, l] = N(
+    networkOperation
+  } = useNetwork();
+  const {
+    domain_token
+  } = useEnvironment();
+  const [nextValSession, setNextValSession] = useLocalStorageWithListener(
     "vSession",
     new Date().getTime() + ""
   );
-  d(() => {
-    (async () => {
-      u({
+  useEffect(() => {
+    const initialize = async () => {
+      networkOperation({
         method: "GET",
-        endPoint: "auth/login",
+        endPoint: `auth/login`,
         parms: {
-          user_data: !0
+          user_data: true
         },
-        checkUnAuthorized: !1
-      }).then((a) => {
-        s({
-          type: n.Initial,
+        checkUnAuthorized: false
+      }).then((response) => {
+        dispatch({
+          type: EnumTypes.Initial,
           payload: {
-            isAuthenticated: !0,
-            user: a.user
+            isAuthenticated: true,
+            user: response.user
           }
-        }), w("userData", {
-          email: a.user.email,
-          remember: !0
-        })?.email !== a.user.email && r("userData", {
-          email: a.user.email
-        }, !0);
+        });
+        const useSaved = getLocalStorage("userData", {
+          email: response.user.email,
+          remember: true
+        });
+        if (useSaved?.email !== response.user.email) {
+          setLocalStorage("userData", {
+            email: response.user.email
+          }, true);
+        }
       }).catch(() => {
-        z(s);
+        dispatchInitial(dispatch);
       });
-    })();
-  }, [f]);
-  const g = async (i, a, o) => {
-    await u({
-      endPoint: "auth/login",
+    };
+    initialize();
+  }, [nextValSession]);
+  const login = async (email, password, remember) => {
+    await networkOperation({
+      endPoint: `auth/login`,
       method: "POST",
       data: {
-        email: i,
-        password: a,
-        domain_token: m
+        email,
+        password,
+        domain_token
+      }
+    }).then((response) => {
+      const user = response.data;
+      if (remember) {
+        setLocalStorage("userData", {
+          email,
+          remember
+        });
+      } else {
+        setLocalStorage("userData", {
+          email: "",
+          remember
+        });
       }
-    }).then((A) => {
-      const L = A.data;
-      o ? r("userData", {
-        email: i,
-        remember: o
-      }) : r("userData", {
-        email: "",
-        remember: o
-      }), s({
-        type: n.Login,
+      dispatch({
+        type: EnumTypes.Login,
         payload: {
-          user: L
+          user
         }
-      }), l(new Date().getTime() + "");
+      });
+      setNextValSession(new Date().getTime() + "");
+    });
+  };
+  const logout = async (isAuthenticated) => {
+    if (isAuthenticated) {
+      await networkOperation({
+        endPoint: `auth/logout`,
+        method: "POST"
+      });
+    }
+    dispatch({
+      type: EnumTypes.Logout
     });
-  }, c = async (i) => {
-    i && await u({
-      endPoint: "auth/logout",
-      method: "POST"
-    }), s({
-      type: n.Logout
-    }), l(new Date().getTime() + "");
-  }, p = () => {
-    c(!1);
+    setNextValSession(new Date().getTime() + "");
+  };
+  const onNetserviceUnautorized = () => {
+    logout(false);
   };
-  return d(() => {
-    I(O.EMMIT_EVENT_NET_SERVICE_UNAUTHORIZED, p);
-  }, []), /* @__PURE__ */ D(x.Provider, {
+  useEffect(() => {
+    events_add_listener(EmitEvents.EMMIT_EVENT_NET_SERVICE_UNAUTHORIZED, onNetserviceUnautorized);
+  }, []);
+  return /* @__PURE__ */ jsx(AuthContext.Provider, {
     value: {
-      ...h,
-      login: g,
-      logout: c
+      ...state,
+      login,
+      logout
     },
-    children: t
+    children
   });
 }
 export {
-  R as A,
-  x as a
+  AuthProvider as A,
+  AuthContext as a
 };

package/hooks/useAuth/index.cb6a3420.js

@@ -1,11 +1,11 @@
-import { useContext as o } from "react";
-import { a as e } from "../../contexts/AuthContext/index.6f966215.js";
-const n = () => {
-  const t = o(e);
-  if (!t)
+import { useContext } from "react";
+import { a as AuthContext } from "../../contexts/AuthContext/index.6f966215.js";
+const useAuth = () => {
+  const context = useContext(AuthContext);
+  if (!context)
     throw new Error("Auth context must be use inside AuthProvider");
-  return t;
+  return context;
 };
 export {
-  n as u
+  useAuth as u
 };

package/hooks/useMasterDetail/index.927c0c26.js

@@ -1,6 +1,6 @@
-import { useContext as t } from "react";
-import { M as e } from "../../layouts/MasterDetailLayout/index.bca0fce5.js";
-const s = () => t(e);
+import { useContext } from "react";
+import { M as MasterDetailContext } from "../../layouts/MasterDetailLayout/index.bca0fce5.js";
+const useMasterDetail = () => useContext(MasterDetailContext);
 export {
-  s as u
+  useMasterDetail as u
 };

package/hooks/useModule/index.edcd7b28.js

@@ -1,11 +1,11 @@
-import { useContext as o } from "react";
-import { M as t } from "../../layouts/ModuleLayout/index.850f7dcf.js";
-const n = () => {
-  const e = o(t);
-  if (!e)
+import { useContext } from "react";
+import { M as ModuleContext } from "../../layouts/ModuleLayout/index.850f7dcf.js";
+const useModule = () => {
+  const context = useContext(ModuleContext);
+  if (!context)
     throw new Error("useModule context must be use inside ModuleContext");
-  return e;
+  return context;
 };
 export {
-  n as u
+  useModule as u
 };

package/index.js

@@ -1,13 +1,13 @@
-import { M as f } from "./components/MFIsolationApp/index.e36cf308.js";
-import { M as D } from "./components/MFHostApp/index.420c2626.js";
-import { B as L } from "./components/BaseModule/index.6309486a.js";
-import { a as g, A as h } from "./contexts/AuthContext/index.6f966215.js";
-import { a as N, d as B, g as F } from "./layouts/ModuleLayout/index.850f7dcf.js";
-import { a as H, d as I, g as P } from "./layouts/MasterDetailLayout/index.bca0fce5.js";
-import { N as j, d as k, g as q } from "./layouts/NoAuthModuleLayout/index.eabf38c1.js";
-import { u as z } from "./hooks/useMasterDetail/index.927c0c26.js";
-import { u as G } from "./hooks/useAuth/index.cb6a3420.js";
-import { u as K } from "./hooks/useModule/index.edcd7b28.js";
+import { M } from "./components/MFIsolationApp/index.e36cf308.js";
+import { M as M2 } from "./components/MFHostApp/index.420c2626.js";
+import { B } from "./components/BaseModule/index.6309486a.js";
+import { a, A } from "./contexts/AuthContext/index.6f966215.js";
+import { a as a2, d, g } from "./layouts/ModuleLayout/index.850f7dcf.js";
+import { a as a3, d as d2, g as g2 } from "./layouts/MasterDetailLayout/index.bca0fce5.js";
+import { N, d as d3, g as g3 } from "./layouts/NoAuthModuleLayout/index.eabf38c1.js";
+import { u } from "./hooks/useMasterDetail/index.927c0c26.js";
+import { u as u2 } from "./hooks/useAuth/index.cb6a3420.js";
+import { u as u3 } from "./hooks/useModule/index.edcd7b28.js";
 import "react";
 import "react-router-dom";
 import "react-toastify";
@@ -22,21 +22,21 @@ import "nprogress";
 import "@m4l/components";
 import "@mui/material/styles";
 export {
-  g as AuthContext,
-  h as AuthProvider,
-  L as BaseModule,
-  D as MFHostApp,
-  f as MFIsolationApp,
-  H as MasterDetailLayout,
-  N as ModuleLayout,
-  j as NoAuthModuleLayout,
-  I as defaultMasterDetailDictionary,
-  B as defaultModuleLayoutDictionary,
-  k as defaultNoAuthModuleLayoutDictionary,
-  P as getMasterDetailLayoutComponentsDictionary,
-  F as getModuleLayoutComponentsDictionary,
-  q as getNoAuthModuleLayoutComponentsDictionary,
-  G as useAuth,
-  z as useMasterDetail,
-  K as useModule
+  a as AuthContext,
+  A as AuthProvider,
+  B as BaseModule,
+  M2 as MFHostApp,
+  M as MFIsolationApp,
+  a3 as MasterDetailLayout,
+  a2 as ModuleLayout,
+  N as NoAuthModuleLayout,
+  d2 as defaultMasterDetailDictionary,
+  d as defaultModuleLayoutDictionary,
+  d3 as defaultNoAuthModuleLayoutDictionary,
+  g2 as getMasterDetailLayoutComponentsDictionary,
+  g as getModuleLayoutComponentsDictionary,
+  g3 as getNoAuthModuleLayoutComponentsDictionary,
+  u2 as useAuth,
+  u as useMasterDetail,
+  u3 as useModule
 };

package/layouts/MasterDetailLayout/index.bca0fce5.js

@@ -1,108 +1,126 @@
-import { createContext as w, useState as h, useRef as D, useMemo as m, useCallback as g } from "react";
-import { voidFunction as k, useEnvironment as S, useModuleDictionary as $ } from "@m4l/core";
-import { WindowBase as z, SplitLayout as P } from "@m4l/components";
-import { a as A, g as I } from "../ModuleLayout/index.850f7dcf.js";
-import { jsx as c } from "react/jsx-runtime";
-import { useResponsiveDesktop as L } from "@m4l/graphics";
-const N = {
+import { createContext, useState, useRef, useMemo, useCallback } from "react";
+import { voidFunction, useEnvironment, useModuleDictionary } from "@m4l/core";
+import { WindowBase, SplitLayout } from "@m4l/components";
+import { a as ModuleLayout, g as getModuleLayoutComponentsDictionary } from "../ModuleLayout/index.850f7dcf.js";
+import { jsx } from "react/jsx-runtime";
+import { useResponsiveDesktop } from "@m4l/graphics";
+const initialState = {
   masterSelection: void 0,
-  onChangeMasterSelection: k
-}, x = w(N);
-function R(n) {
+  onChangeMasterSelection: voidFunction
+};
+const MasterDetailContext = createContext(initialState);
+function MasterDetailProvider(props) {
   const {
-    children: a
-  } = n, [s, t] = h(void 0);
-  return /* @__PURE__ */ c(x.Provider, {
+    children
+  } = props;
+  const [masterSelection, setMasterSelection] = useState(void 0);
+  return /* @__PURE__ */ jsx(MasterDetailContext.Provider, {
     value: {
-      masterSelection: s,
-      onChangeMasterSelection: t
+      masterSelection,
+      onChangeMasterSelection: setMasterSelection
     },
-    children: a
+    children
   });
 }
-function V(n, a = [], s, t) {
-  let o = t !== void 0 && t ? [...n] : [s];
-  return o = a.concat(o), o;
+function getTotalModuleActions(splitActions, moduleActions = [], viewDetailAction, isDesktop) {
+  let totalActions = isDesktop !== void 0 && isDesktop ? [...splitActions] : [viewDetailAction];
+  totalActions = moduleActions.concat(totalActions);
+  return totalActions;
 }
-function T(n) {
+function MasterDetailLayout(props) {
+  const {
+    moduleId,
+    masterComponent,
+    detailComponent,
+    moduleActions,
+    version
+  } = props;
   const {
-    moduleId: a,
-    masterComponent: s,
-    detailComponent: t,
-    moduleActions: o,
-    version: M
-  } = n, {
-    host_static_assets: l,
-    environment_assets: i
-  } = S(), [r, C] = h("vertical"), d = L(), p = D(null), {
-    getLabel: e
-  } = $(), v = m(() => [{
-    urlIcon: `${l}/${i}/frontend/components/masterdetaillayout/assets/icons/split_vertical.svg`,
-    onClick: () => u("vertical"),
+    host_static_assets,
+    environment_assets
+  } = useEnvironment();
+  const [splitPosition, setSplitPosition] = useState("vertical");
+  const isDesktop = useResponsiveDesktop();
+  const moduleLayoutRef = useRef(null);
+  const {
+    getLabel
+  } = useModuleDictionary();
+  const splitActions = useMemo(() => [{
+    urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/split_vertical.svg`,
+    onClick: () => onChangePostionInternal("vertical"),
     visibility: "main",
-    label: e("master_detail_layout.split_vertical"),
+    label: getLabel("master_detail_layout.split_vertical"),
     tag: "vertical",
     className: "splitactions",
-    disabled: r === "vertical",
+    disabled: splitPosition === "vertical",
     key: "vertical"
   }, {
-    urlIcon: `${l}/${i}/frontend/components/masterdetaillayout/assets/icons/split_horizontal.svg`,
-    onClick: () => u("horizontal"),
+    urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/split_horizontal.svg`,
+    onClick: () => onChangePostionInternal("horizontal"),
     visibility: "main",
-    label: e("master_detail_layout.split_horizontal"),
+    label: getLabel("master_detail_layout.split_horizontal"),
     tag: "horizontal",
     className: "splitactions",
-    disabled: r === "horizontal",
+    disabled: splitPosition === "horizontal",
     key: "horizontal"
   }, {
-    urlIcon: `${l}/${i}/frontend/components/masterdetaillayout/assets/icons/no_split.svg`,
-    onClick: () => u("none"),
+    urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/no_split.svg`,
+    onClick: () => onChangePostionInternal("none"),
     visibility: "main",
-    label: e("master_detail_layout.no_split"),
+    label: getLabel("master_detail_layout.no_split"),
     tag: "none",
     className: "splitactions",
-    disabled: r === "none",
+    disabled: splitPosition === "none",
     key: "none"
-  }], [e, r]), u = g((f) => {
-    C(f);
-  }, []), y = g(() => {
-    p.current?.openModal({
+  }], [getLabel, splitPosition]);
+  const onChangePostionInternal = useCallback((newPostion) => {
+    setSplitPosition(newPostion);
+  }, []);
+  const onClickViewDetail = useCallback(() => {
+    moduleLayoutRef.current?.openModal({
       initialWidth: 500,
       initialHeigth: 680,
-      window: /* @__PURE__ */ c(z, {
-        urlIcon: `${l}/${i}/frontend/components/masterdetaillayout/assets/icons/view_detail.svg`,
-        title: e("master_detail_layout.view_detail"),
-        children: typeof t == "function" ? t({}) : t
+      window: /* @__PURE__ */ jsx(WindowBase, {
+        urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/view_detail.svg`,
+        title: getLabel("master_detail_layout.view_detail"),
+        children: typeof detailComponent === "function" ? detailComponent({}) : detailComponent
       })
     });
-  }, [t, e]), _ = m(() => ({
-    urlIcon: `${l}/${i}/frontend/components/masterdetaillayout/assets/icons/view_detail.svg`,
-    onClick: y,
-    disabled: !1,
-    visibility: "allways",
-    label: e("master_detail_layout.view_detail"),
-    tag: "none",
-    className: "",
-    key: "detail"
-  }), [i, y]), b = m(() => V(v, o, _, d), [v, o, d, _]);
-  return /* @__PURE__ */ c(R, {
-    children: /* @__PURE__ */ c(A, {
-      ref: p,
-      moduleId: a,
-      moduleActions: b,
-      version: M,
-      children: /* @__PURE__ */ c(P, {
-        splitPosition: d ? r : "none",
-        firstPart: s,
-        secondPart: t
+  }, [detailComponent, getLabel]);
+  const viewDetailAction = useMemo(() => {
+    return {
+      urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/masterdetaillayout/assets/icons/view_detail.svg`,
+      onClick: onClickViewDetail,
+      disabled: false,
+      visibility: "allways",
+      label: getLabel("master_detail_layout.view_detail"),
+      tag: "none",
+      className: "",
+      key: "detail"
+    };
+  }, [environment_assets, onClickViewDetail]);
+  const finalModuleActions = useMemo(() => {
+    const actions = getTotalModuleActions(splitActions, moduleActions, viewDetailAction, isDesktop);
+    return actions;
+  }, [splitActions, moduleActions, isDesktop, viewDetailAction]);
+  return /* @__PURE__ */ jsx(MasterDetailProvider, {
+    children: /* @__PURE__ */ jsx(ModuleLayout, {
+      ref: moduleLayoutRef,
+      moduleId,
+      moduleActions: finalModuleActions,
+      version,
+      children: /* @__PURE__ */ jsx(SplitLayout, {
+        splitPosition: isDesktop ? splitPosition : "none",
+        firstPart: masterComponent,
+        secondPart: detailComponent
       })
     })
   });
 }
-function q() {
-  return ["master_detail_layout"].concat(I());
+function getMasterDetailLayoutComponentsDictionary() {
+  return ["master_detail_layout"].concat(getModuleLayoutComponentsDictionary());
 }
-const G = {
+const defaultMasterDetailDictionary = {
   master_detail_layout: {
     split_vertical: "Split vertically",
     split_horizontal: "Split horizontally",
@@ -111,8 +129,8 @@ const G = {
   }
 };
 export {
-  x as M,
-  T as a,
-  G as d,
-  q as g
+  MasterDetailContext as M,
+  MasterDetailLayout as a,
+  defaultMasterDetailDictionary as d,
+  getMasterDetailLayoutComponentsDictionary as g
 };