@hed-hog/core 0.0.297 → 0.0.299

package/hedhog/frontend/app/dashboard/components/widgets/mail-config.tsx.ejs

@@ -1,445 +0,0 @@
-'use client';
-
-import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '@/components/ui/select';
-import { Switch } from '@/components/ui/switch';
-import { AlertCircle, CheckCircle2, Mail, Send, Server } from 'lucide-react';
-import { useState } from 'react';
-
-type EmailProvider = 'smtp' | 'gmail' | 'aws_ses';
-
-interface SmtpConfig {
-  host: string;
-  port: string;
-  username: string;
-  password: string;
-  encryption: 'tls' | 'ssl' | 'none';
-  fromName: string;
-  fromEmail: string;
-}
-
-interface GmailConfig {
-  clientId: string;
-  clientSecret: string;
-  refreshToken: string;
-  fromName: string;
-  fromEmail: string;
-}
-
-interface AwsSesConfig {
-  accessKeyId: string;
-  secretAccessKey: string;
-  region: string;
-  fromName: string;
-  fromEmail: string;
-}
-
-const initialSmtp: SmtpConfig = {
-  host: 'smtp.empresa.com',
-  port: '587',
-  username: 'noreply@empresa.com',
-  password: '',
-  encryption: 'tls',
-  fromName: 'HeroAdmin',
-  fromEmail: 'noreply@empresa.com',
-};
-
-const initialGmail: GmailConfig = {
-  clientId: '',
-  clientSecret: '',
-  refreshToken: '',
-  fromName: 'HeroAdmin',
-  fromEmail: '',
-};
-
-const initialAwsSes: AwsSesConfig = {
-  accessKeyId: '',
-  secretAccessKey: '',
-  region: 'us-east-1',
-  fromName: 'HeroAdmin',
-  fromEmail: '',
-};
-
-const providers: {
-  value: EmailProvider;
-  label: string;
-  icon: React.ReactNode;
-  description: string;
-}[] = [
-  {
-    value: 'smtp',
-    label: 'SMTP',
-    icon: <Server className="h-4 w-4" />,
-    description: 'Servidor SMTP personalizado',
-  },
-  {
-    value: 'gmail',
-    label: 'Gmail',
-    icon: <Mail className="h-4 w-4" />,
-    description: 'API do Google Gmail',
-  },
-  {
-    value: 'aws_ses',
-    label: 'AWS SES',
-    icon: <Send className="h-4 w-4" />,
-    description: 'Amazon Simple Email Service',
-  },
-];
-
-export default function EmailConfig() {
-  const [provider, setProvider] = useState<EmailProvider>('smtp');
-  const [smtp, setSmtp] = useState(initialSmtp);
-  const [gmail, setGmail] = useState(initialGmail);
-  const [awsSes, setAwsSes] = useState(initialAwsSes);
-  const [testSent, setTestSent] = useState(false);
-
-  return (
-    <Card className="h-full">
-      <CardHeader>
-        <div className="flex items-center justify-between">
-          <div className="flex items-center gap-3">
-            <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-blue-50">
-              <Mail className="h-5 w-5 text-blue-600" />
-            </div>
-            <div>
-              <CardTitle className="text-base">Envio de E-mails</CardTitle>
-              <CardDescription>
-                Configure o provedor de e-mail do sistema
-              </CardDescription>
-            </div>
-          </div>
-          <Badge variant="secondary" className="bg-emerald-50 text-emerald-700">
-            <CheckCircle2 className="mr-1 h-3 w-3" />
-            Ativo
-          </Badge>
-        </div>
-      </CardHeader>
-      <CardContent className="space-y-6">
-        {/* Provider Selector */}
-        <div className="grid grid-cols-3 gap-3">
-          {providers.map((p) => (
-            <button
-              key={p.value}
-              type="button"
-              onClick={() => setProvider(p.value)}
-              className={`flex flex-col items-center gap-2 rounded-lg border-2 p-4 text-center transition-all ${
-                provider === p.value
-                  ? 'border-foreground bg-foreground/3'
-                  : 'border-border hover:border-foreground/20'
-              }`}
-            >
-              <div
-                className={`flex h-9 w-9 items-center justify-center rounded-full ${
-                  provider === p.value
-                    ? 'bg-foreground text-background'
-                    : 'bg-muted text-muted-foreground'
-                }`}
-              >
-                {p.icon}
-              </div>
-              <span className="text-sm font-medium">{p.label}</span>
-              <span className="text-xs text-muted-foreground">
-                {p.description}
-              </span>
-            </button>
-          ))}
-        </div>
-
-        {/* SMTP Fields */}
-        {provider === 'smtp' && (
-          <div className="space-y-4">
-            <div className="grid gap-4 sm:grid-cols-2">
-              <div className="space-y-2">
-                <Label htmlFor="smtp-host">Servidor SMTP</Label>
-                <Input
-                  id="smtp-host"
-                  value={smtp.host}
-                  onChange={(e) => setSmtp({ ...smtp, host: e.target.value })}
-                  placeholder="smtp.exemplo.com"
-                />
-              </div>
-              <div className="space-y-2">
-                <Label htmlFor="smtp-port">Porta</Label>
-                <Input
-                  id="smtp-port"
-                  value={smtp.port}
-                  onChange={(e) => setSmtp({ ...smtp, port: e.target.value })}
-                  placeholder="587"
-                />
-              </div>
-            </div>
-            <div className="grid gap-4 sm:grid-cols-2">
-              <div className="space-y-2">
-                <Label htmlFor="smtp-user">Usuario</Label>
-                <Input
-                  id="smtp-user"
-                  value={smtp.username}
-                  onChange={(e) =>
-                    setSmtp({ ...smtp, username: e.target.value })
-                  }
-                />
-              </div>
-              <div className="space-y-2">
-                <Label htmlFor="smtp-pass">Senha</Label>
-                <Input
-                  id="smtp-pass"
-                  type="password"
-                  value={smtp.password}
-                  onChange={(e) =>
-                    setSmtp({ ...smtp, password: e.target.value })
-                  }
-                  placeholder="********"
-                />
-              </div>
-            </div>
-            <div className="space-y-2">
-              <Label>Criptografia</Label>
-              <Select
-                value={smtp.encryption}
-                onValueChange={(val: 'tls' | 'ssl' | 'none') =>
-                  setSmtp({ ...smtp, encryption: val })
-                }
-              >
-                <SelectTrigger>
-                  <SelectValue />
-                </SelectTrigger>
-                <SelectContent>
-                  <SelectItem value="tls">TLS (Recomendado)</SelectItem>
-                  <SelectItem value="ssl">SSL</SelectItem>
-                  <SelectItem value="none">Nenhuma</SelectItem>
-                </SelectContent>
-              </Select>
-            </div>
-            <div className="grid gap-4 sm:grid-cols-2">
-              <div className="space-y-2">
-                <Label htmlFor="smtp-from-name">Nome do remetente</Label>
-                <Input
-                  id="smtp-from-name"
-                  value={smtp.fromName}
-                  onChange={(e) =>
-                    setSmtp({ ...smtp, fromName: e.target.value })
-                  }
-                />
-              </div>
-              <div className="space-y-2">
-                <Label htmlFor="smtp-from-email">E-mail do remetente</Label>
-                <Input
-                  id="smtp-from-email"
-                  type="email"
-                  value={smtp.fromEmail}
-                  onChange={(e) =>
-                    setSmtp({ ...smtp, fromEmail: e.target.value })
-                  }
-                />
-              </div>
-            </div>
-          </div>
-        )}
-
-        {/* Gmail Fields */}
-        {provider === 'gmail' && (
-          <div className="space-y-4">
-            <div className="rounded-lg border border-amber-200 bg-amber-50 p-3">
-              <div className="flex items-start gap-2">
-                <AlertCircle className="mt-0.5 h-4 w-4 text-amber-600" />
-                <p className="text-xs text-amber-800">
-                  Configure as credenciais OAuth2 no Google Cloud Console.
-                  Habilite a API do Gmail e gere o Client ID e Secret.
-                </p>
-              </div>
-            </div>
-            <div className="space-y-2">
-              <Label htmlFor="gmail-client-id">Client ID</Label>
-              <Input
-                id="gmail-client-id"
-                value={gmail.clientId}
-                onChange={(e) =>
-                  setGmail({ ...gmail, clientId: e.target.value })
-                }
-                placeholder="xxxxx.apps.googleusercontent.com"
-                className="font-mono text-sm"
-              />
-            </div>
-            <div className="space-y-2">
-              <Label htmlFor="gmail-client-secret">Client Secret</Label>
-              <Input
-                id="gmail-client-secret"
-                type="password"
-                value={gmail.clientSecret}
-                onChange={(e) =>
-                  setGmail({ ...gmail, clientSecret: e.target.value })
-                }
-                placeholder="GOCSPX-..."
-                className="font-mono text-sm"
-              />
-            </div>
-            <div className="space-y-2">
-              <Label htmlFor="gmail-refresh-token">Refresh Token</Label>
-              <Input
-                id="gmail-refresh-token"
-                type="password"
-                value={gmail.refreshToken}
-                onChange={(e) =>
-                  setGmail({ ...gmail, refreshToken: e.target.value })
-                }
-                className="font-mono text-sm"
-              />
-            </div>
-            <div className="grid gap-4 sm:grid-cols-2">
-              <div className="space-y-2">
-                <Label htmlFor="gmail-from-name">Nome do remetente</Label>
-                <Input
-                  id="gmail-from-name"
-                  value={gmail.fromName}
-                  onChange={(e) =>
-                    setGmail({ ...gmail, fromName: e.target.value })
-                  }
-                />
-              </div>
-              <div className="space-y-2">
-                <Label htmlFor="gmail-from-email">E-mail do remetente</Label>
-                <Input
-                  id="gmail-from-email"
-                  type="email"
-                  value={gmail.fromEmail}
-                  onChange={(e) =>
-                    setGmail({ ...gmail, fromEmail: e.target.value })
-                  }
-                  placeholder="email@gmail.com"
-                />
-              </div>
-            </div>
-          </div>
-        )}
-
-        {/* AWS SES Fields */}
-        {provider === 'aws_ses' && (
-          <div className="space-y-4">
-            <div className="space-y-2">
-              <Label htmlFor="ses-access-key">Access Key ID</Label>
-              <Input
-                id="ses-access-key"
-                value={awsSes.accessKeyId}
-                onChange={(e) =>
-                  setAwsSes({ ...awsSes, accessKeyId: e.target.value })
-                }
-                placeholder="AKIAIOSFODNN7EXAMPLE"
-                className="font-mono text-sm"
-              />
-            </div>
-            <div className="space-y-2">
-              <Label htmlFor="ses-secret-key">Secret Access Key</Label>
-              <Input
-                id="ses-secret-key"
-                type="password"
-                value={awsSes.secretAccessKey}
-                onChange={(e) =>
-                  setAwsSes({ ...awsSes, secretAccessKey: e.target.value })
-                }
-                className="font-mono text-sm"
-              />
-            </div>
-            <div className="space-y-2">
-              <Label>Regiao</Label>
-              <Select
-                value={awsSes.region}
-                onValueChange={(val) => setAwsSes({ ...awsSes, region: val })}
-              >
-                <SelectTrigger>
-                  <SelectValue />
-                </SelectTrigger>
-                <SelectContent>
-                  <SelectItem value="us-east-1">
-                    US East (N. Virginia)
-                  </SelectItem>
-                  <SelectItem value="us-west-2">US West (Oregon)</SelectItem>
-                  <SelectItem value="eu-west-1">EU (Ireland)</SelectItem>
-                  <SelectItem value="eu-central-1">EU (Frankfurt)</SelectItem>
-                  <SelectItem value="sa-east-1">
-                    South America (Sao Paulo)
-                  </SelectItem>
-                  <SelectItem value="ap-southeast-1">
-                    Asia Pacific (Singapore)
-                  </SelectItem>
-                </SelectContent>
-              </Select>
-            </div>
-            <div className="grid gap-4 sm:grid-cols-2">
-              <div className="space-y-2">
-                <Label htmlFor="ses-from-name">Nome do remetente</Label>
-                <Input
-                  id="ses-from-name"
-                  value={awsSes.fromName}
-                  onChange={(e) =>
-                    setAwsSes({ ...awsSes, fromName: e.target.value })
-                  }
-                />
-              </div>
-              <div className="space-y-2">
-                <Label htmlFor="ses-from-email">E-mail do remetente</Label>
-                <Input
-                  id="ses-from-email"
-                  type="email"
-                  value={awsSes.fromEmail}
-                  onChange={(e) =>
-                    setAwsSes({ ...awsSes, fromEmail: e.target.value })
-                  }
-                  placeholder="noreply@seudominio.com"
-                />
-              </div>
-            </div>
-          </div>
-        )}
-
-        {/* Actions */}
-        <div className="flex items-center justify-between border-t pt-4">
-          <div className="flex items-center gap-2">
-            <Switch id="email-active" defaultChecked />
-            <Label
-              htmlFor="email-active"
-              className="text-sm text-muted-foreground"
-            >
-              Envio de e-mails ativo
-            </Label>
-          </div>
-          <div className="flex gap-2">
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={() => {
-                setTestSent(true);
-                setTimeout(() => setTestSent(false), 3000);
-              }}
-            >
-              {testSent ? (
-                <>
-                  <CheckCircle2 className="mr-1 h-3.5 w-3.5 text-emerald-600" />
-                  Enviado
-                </>
-              ) : (
-                'Enviar teste'
-              )}
-            </Button>
-            <Button size="sm">Salvar</Button>
-          </div>
-        </div>
-      </CardContent>
-    </Card>
-  );
-}