fix(email): corrige acentuacoes e adiciona dependencia radio-group

- Corrige todas as acentuacoes em portugues nos templates de e-mail
- Adiciona @radix-ui/react-radio-group como dependencia

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/server/email/email-templates.ts

@@ -1,7 +1,7 @@
 /**
  * Sistema de Templates de E-mail
  * Sistema de Chamados Raven
- * Design inspirado em boas praticas de e-mail marketing
+ * Design inspirado em boas práticas de e-mail marketing
  */
 
 // ============================================
@@ -29,7 +29,7 @@ export type TemplateData = Record<string, unknown>
 // ============================================
 
 const COLORS = {
-  // Primarias - cyan do sistema
+  // Primárias - cyan do sistema
   primary: "#00e8ff",
   primaryDark: "#00d6eb",
   primaryForeground: "#020617",
@@ -140,7 +140,7 @@ function getStatusStyle(status: string): { bg: string; color: string; label: str
 function getPriorityStyle(priority: string): { bg: string; color: string; label: string } {
   const priorityMap: Record<string, { bg: string; color: string; label: string }> = {
     LOW: { bg: COLORS.priorityLowBg, color: COLORS.priorityLow, label: "Baixa" },
-    MEDIUM: { bg: COLORS.priorityMediumBg, color: COLORS.priorityMedium, label: "Media" },
+    MEDIUM: { bg: COLORS.priorityMediumBg, color: COLORS.priorityMedium, label: "Média" },
     HIGH: { bg: COLORS.priorityHighBg, color: COLORS.priorityHigh, label: "Alta" },
     URGENT: { bg: COLORS.priorityUrgentBg, color: COLORS.priorityUrgent, label: "Urgente" },
   }
@@ -193,7 +193,7 @@ function textLink(label: string, url: string): string {
   return `<a href="${escapeHtml(url)}" style="color:${COLORS.primaryDark};text-decoration:none;font-weight:500;">${escapeHtml(label)}</a>`
 }
 
-// Card de informacoes do ticket
+// Card de informações do ticket
 function ticketInfoCard(data: {
   reference: number | string
   subject: string
@@ -205,7 +205,7 @@ function ticketInfoCard(data: {
 }): string {
   const rows: string[] = []
 
-  // Numero do chamado com destaque
+  // Número do chamado com destaque
   rows.push(`
     <tr>
       <td style="padding:12px 16px;border-bottom:1px solid ${COLORS.borderLight};">
@@ -259,7 +259,7 @@ function ticketInfoCard(data: {
     `)
   }
 
-  // Solicitante e Responsavel
+  // Solicitante e Responsável
   if (data.requesterName || data.assigneeName) {
     rows.push(`
       <tr>
@@ -274,7 +274,7 @@ function ticketInfoCard(data: {
               ` : ""}
               ${data.assigneeName ? `
                 <td style="width:50%;">
-                  <span style="color:${COLORS.textMuted};font-size:13px;font-weight:500;display:block;margin-bottom:4px;">Responsavel</span>
+                  <span style="color:${COLORS.textMuted};font-size:13px;font-weight:500;display:block;margin-bottom:4px;">Responsável</span>
                   <span style="color:${COLORS.textPrimary};font-size:14px;">${escapeHtml(data.assigneeName)}</span>
                 </td>
               ` : ""}
@@ -285,7 +285,7 @@ function ticketInfoCard(data: {
     `)
   }
 
-  // Data de criacao
+  // Data de criação
   if (data.createdAt) {
     rows.push(`
       <tr>
@@ -308,7 +308,7 @@ function ticketInfoCard(data: {
   `
 }
 
-// Sistema de estrelas de avaliacao
+// Sistema de estrelas de avaliação
 function ratingStars(rateUrl: string): string {
   const stars: string[] = []
   for (let i = 1; i <= 5; i++) {
@@ -353,7 +353,7 @@ function baseTemplate(content: string, data: TemplateData): string {
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>${escapeHtml(data.subject ?? "Notificacao")}</title>
+  <title>${escapeHtml(data.subject ?? "Notificação")}</title>
   <!--[if mso]>
   <noscript>
     <xml>
@@ -404,7 +404,7 @@ function baseTemplate(content: string, data: TemplateData): string {
                 Este e-mail foi enviado pelo Sistema de Chamados Raven.
               </p>
               <p style="margin:0;">
-                ${textLink("Gerenciar notificacoes", preferencesUrl)}
+                ${textLink("Gerenciar notificações", preferencesUrl)}
                 <span style="color:${COLORS.textMuted};margin:0 12px;">|</span>
                 ${textLink("Central de ajuda", helpUrl)}
               </p>
@@ -455,7 +455,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         Seu chamado foi registrado com sucesso.
       </p>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0;">
-        Nossa equipe ira analisa-lo e entrar em contato em breve.
+        Nossa equipe irá analisá-lo e entrar em contato em breve.
       </p>
 
       ${ticketInfoCard({
@@ -474,7 +474,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
     )
   },
 
-  // Resolucao de chamado
+  // Resolução de chamado
   ticket_resolved: (data) => {
     const viewUrl = data.viewUrl as string
     const rateUrl = data.rateUrl as string
@@ -491,7 +491,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         Chamado resolvido
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0;text-align:center;">
-        Seu chamado foi marcado como resolvido. Esperamos que o atendimento tenha sido satisfatorio!
+        Seu chamado foi marcado como resolvido. Esperamos que o atendimento tenha sido satisfatório!
       </p>
 
       ${ticketInfoCard({
@@ -505,7 +505,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         data.resolutionSummary
           ? `
         <div style="background:${COLORS.successBg};border-radius:12px;padding:20px;margin:24px 0;border-left:4px solid ${COLORS.success};">
-          <p style="color:${COLORS.success};font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;margin:0 0 8px 0;">Resumo da resolucao</p>
+          <p style="color:${COLORS.success};font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;margin:0 0 8px 0;">Resumo da resolução</p>
           <p style="color:${COLORS.textPrimary};font-size:14px;line-height:1.6;margin:0;">${escapeHtml(data.resolutionSummary)}</p>
         </div>
       `
@@ -516,7 +516,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
 
       <div style="text-align:center;">
         <p style="color:${COLORS.textPrimary};font-size:18px;font-weight:600;margin:0 0 8px 0;">Como foi o atendimento?</p>
-        <p style="color:${COLORS.textSecondary};font-size:14px;margin:0;">Sua avaliacao nos ajuda a melhorar!</p>
+        <p style="color:${COLORS.textSecondary};font-size:14px;margin:0;">Sua avaliação nos ajuda a melhorar!</p>
         ${ratingStars(rateUrl)}
       </div>
 
@@ -528,15 +528,15 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
     )
   },
 
-  // Atribuicao de chamado
+  // Atribuição de chamado
   ticket_assigned: (data) => {
     const viewUrl = data.viewUrl as string
     const isForRequester = data.isForRequester as boolean
 
-    const title = isForRequester ? "Agente atribuido" : "Novo chamado atribuido"
+    const title = isForRequester ? "Agente atribuído" : "Novo chamado atribuído"
     const message = isForRequester
-      ? `O agente <strong>${escapeHtml(data.assigneeName)}</strong> foi atribuido ao seu chamado e em breve entrara em contato.`
+      ? `O agente <strong>${escapeHtml(data.assigneeName)}</strong> foi atribuído ao seu chamado e em breve entrará em contato.`
-      : `Um novo chamado foi atribuido a voce. Por favor, verifique os detalhes abaixo.`
+      : `Um novo chamado foi atribuído a você. Por favor, verifique os detalhes abaixo.`
 
     return baseTemplate(
       `
@@ -564,7 +564,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
     )
   },
 
-  // Mudanca de status
+  // Mudança de status
   ticket_status: (data) => {
     const viewUrl = data.viewUrl as string
     const oldStatus = getStatusStyle(data.oldStatus as string)
@@ -608,17 +608,17 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
     )
   },
 
-  // Novo comentario
+  // Novo comentário
   ticket_comment: (data) => {
     const viewUrl = data.viewUrl as string
 
     return baseTemplate(
       `
       <h1 style="color:${COLORS.textPrimary};font-size:26px;font-weight:700;margin:0 0 12px 0;">
-        Nova atualizacao
+        Nova atualização
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0;">
-        <strong>${escapeHtml(data.authorName)}</strong> adicionou um comentario ao seu chamado.
+        <strong>${escapeHtml(data.authorName)}</strong> adicionou um comentário ao seu chamado.
       </p>
 
       ${ticketInfoCard({
@@ -657,10 +657,10 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </div>
 
       <h1 style="color:${COLORS.textPrimary};font-size:26px;font-weight:700;margin:0 0 12px 0;text-align:center;">
-        Redefinicao de senha
+        Redefinição de senha
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0 0 32px 0;text-align:center;">
-        Recebemos uma solicitacao para redefinir a senha da sua conta. Se voce nao fez essa solicitacao, pode ignorar este e-mail.
+        Recebemos uma solicitação para redefinir a senha da sua conta. Se você não fez essa solicitação, pode ignorar este e-mail.
       </p>
 
       <div style="text-align:center;margin:32px 0;">
@@ -668,14 +668,14 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </div>
 
       <p style="color:${COLORS.textMuted};font-size:13px;margin:32px 0 0 0;text-align:center;line-height:1.6;">
-        Este link expira em 24 horas. Se voce nao solicitou a redefinicao de senha, pode ignorar este e-mail com seguranca.
+        Este link expira em 24 horas. Se você não solicitou a redefinição de senha, pode ignorar este e-mail com segurança.
       </p>
     `,
       data
     )
   },
 
-  // Verificacao de e-mail
+  // Verificação de e-mail
   email_verify: (data) => {
     const verifyUrl = data.verifyUrl as string
 
@@ -691,7 +691,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         Confirme seu e-mail
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0 0 32px 0;text-align:center;">
-        Clique no botao abaixo para confirmar seu endereco de e-mail e ativar sua conta.
+        Clique no botão abaixo para confirmar seu endereço de e-mail e ativar sua conta.
       </p>
 
       <div style="text-align:center;margin:32px 0;">
@@ -699,14 +699,14 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </div>
 
       <p style="color:${COLORS.textMuted};font-size:13px;margin:32px 0 0 0;text-align:center;line-height:1.6;">
-        Se voce nao criou uma conta, pode ignorar este e-mail com seguranca.
+        Se você não criou uma conta, pode ignorar este e-mail com segurança.
       </p>
     `,
       data
     )
   },
 
-  // Convite de usuario
+  // Convite de usuário
   invite: (data) => {
     const inviteUrl = data.inviteUrl as string
 
@@ -719,10 +719,10 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </div>
 
       <h1 style="color:${COLORS.textPrimary};font-size:26px;font-weight:700;margin:0 0 12px 0;text-align:center;">
-        Voce foi convidado!
+        Você foi convidado!
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0 0 24px 0;text-align:center;">
-        <strong>${escapeHtml(data.inviterName)}</strong> convidou voce para acessar o Sistema de Chamados Raven.
+        <strong>${escapeHtml(data.inviterName)}</strong> convidou você para acessar o Sistema de Chamados Raven.
       </p>
 
       <table width="100%" cellpadding="0" cellspacing="0" style="background:${COLORS.cardAlt};border-radius:12px;border:1px solid ${COLORS.border};margin:24px 0;">
@@ -730,7 +730,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
           <td style="padding:16px 20px;border-bottom:1px solid ${COLORS.borderLight};">
             <table width="100%" cellpadding="0" cellspacing="0">
               <tr>
-                <td style="color:${COLORS.textMuted};font-size:13px;font-weight:500;width:100px;">Funcao</td>
+                <td style="color:${COLORS.textMuted};font-size:13px;font-weight:500;width:100px;">Função</td>
                 <td style="color:${COLORS.textPrimary};font-size:14px;font-weight:600;">${escapeHtml(data.roleName)}</td>
               </tr>
             </table>
@@ -759,7 +759,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </div>
 
       <p style="color:${COLORS.textMuted};font-size:13px;margin:24px 0 0 0;text-align:center;line-height:1.6;">
-        Este convite expira em 7 dias. Se voce nao esperava este convite, pode ignora-lo com seguranca.
+        Este convite expira em 7 dias. Se você não esperava este convite, pode ignorá-lo com segurança.
       </p>
     `,
       data
@@ -780,7 +780,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         Novo acesso detectado
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0 0 24px 0;text-align:center;">
-        Detectamos um novo acesso a sua conta. Se foi voce, pode ignorar este e-mail.
+        Detectamos um novo acesso à sua conta. Se foi você, pode ignorar este e-mail.
       </p>
 
       <table width="100%" cellpadding="0" cellspacing="0" style="background:${COLORS.cardAlt};border-radius:12px;border:1px solid ${COLORS.border};margin:24px 0;">
@@ -808,7 +808,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
           <td style="padding:16px 20px;">
             <table width="100%" cellpadding="0" cellspacing="0">
               <tr>
-                <td style="color:${COLORS.textMuted};font-size:13px;font-weight:500;width:120px;">Endereco IP</td>
+                <td style="color:${COLORS.textMuted};font-size:13px;font-weight:500;width:120px;">Endereço IP</td>
                 <td style="color:${COLORS.textPrimary};font-size:14px;font-family:monospace;">${escapeHtml(data.ipAddress)}</td>
               </tr>
             </table>
@@ -817,7 +817,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
       </table>
 
       <p style="color:${COLORS.textMuted};font-size:13px;margin:24px 0 0 0;text-align:center;line-height:1.6;">
-        Se voce nao reconhece este acesso, recomendamos alterar sua senha imediatamente.
+        Se você não reconhece este acesso, recomendamos alterar sua senha imediatamente.
       </p>
     `,
       data
@@ -840,10 +840,10 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         SLA em risco
       </h1>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0 0 8px 0;text-align:center;">
-        O chamado abaixo esta proximo de violar o SLA.
+        O chamado abaixo está próximo de violar o SLA.
       </p>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0;text-align:center;">
-        <strong>Acao necessaria!</strong>
+        <strong>Ação necessária!</strong>
       </p>
 
       ${ticketInfoCard({
@@ -891,7 +891,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
         O chamado abaixo violou o SLA estabelecido.
       </p>
       <p style="color:${COLORS.textSecondary};font-size:15px;line-height:1.7;margin:0;text-align:center;">
-        <strong>Atencao urgente necessaria!</strong>
+        <strong>Atenção urgente necessária!</strong>
       </p>
 
       ${ticketInfoCard({
@@ -922,7 +922,7 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
 }
 
 // ============================================
-// Exportacao
+// Exportação
 // ============================================
 
 /**
@@ -931,13 +931,13 @@ const templates: Record<TemplateName, (data: TemplateData) => string> = {
 export function renderTemplate(name: TemplateName, data: TemplateData): string {
   const template = templates[name]
   if (!template) {
-    throw new Error(`Template "${name}" nao encontrado`)
+    throw new Error(`Template "${name}" não encontrado`)
   }
   return template(data)
 }
 
 /**
- * Retorna a lista de templates disponiveis
+ * Retorna a lista de templates disponíveis
  */
 export function getAvailableTemplates(): TemplateName[] {
   return Object.keys(templates) as TemplateName[]