@codebit-programando-solucoes/codebit-web-antd 1.1.51 → 1.1.53

package/dist/components/ErrorRetry.d.ts

@@ -27,6 +27,9 @@ export interface ErrorRetryProps {
  * Automatically captures exceptions to Sentry and logs errors to console.
  * For 401 (Unauthorized) and 403 (Forbidden) errors, the retry button will reload the page instead of calling the provided onRetry callback.
  *
+ * A 401 (expired session) additionally opens the session-expired modal when rendered inside `CodebitConfigProvider` — a single modal, however many components report it,
+ * whose only way out is reloading the page. A 401 is logged but not sent to Sentry.
+ *
  * @param props - Component props
  * @returns JSX.Element - Error display with retry button
  */

package/dist/contexts/CodebitConfigContext.d.ts

@@ -78,6 +78,11 @@ export interface CodebitConfigContextType {
      * host app chooses to wire it up that way itself.
      */
     onMenuClick?: (key: string) => boolean;
+    /**
+     * Opens the session-expired modal, whose only way out is reloading the page. Idempotent: every call after the first is a no-op. Usually reached through
+     * `useSessionExpiredModal()` rather than read from the context directly.
+     */
+    showSessionExpiredModal: () => void;
 }
 
 /** Properties for the CodebitConfigProvider component. */

package/dist/hooks/index.d.ts

@@ -1,2 +1,3 @@
 export * from './useErrorMessage';
 export * from './useErrorModal';
+export * from './useSessionExpiredModal';

package/dist/hooks/useErrorMessage.d.ts

@@ -20,12 +20,15 @@ export type ErrorStatus = 403 | 404 | 500 | 'error';
  * @property {ErrorStatus} status - Normalized status for UI handling.
  * @property {string} retryText - Text displayed on the retry button.
  * @property {(() => void) | null} onRetryAction - Callback invoked when the user clicks the retry button, or `null` when no action is required.
+ * @property {boolean} sessionExpired - `true` exactly when the error maps to `Error.sessionExpiredError` (no `errorCode`, HTTP 401). `ErrorRetry` and `useErrorModal` open the
+ *   session-expired modal on it.
  */
 export interface ErrorMessage {
     errorMessage: string;
     status: ErrorStatus;
     retryText: string;
     onRetryAction: (() => void) | null;
+    sessionExpired: boolean;
 }
 
 /**

package/dist/hooks/useErrorModal.d.ts

@@ -13,10 +13,14 @@ export interface UseErrorModalReturn {
     /**
      * Shows an error modal.
      *
+     * An expired session (HTTP 401) opens the session-expired modal instead when called inside `CodebitConfigProvider` — one modal however many calls report it, with reloading
+     * the page as its only way out. Without a provider, the error modal is shown as usual but its close always reloads. A 401 is logged but not sent to Sentry.
+     *
      * @param error - The error to be displayed. It can be any object that extends the native `Error` type.
      * @param title - Optional custom title for the modal. If omitted, a default translated title is used.
      * @param closeButtonText - Optional custom text for the modal's close button.
-     * @param onClose - Optional callback executed when the modal is closed. If not provided, the retry action derived from the error message will be used.
+     * @param onClose - Optional callback executed when the modal is closed. If not provided, the retry action derived from the error message will be used. Ignored for an
+     *   expired session, which always reloads the page.
      */
     showErrorModal(
         error: AcceptedError,

package/dist/hooks/useSessionExpiredModal.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Hook that gives access to the session-expired modal hosted by `CodebitConfigProvider` — a modal whose only way out is reloading the page.
+ *
+ * Call `showSessionExpiredModal` from an effect or an event handler, never during render: it updates the provider's state.
+ *
+ * @returns An object containing the `showSessionExpiredModal` function.
+ */
+export declare function useSessionExpiredModal(): UseSessionExpiredModalReturn;
+
+/** Shape of the object returned by {@link useSessionExpiredModal}. */
+export interface UseSessionExpiredModalReturn {
+    /**
+     * Opens the session-expired modal. Idempotent: however many callers report the same expired session, one modal shows.
+     *
+     * @returns `true` when a `CodebitConfigProvider` is above the caller and handled it; `false` when there is none, so the caller keeps its own behavior for the 401.
+     */
+    showSessionExpiredModal(): boolean;
+}

package/dist/index.cjs

@@ -308,6 +308,7 @@ var __webpack_exports__ = {};
         ForgotPassword: ()=>ForgotPassword,
         CodebitConfigContext: ()=>CodebitConfigContext,
         LoginContainer: ()=>LoginContainer,
+        useSessionExpiredModal: ()=>useSessionExpiredModal,
         useErrorMessage: ()=>useErrorMessage,
         LocalLoginRecoveryPasswordResult: ()=>LocalLoginRecoveryPasswordResult,
         FilterContainer: ()=>FilterContainer,
@@ -352,7 +353,8 @@ var __webpack_exports__ = {};
                 forbiddenError: 'Recurso negado pelo servidor',
                 notFoundError: 'Recurso não encontrado pelo servidor',
                 internalServerError: 'Erro interno no servidor',
-                sessionExpiredError: 'Sessão expirada'
+                sessionExpiredError: 'Sessão expirada',
+                sessionExpiredDescription: 'Sua sessão expirou. Recarregue a página para entrar novamente.'
             },
             Login: {
                 loginTitle: 'Entrar',
@@ -496,7 +498,8 @@ var __webpack_exports__ = {};
                 forbiddenError: 'Resource denied by server',
                 notFoundError: 'Resource not found by server',
                 internalServerError: 'Internal server error',
-                sessionExpiredError: 'Session expired'
+                sessionExpiredError: 'Session expired',
+                sessionExpiredDescription: 'Your session has expired. Reload the page to sign in again.'
             },
             Login: {
                 loginTitle: 'Login',
@@ -618,11 +621,64 @@ var __webpack_exports__ = {};
     const external_react_router_namespaceObject = require("react-router");
     const react_namespaceObject = require("@sentry/react");
     const codebit_web_namespaceObject = require("@codebit-programando-solucoes/codebit-web");
+    const external_react_i18next_namespaceObject = require("react-i18next");
+    const external_i18next_namespaceObject = require("i18next");
+    const i18nLib = external_i18next_namespaceObject.createInstance();
+    i18nLib.use(external_react_i18next_namespaceObject.initReactI18next).init({
+        resources: {
+            pt: locales_pt,
+            en: locales_en
+        },
+        lng: 'pt',
+        fallbackLng: 'pt',
+        defaultNS: 'codebitWebAntd',
+        ns: [
+            'codebitWebAntd'
+        ],
+        interpolation: {
+            escapeValue: false
+        }
+    });
+    const i18n = i18nLib;
+    const useCodebitWebAntdTranslation = ()=>(0, external_react_i18next_namespaceObject.useTranslation)('codebitWebAntd', {
+            i18n: i18n
+        });
+    const SESSION_EXPIRED_MODAL_Z_INDEX_OFFSET = 1100;
+    const reload = ()=>{
+        globalThis.location.reload();
+    };
+    function SessionExpiredModal({ open }) {
+        const { t } = useCodebitWebAntdTranslation();
+        const { token } = external_antd_namespaceObject.theme.useToken();
+        return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Modal, {
+            open: open,
+            title: t('Error.sessionExpiredError'),
+            onOk: reload,
+            onCancel: reload,
+            okText: t('Error.reloadPageButton'),
+            okButtonProps: {
+                icon: /*#__PURE__*/ (0, jsx_runtime.jsx)(icons_namespaceObject.ReloadOutlined, {})
+            },
+            footer: (_, { OkBtn })=>/*#__PURE__*/ (0, jsx_runtime.jsx)(OkBtn, {}),
+            maskClosable: false,
+            centered: true,
+            width: 416,
+            zIndex: token['zIndexPopupBase'] + SESSION_EXPIRED_MODAL_Z_INDEX_OFFSET,
+            children: t("Error.sessionExpiredDescription")
+        });
+    }
+    SessionExpiredModal.propTypes = {
+        open: external_prop_types_default().bool.isRequired
+    };
     const logger = new codebit_web_namespaceObject.Logger('CodebitConfigContext');
     const CodebitConfigContext = /*#__PURE__*/ (0, external_react_.createContext)(null);
     function CodebitConfigProvider({ children, menuItems, version = '1.0', showVersion = ()=>true, secondarySidebar, secondarySidebarWidth = 280, bottomMenuItems, headerExtra, doLogout, checkLogin, onMenuClick }) {
         const [isLogged, setIsLogged] = (0, external_react_.useState)(null);
         const [user, setUser] = (0, external_react_.useState)(null);
+        const [sessionExpired, setSessionExpired] = (0, external_react_.useState)(false);
+        const showSessionExpiredModal = (0, external_react_.useCallback)(()=>{
+            setSessionExpired(true);
+        }, []);
         const logout = async ()=>{
             await doLogout();
             setIsLogged(false);
@@ -666,7 +722,8 @@ var __webpack_exports__ = {};
                 secondarySidebarWidth,
                 bottomMenuItems,
                 headerExtra,
-                onMenuClick
+                onMenuClick,
+                showSessionExpiredModal
             }), [
             menuItems,
             isLogged,
@@ -677,11 +734,17 @@ var __webpack_exports__ = {};
             secondarySidebarWidth,
             bottomMenuItems,
             headerExtra,
-            onMenuClick
+            onMenuClick,
+            showSessionExpiredModal
         ]);
