chore: snapshot before agency split

This commit is contained in:
Erik Silva
2025-12-09 17:21:25 -03:00
parent 6ec29c7eef
commit 053e180321
27 changed files with 428 additions and 234 deletions

View File

@@ -22,19 +22,31 @@ const tabs = [
];
const themePresets = [
{ name: 'Laranja/Rosa', gradient: 'linear-gradient(90deg, #FF3A05, #FF0080)', colors: ['#FF3A05', '#FF0080'] },
{ name: 'Azul/Roxo', gradient: 'linear-gradient(90deg, #0066FF, #9333EA)', colors: ['#0066FF', '#9333EA'] },
{ name: 'Verde/Esmeralda', gradient: 'linear-gradient(90deg, #10B981, #059669)', colors: ['#10B981', '#059669'] },
{ name: 'Ciano/Azul', gradient: 'linear-gradient(90deg, #06B6D4, #3B82F6)', colors: ['#06B6D4', '#3B82F6'] },
{ name: 'Rosa/Roxo', gradient: 'linear-gradient(90deg, #EC4899, #A855F7)', colors: ['#EC4899', '#A855F7'] },
{ name: 'Vermelho/Laranja', gradient: 'linear-gradient(90deg, #EF4444, #F97316)', colors: ['#EF4444', '#F97316'] },
{ name: 'Marca', gradient: 'linear-gradient(135deg, #ff3a05, #ff0080)', colors: ['#ff3a05', '#ff0080'] },
{ name: 'Azul/Roxo', gradient: 'linear-gradient(135deg, #0066FF, #9333EA)', colors: ['#0066FF', '#9333EA'] },
{ name: 'Verde/Esmeralda', gradient: 'linear-gradient(135deg, #10B981, #059669)', colors: ['#10B981', '#059669'] },
{ name: 'Ciano/Azul', gradient: 'linear-gradient(135deg, #06B6D4, #3B82F6)', colors: ['#06B6D4', '#3B82F6'] },
{ name: 'Rosa/Roxo', gradient: 'linear-gradient(135deg, #EC4899, #A855F7)', colors: ['#EC4899', '#A855F7'] },
{ name: 'Vermelho/Laranja', gradient: 'linear-gradient(135deg, #EF4444, #F97316)', colors: ['#EF4444', '#F97316'] },
];
const DEFAULT_GRADIENT = 'linear-gradient(135deg, #ff3a05, #ff0080)';
const THEME_STORAGE_PREFIX = 'agency-theme:';
const setThemeVariables = (gradient: string) => {
document.documentElement.style.setProperty('--gradient-primary', gradient);
document.documentElement.style.setProperty('--gradient', gradient);
document.documentElement.style.setProperty('--gradient-text', gradient.replace('90deg', 'to right'));
document.documentElement.style.setProperty('--color-gradient-brand', gradient.replace('90deg', 'to right'));
};
export default function ConfiguracoesPage() {
const [selectedTab, setSelectedTab] = useState(0);
const [selectedTheme, setSelectedTheme] = useState(0);
const [customColor1, setCustomColor1] = useState('#FF3A05');
const [customColor2, setCustomColor2] = useState('#FF0080');
const [activeGradient, setActiveGradient] = useState(DEFAULT_GRADIENT);
const [themeKey, setThemeKey] = useState('default');
const [customColor1, setCustomColor1] = useState('#ff3a05');
const [customColor2, setCustomColor2] = useState('#ff0080');
const [showSuccessDialog, setShowSuccessDialog] = useState(false);
const [successMessage, setSuccessMessage] = useState('');
const [showSupportDialog, setShowSupportDialog] = useState(false);
@@ -64,7 +76,7 @@ export default function ConfiguracoesPage() {
confirmPassword: '',
});
// Buscar dados da agência da API
// Buscar dados da agência da API e inicializar tema salvo
useEffect(() => {
const fetchAgencyData = async () => {
try {
@@ -78,6 +90,24 @@ export default function ConfiguracoesPage() {
return;
}
const parsedUser = JSON.parse(userData);
const hostname = window.location.hostname;
const hostSubdomain = hostname.split('.')[0] || 'default';
const key = parsedUser?.subdomain || parsedUser?.tenantId || hostSubdomain;
setThemeKey(key);
const savedGradient = localStorage.getItem(`${THEME_STORAGE_PREFIX}${key}`) || DEFAULT_GRADIENT;
setActiveGradient(savedGradient);
setThemeVariables(savedGradient);
const presetIndex = themePresets.findIndex((theme) => theme.gradient === savedGradient);
if (presetIndex >= 0) {
setSelectedTheme(presetIndex);
setCustomColor1(themePresets[presetIndex].colors[0]);
setCustomColor2(themePresets[presetIndex].colors[1]);
}
// Buscar dados da API
const response = await fetch('/api/agency/profile', {
headers: {
@@ -138,14 +168,13 @@ export default function ConfiguracoesPage() {
}, []);
const applyTheme = (gradient: string) => {
document.documentElement.style.setProperty('--gradient-primary', gradient);
document.documentElement.style.setProperty('--gradient', gradient);
document.documentElement.style.setProperty('--gradient-text', gradient.replace('90deg', 'to right'));
document.documentElement.style.setProperty('--color-gradient-brand', gradient.replace('90deg', 'to right'));
setActiveGradient(gradient);
setThemeVariables(gradient);
};
const applyCustomTheme = () => {
const gradient = `linear-gradient(90deg, ${customColor1}, ${customColor2})`;
setSelectedTheme(-1);
applyTheme(gradient);
};
@@ -193,9 +222,15 @@ export default function ConfiguracoesPage() {
};
const handleSaveTheme = () => {
// TODO: Integrar com API para salvar no banco
const selectedGradient = themePresets[selectedTheme].gradient;
console.log('Salvando tema:', selectedGradient);
const gradientToSave = selectedTheme >= 0
? themePresets[selectedTheme].gradient
: activeGradient;
applyTheme(gradientToSave);
if (themeKey) {
localStorage.setItem(`${THEME_STORAGE_PREFIX}${themeKey}`, gradientToSave);
}
setSuccessMessage('Tema salvo com sucesso!');
setShowSuccessDialog(true);
};
@@ -283,7 +318,7 @@ export default function ConfiguracoesPage() {
`w-full flex items-center justify-center space-x-2 rounded-lg py-2.5 text-sm font-medium leading-5 transition-all
${selected
? 'bg-white dark:bg-gray-900 text-gray-900 dark:text-white shadow'
: 'text-gray-600 dark:text-gray-400 hover:bg-white/[0.5] dark:hover:bg-gray-700/[0.5] hover:text-gray-900 dark:hover:text-white'
: 'text-gray-600 dark:text-gray-400 hover:bg-white/50 dark:hover:bg-gray-700/50 hover:text-gray-900 dark:hover:text-white'
}`
}
>
@@ -315,7 +350,7 @@ export default function ConfiguracoesPage() {
</div>
<div>
<label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center justify-between">
<label className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center justify-between">
<span>CNPJ</span>
<span className="text-xs text-gray-500">Alteração via suporte</span>
</label>
@@ -332,7 +367,7 @@ export default function ConfiguracoesPage() {
</div>
<div>
<label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center justify-between">
<label className="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 flex items-center justify-between">
<span>E-mail (acesso)</span>
<span className="text-xs text-gray-500">Alteração via suporte</span>
</label>

View File

@@ -48,6 +48,15 @@ import {
const ThemeToggle = dynamic(() => import('@/components/ThemeToggle'), { ssr: false });
const ThemeTester = dynamic(() => import('@/components/ThemeTester'), { ssr: false });
const DEFAULT_GRADIENT = 'linear-gradient(135deg, #ff3a05, #ff0080)';
const setGradientVariables = (gradient: string) => {
document.documentElement.style.setProperty('--gradient-primary', gradient);
document.documentElement.style.setProperty('--gradient', gradient);
document.documentElement.style.setProperty('--gradient-text', gradient.replace('90deg', 'to right'));
document.documentElement.style.setProperty('--color-gradient-brand', gradient.replace('90deg', 'to right'));
};
export default function AgencyLayout({
children,
}: {
@@ -88,8 +97,13 @@ export default function AgencyLayout({
}
const hostname = window.location.hostname;
const subdomain = hostname.split('.')[0];
setAgencyName(subdomain);
const hostSubdomain = hostname.split('.')[0] || 'default';
const themeKey = parsedUser?.subdomain || parsedUser?.tenantId || hostSubdomain;
setAgencyName(parsedUser?.subdomain || hostSubdomain);
const storedGradient = localStorage.getItem(`agency-theme:${themeKey}`);
setGradientVariables(storedGradient || DEFAULT_GRADIENT);
// Inicializar com "Todos os Clientes"
setSelectedClient(clients[0]);
@@ -106,7 +120,10 @@ export default function AgencyLayout({
};
window.addEventListener('keydown', handleKeyDown);
return () => window.removeEventListener('keydown', handleKeyDown);
return () => {
window.removeEventListener('keydown', handleKeyDown);
setGradientVariables(DEFAULT_GRADIENT);
};
}, [router]);
if (!user) {