feat(settings): oculta termos técnicos (Baileys/Infinity) para não-admin

Os rótulos técnicos das engines só aparecem para admin ou ruibto@gmail.com:
- usuário comum vê "API estável" e "API com botões";
- admin/ruibto vê "API estável (Baileys 7)" e "InfinityAPI".
(O item 'Baileys' na Sidebar e a página /baileys já são admin-only.)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
VPS 4 Deploy Agent
2026-06-28 05:53:45 +02:00
parent 43f519e7aa
commit f75dba0a8f
@@ -1,5 +1,6 @@
import React, { useEffect, useState, useCallback } from 'react'; import React, { useEffect, useState, useCallback } from 'react';
import { ShieldCheck, LayoutGrid, Check, Loader2, Tag, AlertTriangle, Briefcase } from 'lucide-react'; import { ShieldCheck, LayoutGrid, Check, Loader2, Tag, AlertTriangle, Briefcase } from 'lucide-react';
import { useAuthStore } from '../store/authStore';
interface SettingsPanelProps { interface SettingsPanelProps {
instanceId: string | null; instanceId: string | null;
@@ -8,18 +9,22 @@ interface SettingsPanelProps {
// Engines oferecidas no painel. A 'official' (Baileys 6, que dá 401) fica de fora. // Engines oferecidas no painel. A 'official' (Baileys 6, que dá 401) fica de fora.
// baileys7 → Baileys 7 oficial (a que conecta) → rótulo "API estável" // baileys7 → Baileys 7 oficial (a que conecta) → rótulo "API estável"
// infinite → InfinityAPI (com botões) // infinite → InfinityAPI (com botões)
// titulo = rótulo genérico (todos os usuários). tituloTec = rótulo técnico
// (Baileys/Infinity), exibido apenas para admin/ruibto@gmail.com.
const ENGINES: { const ENGINES: {
value: string; titulo: string; desc: string; icon: any; value: string; titulo: string; tituloTec?: string; desc: string; icon: any;
iconCls: string; activeBorder: string; activeBg: string; checkCls: string; btnCls: string; iconCls: string; activeBorder: string; activeBg: string; checkCls: string; btnCls: string;
}[] = [ }[] = [
{ {
value: 'baileys7', titulo: 'API estável', desc: 'Conexão recomendada do WhatsApp', value: 'baileys7', titulo: 'API estável', tituloTec: 'API estável (Baileys 7)',
desc: 'Conexão recomendada do WhatsApp',
icon: ShieldCheck, iconCls: 'text-emerald-500', icon: ShieldCheck, iconCls: 'text-emerald-500',
activeBorder: 'border-emerald-400', activeBg: 'bg-emerald-50', checkCls: 'text-emerald-600', activeBorder: 'border-emerald-400', activeBg: 'bg-emerald-50', checkCls: 'text-emerald-600',
btnCls: 'bg-emerald-500 hover:bg-emerald-600', btnCls: 'bg-emerald-500 hover:bg-emerald-600',
}, },
{ {
value: 'infinite', titulo: 'InfinityAPI', desc: 'Com botões interativos (experimental)', value: 'infinite', titulo: 'API com botões', tituloTec: 'InfinityAPI',
desc: 'Com botões interativos (experimental)',
icon: LayoutGrid, iconCls: 'text-amber-500', icon: LayoutGrid, iconCls: 'text-amber-500',
activeBorder: 'border-amber-400', activeBg: 'bg-amber-50', checkCls: 'text-amber-600', activeBorder: 'border-amber-400', activeBg: 'bg-amber-50', checkCls: 'text-amber-600',
btnCls: 'bg-amber-500 hover:bg-amber-600', btnCls: 'bg-amber-500 hover:bg-amber-600',
@@ -27,6 +32,9 @@ const ENGINES: {
]; ];
export default function SettingsPanel({ instanceId }: SettingsPanelProps) { export default function SettingsPanel({ instanceId }: SettingsPanelProps) {
const user = useAuthStore((s) => s.user);
// Termos técnicos (Baileys/Infinity) só para admin ou ruibto@gmail.com.
const canSeeTech = user?.role === 'ADMIN' || user?.email === 'ruibto@gmail.com';
const [engine, setEngine] = useState<string | null>(null); const [engine, setEngine] = useState<string | null>(null);
const [isBusiness, setIsBusiness] = useState<boolean | null>(null); const [isBusiness, setIsBusiness] = useState<boolean | null>(null);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
@@ -125,7 +133,7 @@ export default function SettingsPanel({ instanceId }: SettingsPanelProps) {
<Icon className={`w-8 h-8 ${opt.iconCls}`} /> <Icon className={`w-8 h-8 ${opt.iconCls}`} />
</div> </div>
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<h2 className="text-2xl font-semibold text-[#111b21]">{opt.titulo}</h2> <h2 className="text-2xl font-semibold text-[#111b21]">{canSeeTech && opt.tituloTec ? opt.tituloTec : opt.titulo}</h2>
<p className="text-base text-[#667781]">{opt.desc}</p> <p className="text-base text-[#667781]">{opt.desc}</p>
</div> </div>
{ativa ? ( {ativa ? (