-        return /*#__PURE__*/ (0, jsx_runtime.jsx)(CodebitConfigContext.Provider, {
+        return /*#__PURE__*/ (0, jsx_runtime.jsxs)(CodebitConfigContext.Provider, {
             value: contextValue,
-            children: children
+            children: [
+                children,
+                /*#__PURE__*/ (0, jsx_runtime.jsx)(SessionExpiredModal, {
+                    open: sessionExpired
+                })
+            ]
         });
     }
     CodebitConfigProvider.propTypes = {
@@ -900,28 +963,6 @@ var __webpack_exports__ = {};
         headerSpace: "headerSpace-Fd_iha",
         content: "content-OZHp2h"
     };
-    const external_react_i18next_namespaceObject = require("react-i18next");
-    const external_i18next_namespaceObject = require("i18next");
-    const i18nLib = external_i18next_namespaceObject.createInstance();
-    i18nLib.use(external_react_i18next_namespaceObject.initReactI18next).init({
-        resources: {
-            pt: locales_pt,
-            en: locales_en
-        },
-        lng: 'pt',
-        fallbackLng: 'pt',
-        defaultNS: 'codebitWebAntd',
-        ns: [
-            'codebitWebAntd'
-        ],
-        interpolation: {
-            escapeValue: false
-        }
-    });
-    const i18n = i18nLib;
-    const useCodebitWebAntdTranslation = ()=>(0, external_react_i18next_namespaceObject.useTranslation)('codebitWebAntd', {
-            i18n: i18n
-        });
     const { Header, Sider, Content } = external_antd_namespaceObject.Layout;
     const MENU_KEY_APP_LOGOUT = 'app-logout';
     function filterMenuItemsByRole(items, user) {
@@ -1385,6 +1426,7 @@ var __webpack_exports__ = {};
             let errorMessage = t('Error.defaultError');
             let retryText = t('Error.retryButton');
             let onRetryAction = null;
+            let sessionExpired = false;
             if (error?.errorCode) switch(error.errorCode){
                 case codebit_web_namespaceObject.ErrorCode.ERR_NETWORK:
                     errorMessage = t('Error.networkError');
@@ -1419,27 +1461,50 @@ var __webpack_exports__ = {};
                     onRetryAction = ()=>{
                         globalThis.location.reload();
                     };
+                    sessionExpired = true;
                     break;
             }
             return {
                 errorMessage,
                 status,
                 retryText,
-                onRetryAction
+                onRetryAction,
+                sessionExpired
             };
         };
         return {
             getErrorMessage
         };
     }
