- Updated the Sidebar component styles to utilize theme-based classes for better visual consistency. - Added new utility functions to retrieve and convert theme colors for use in components, enhancing theming capabilities. - Improved layout logic to ensure the default theme is applied correctly based on user preferences and document readiness.
58 lines
1.9 KiB
Svelte
58 lines
1.9 KiB
Svelte
<script lang="ts">
|
|
import "../app.css";
|
|
import Sidebar from "$lib/components/Sidebar.svelte";
|
|
import { createSvelteAuthClient } from "@mmailaender/convex-better-auth-svelte/svelte";
|
|
import { authClient } from "$lib/auth";
|
|
// Importar polyfill ANTES de qualquer outro código que possa usar Jitsi
|
|
import "$lib/utils/jitsiPolyfill";
|
|
import { useQuery } from "convex-svelte";
|
|
import { api } from "@sgse-app/backend/convex/_generated/api";
|
|
import { aplicarTema, aplicarTemaPadrao } from "$lib/utils/temas";
|
|
|
|
const { children } = $props();
|
|
|
|
createSvelteAuthClient({ authClient });
|
|
|
|
// Buscar usuário atual para aplicar tema
|
|
const currentUser = useQuery(api.auth.getCurrentUser, {});
|
|
|
|
// Aplicar tema quando o usuário for carregado
|
|
$effect(() => {
|
|
if (typeof document === 'undefined') return;
|
|
|
|
const htmlElement = document.documentElement;
|
|
|
|
// Aguardar um pouco para garantir que o DOM está pronto
|
|
const timeoutId = setTimeout(() => {
|
|
if (currentUser?.data?.temaPreferido) {
|
|
// Usuário logado com tema preferido - aplicar tema salvo
|
|
aplicarTema(currentUser.data.temaPreferido);
|
|
} else if (currentUser !== undefined) {
|
|
// Se a query terminou (mesmo que não haja usuário), aplicar tema padrão
|
|
if (!htmlElement.getAttribute('data-theme')) {
|
|
aplicarTemaPadrao();
|
|
}
|
|
}
|
|
}, 50);
|
|
|
|
return () => clearTimeout(timeoutId);
|
|
});
|
|
|
|
// Aplicar tema padrão imediatamente ao carregar (antes de verificar usuário)
|
|
$effect(() => {
|
|
if (typeof document !== 'undefined') {
|
|
// Se não há tema aplicado ainda, aplicar o padrão imediatamente
|
|
const htmlElement = document.documentElement;
|
|
if (!htmlElement.getAttribute('data-theme')) {
|
|
aplicarTemaPadrao();
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<div>
|
|
<div class="flex">
|
|
<Sidebar>{@render children()}</Sidebar>
|
|
</div>
|
|
</div>
|