academe-kit 0.11.0 → 0.11.2

package/dist/index.d.ts

@@ -22,6 +22,13 @@ type ProtectedAppProps = {
     requiredClientRoles?: RequiredClientRoles;
     requiredRealmRoles?: string[];
     theme?: Theme;
+    /**
+     * Indica que o app ainda está carregando dados pós-autenticação (ex.: a lista
+     * de instituições do usuário). Quando `true`, o ProtectedApp continua exibindo
+     * a MESMA tela de loading do boot do Keycloak, evitando um segundo spinner em
+     * sequência. Default `false` — comportamento idêntico ao anterior.
+     */
+    pending?: boolean;
 };
 type TextColorClasses = {
     textPrimary: string;

package/dist/index.esm.js

@@ -9823,15 +9823,21 @@ const useProtectedAppColors = () => {
     const context = 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 = (jsx("div", { className: `!flex !w-screen !h-screen !items-center !justify-center ${backgroundColor}`, children: jsx(Spinner, { className: "!size-10", style: { color: "#892CDD" } }) }));
     if (!isInitialized) {
-        return (jsx("div", { className: `!flex !w-screen !h-screen !items-center !justify-center ${backgroundColor}`, children: jsx(Spinner, { className: "!size-10", style: { color: "#892CDD" } }) }));
+        return loadingScreen;
     }
     if (!isAuthenticated()) {
         goToLogin();
@@ -9845,6 +9851,12 @@ const ProtectedApp = ({ children, requiredClientRoles, requiredRealmRoles, theme
         !requiredRealmRoles?.some((role) => hasRealmRole(role))) {
         return (jsxs("div", { className: `flex flex-col w-screen h-screen items-center justify-center ${backgroundColor}`, children: [jsx(CircleAlert, { className: `size-10 ${textColors.iconColor}` }), 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." }), jsx("span", { className: `text-center ${textColors.textSecondary}`, children: "Se voc\u00EA acredita que isso \u00E9 um erro, entre em contato com o suporte." }), jsxs("div", { className: "flex gap-3 mt-4", children: [jsx(Button, { variant: "primary", size: "md", onClick: handleContactSupport, children: "Falar com o suporte" }), 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 (jsx(ProtectedAppContext.Provider, { value: textColors, children: children }));
 };