+    function useSessionExpiredModal() {
+        const show = (0, external_react_.useContext)(CodebitConfigContext)?.showSessionExpiredModal;
+        const showSessionExpiredModal = (0, external_react_.useCallback)(()=>{
+            if (!show) return false;
+            show();
+            return true;
+        }, [
+            show
+        ]);
+        return {
+            showSessionExpiredModal
+        };
+    }
     const ErrorRetry_logger = new codebit_web_namespaceObject.Logger('ErrorRetry');
     function ErrorRetry({ error, onRetry }) {
-        if (error && error instanceof Error) {
+        const { getErrorMessage } = useErrorMessage();
+        const { status, errorMessage, retryText, onRetryAction, sessionExpired } = getErrorMessage(error);
+        const { showSessionExpiredModal } = useSessionExpiredModal();
+        if (sessionExpired) ErrorRetry_logger.warn('Session expired.', error);
+        else if (error && error instanceof Error) {
             ErrorRetry_logger.error('Fail to load.', error);
             react_namespaceObject.captureException(error);
         }
-        const { getErrorMessage } = useErrorMessage();
-        const { status, errorMessage, retryText, onRetryAction } = getErrorMessage(error);
+        (0, external_react_.useEffect)(()=>{
+            if (sessionExpired) showSessionExpiredModal();
+        }, [
+            sessionExpired,
+            showSessionExpiredModal
+        ]);
         return /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Card, {
             children: /*#__PURE__*/ (0, jsx_runtime.jsx)(external_antd_namespaceObject.Result, {
                 status: status,
@@ -2881,17 +2946,20 @@ var __webpack_exports__ = {};
         const { modal } = external_antd_namespaceObject.App.useApp();
         const { getErrorMessage } = useErrorMessage();
         const { t } = useCodebitWebAntdTranslation();
+        const { showSessionExpiredModal } = useSessionExpiredModal();
         const showErrorModal = (error, title, closeButtonText, onClose)=>{
-            if (error && error instanceof Error) {
-                useErrorModal_logger.error('Fail to load.', error);
-                react_namespaceObject.captureException(error);
-            }
-            const { errorMessage, retryText, onRetryAction } = getErrorMessage(error);
-            if (error && error instanceof Error) {
-                useErrorModal_logger.error(error);
-                react_namespaceObject.captureException(error);
+            const { errorMessage, retryText, onRetryAction, sessionExpired } = getErrorMessage(error);
+            if (sessionExpired) {
+                useErrorModal_logger.warn('Session expired.', error);
+                if (showSessionExpiredModal()) return;
+                onClose = onRetryAction;
+            } else {
+                if (error && error instanceof Error) {
+                    useErrorModal_logger.error('Fail to load.', error);
+                    react_namespaceObject.captureException(error);
+                }
+                onClose = onClose ?? onRetryAction;
             }
-            onClose = onClose ?? onRetryAction;
             modal.error({
                 title: title || t('Error.errorTitle'),
                 content: errorMessage + '.',
@@ -2992,6 +3060,7 @@ exports.ThemeToggle = __webpack_exports__.ThemeToggle;
 exports.UserMenu = __webpack_exports__.UserMenu;
 exports.useErrorMessage = __webpack_exports__.useErrorMessage;
 exports.useErrorModal = __webpack_exports__.useErrorModal;
+exports.useSessionExpiredModal = __webpack_exports__.useSessionExpiredModal;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
     "AdminUserOutlinedIcon",
     "AudioPlayer",
@@ -3019,7 +3088,8 @@ for(var __rspack_i in __webpack_exports__)if (-1 === [
     "ThemeToggle",
     "UserMenu",
     "useErrorMessage",
-    "useErrorModal"
+    "useErrorModal",
+    "useSessionExpiredModal"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true

package/dist/index.css

@@ -117,7 +117,7 @@ html.dark-theme {
 }
 
 .header-vgc67L .ant-space .ant-space-item {
-  vertical-align: middle;
+  align-items: center;
   height: 100%;
   display: inline-flex;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codebit-programando-solucoes/codebit-web-antd",
-  "version": "1.1.51",
+  "version": "1.1.53",
   "main": "./dist/index.cjs",
   "type": "module",
   "types": "./src/index.d.ts",