academe-kit 0.11.0 → 0.11.2

package/dist/index.cjs

@@ -9825,15 +9825,21 @@ const useProtectedAppColors = () => {
     const context = React2.useContext(ProtectedAppContext);
     return context || themes.dark.textColors;
 };
-const ProtectedApp = ({ children, requiredClientRoles, requiredRealmRoles, theme = "dark", }) => {
+const ProtectedApp = ({ children, requiredClientRoles, requiredRealmRoles, theme = "dark", pending = false, }) => {
     const { isInitialized, goToLogin, hasClientRole, hasRealmRole, isAuthenticated, signOut, } = useAcademeAuth();
     const themeConfig = themes[theme];
     const { backgroundColor, textColors } = themeConfig;
     const handleContactSupport = () => {
         window.open("https://wa.me/558540428133", "_blank");
     };
+    // Tela de loading de tela cheia reutilizada em duas fases do boot:
+    // (1) enquanto o Keycloak inicializa (`!isInitialized`) e (2) enquanto o app
+    // ainda carrega dados pós-auth (`pending`). Por ser o MESMO elemento na mesma
+    // posição da árvore, o React reconcilia entre as fases sem remontar o Spinner
+    // — a animação fica contínua (um loading só, sem "piscar").
+    const loadingScreen = (jsxRuntime.jsx("div", { className: `!flex !w-screen !h-screen !items-center !justify-center ${backgroundColor}`, children: jsxRuntime.jsx(Spinner, { className: "!size-10", style: { color: "#892CDD" } }) }));
     if (!isInitialized) {
-        return (jsxRuntime.jsx("div", { className: `!flex !w-screen !h-screen !items-center !justify-center ${backgroundColor}`, children: jsxRuntime.jsx(Spinner, { className: "!size-10", style: { color: "#892CDD" } }) }));
+        return loadingScreen;
     }
     if (!isAuthenticated()) {
         goToLogin();
@@ -9847,6 +9853,12 @@ const ProtectedApp = ({ children, requiredClientRoles, requiredRealmRoles, theme
         !requiredRealmRoles?.some((role) => hasRealmRole(role))) {
         return (jsxRuntime.jsxs("div", { className: `flex flex-col w-screen h-screen items-center justify-center ${backgroundColor}`, children: [jsxRuntime.jsx(CircleAlert, { className: `size-10 ${textColors.iconColor}` }), jsxRuntime.jsx("h1", { className: `text-2xl font-bold mt-4 text-center ${textColors.textPrimary}`, children: "Oops, voc\u00EA n\u00E3o tem permiss\u00E3o para acessar aqui." }), jsxRuntime.jsx("span", { className: `text-center ${textColors.textSecondary}`, children: "Se voc\u00EA acredita que isso \u00E9 um erro, entre em contato com o suporte." }), jsxRuntime.jsxs("div", { className: "flex gap-3 mt-4", children: [jsxRuntime.jsx(Button, { variant: "primary", size: "md", onClick: handleContactSupport, children: "Falar com o suporte" }), jsxRuntime.jsx(Button, { variant: "outline", size: "md", onClick: signOut, children: "Sair da conta" })] })] }));
     }
+    // Auth e roles OK, mas o app ainda carrega dados pós-auth (ex.: a lista de
+    // instituições do dash). Mantém o MESMO `loadingScreen` do passo `!isInitialized`,
+    // então o spinner não remonta entre as fases — continua sendo um loading só.
+    if (pending) {
+        return loadingScreen;
+    }
     return (jsxRuntime.jsx(ProtectedAppContext.Provider, { value: textColors, children: children }));
 };