@kaikybrofc/omnizap-system 2.3.4 → 2.3.5

package/public/user/index.html

@@ -16,14 +16,21 @@
     <link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@500;600;700&display=swap" rel="stylesheet" />
     <style>
       :root {
-        --bg: #0f172a;
-        --bg-2: #111827;
-        --card: #1e293bcf;
-        --line: rgba(255, 255, 255, 0.05);
-        --text: #f8fafc;
-        --muted: #94a3b8;
-        --primary: #22c55e;
-        --radius: 18px;
+        --bg: #060d1a;
+        --bg-2: #0c1a31;
+        --bg-3: #102542;
+        --surface: #132340d6;
+        --surface-2: #152948f0;
+        --line: #8ab4ff2b;
+        --line-strong: #9fc4ff61;
+        --text: #f5f9ff;
+        --muted: #9eb2ce;
+        --primary: #1fd08b;
+        --accent: #5a8fff;
+        --danger: #ffb3b3;
+        --radius-xl: 26px;
+        --radius-lg: 18px;
+        --radius-md: 14px;
       }
 
       * {
@@ -40,33 +47,33 @@
       body {
         color: var(--text);
         font-family: 'Manrope', system-ui, sans-serif;
-        background: radial-gradient(55rem 22rem at -10% -10%, #2563eb30, transparent 60%), radial-gradient(55rem 22rem at 110% -8%, #7c3aed22, transparent 56%), linear-gradient(160deg, var(--bg), var(--bg-2));
+        background:
+          radial-gradient(70rem 40rem at -12% -18%, #1d4ed855, transparent 62%),
+          radial-gradient(55rem 30rem at 108% -6%, #0ea5e941, transparent 66%),
+          linear-gradient(160deg, var(--bg), var(--bg-2) 52%, var(--bg-3));
         min-height: 100vh;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: 24px 14px;
+        padding: clamp(12px, 2.2vw, 28px);
       }
 
       .page {
-        width: min(840px, 100%);
-        border: 1px solid rgba(255, 255, 255, 0.05);
-        border-radius: 24px;
-        background: linear-gradient(150deg, #111827e8, #1e293bee);
+        width: min(1080px, 100%);
+        margin-inline: auto;
+        border: 1px solid #8ab4ff1f;
+        border-radius: var(--radius-xl);
+        background: linear-gradient(145deg, #101d37ef 2%, #0f1b33f3 44%, #13294af2 100%);
         box-shadow:
-          0 18px 44px #0209166e,
-          inset 0 1px 0 #95c1ff1a;
+          0 25px 70px #01091585,
+          inset 0 1px 0 #d3e4ff2e;
         overflow: hidden;
       }
 
       .head {
-        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
-        padding: 20px 22px;
-        display: flex;
+        border-bottom: 1px solid var(--line);
+        padding: clamp(16px, 2.1vw, 24px);
+        display: grid;
+        grid-template-columns: 1fr auto;
+        gap: 12px 16px;
         align-items: center;
-        justify-content: space-between;
-        gap: 14px;
-        flex-wrap: wrap;
       }
 
       .brand {
@@ -75,71 +82,93 @@
         gap: 10px;
         font-family: 'Sora', sans-serif;
         font-weight: 700;
-        letter-spacing: 0.2px;
+        letter-spacing: 0.03em;
         text-decoration: none;
         color: var(--text);
       }
 
       .brand img {
-        width: 30px;
-        height: 30px;
-        border-radius: 50%;
-        border: 1px solid rgba(255, 255, 255, 0.05);
+        width: 34px;
+        height: 34px;
+        border-radius: 12px;
+        border: 1px solid var(--line);
         object-fit: cover;
+        box-shadow: 0 10px 22px #0000004b;
       }
 
       .head-actions {
-        display: flex;
-        flex-wrap: wrap;
+        display: grid;
+        grid-auto-flow: column;
+        grid-auto-columns: max-content;
         gap: 8px;
       }
 
       .btn {
         border: 1px solid var(--line);
         border-radius: 12px;
-        background: #101a2f;
+        background: #0e1b33;
         color: var(--text);
         text-decoration: none;
-        padding: 9px 12px;
+        padding: 10px 14px;
         font-size: 14px;
-        font-weight: 600;
+        font-weight: 700;
+        line-height: 1.2;
+        text-align: center;
+        display: inline-flex;
+        justify-content: center;
+        align-items: center;
         transition:
           transform 0.2s ease,
           border-color 0.2s ease,
-          box-shadow 0.2s ease;
+          box-shadow 0.2s ease,
+          background-color 0.2s ease;
         cursor: pointer;
       }
 
       .btn:hover {
         transform: translateY(-1px);
-        border-color: #2563eb;
-        box-shadow: 0 10px 20px #02091650;
+        border-color: var(--line-strong);
+        box-shadow: 0 12px 24px #01091557;
       }
 
       .btn.primary {
         border-color: transparent;
-        background: #22c55e;
-        color: #0f172a;
-        box-shadow: 0 10px 22px #22c55e30;
+        background: linear-gradient(120deg, #1fd08b, #22c55e);
+        color: #072116;
+        box-shadow: 0 12px 24px #22c55e3d;
       }
 
       .btn.primary:hover {
-        background: #16a34a;
+        background: linear-gradient(120deg, #2be09b, #33d46d);
       }
 
       .content {
-        padding: 24px 22px;
+        padding: clamp(18px, 2.6vw, 30px);
+        display: grid;
+        gap: clamp(14px, 2vw, 22px);
+      }
+
+      .intro {
         display: grid;
-        gap: 14px;
+        gap: 8px;
+      }
+
+      .eyebrow {
+        margin: 0;
+        font-family: 'Sora', sans-serif;
+        font-size: 12px;
+        letter-spacing: 0.16em;
+        text-transform: uppercase;
+        color: #95b8ff;
       }
 
       h1 {
         margin: 0;
         font-family: 'Sora', sans-serif;
-        font-size: clamp(26px, 3.6vw, 36px);
-        line-height: 1.08;
-        letter-spacing: -0.02em;
-        background: linear-gradient(90deg, #eef5ff 0%, #60a5fa 46%, #a78bfa 100%);
+        font-size: clamp(28px, 4vw, 46px);
+        line-height: 1.05;
+        letter-spacing: -0.03em;
+        background: linear-gradient(100deg, #f6fbff 0%, #9bc5ff 52%, #77b4ff 100%);
         -webkit-background-clip: text;
         background-clip: text;
         color: transparent;
@@ -147,141 +176,205 @@
 
       .lead {
         margin: 0;
-        color: #bfd1ea;
+        color: #bfd3ef;
         line-height: 1.6;
         font-size: 16px;
+        max-width: 68ch;
       }
 
       .card {
-        border: 1px solid #334f7bc7;
-        border-radius: var(--radius);
-        background: var(--card);
-        padding: 16px;
+        border: 1px solid #5d8dd23b;
+        border-radius: var(--radius-lg);
+        background: linear-gradient(150deg, var(--surface) 0%, var(--surface-2) 100%);
+        padding: clamp(14px, 2.2vw, 20px);
         display: grid;
         gap: 12px;
-        backdrop-filter: blur(8px);
+        backdrop-filter: blur(9px);
+      }
+
+      .dashboard-card {
+        position: relative;
+        overflow: hidden;
+      }
+
+      .dashboard-card::before {
+        content: '';
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        background: linear-gradient(160deg, #8fb3ff10 0%, transparent 36%, #1fd08b0f 100%);
       }
 
       .status {
+        position: relative;
         margin: 0;
-        color: #dce8fa;
+        color: #e7f0ff;
         font-size: 15px;
+        font-weight: 600;
         line-height: 1.5;
+        padding: 12px 14px;
+        border: 1px solid #6d9de440;
+        border-radius: var(--radius-md);
+        background: #112647d1;
       }
 
       .error {
+        position: relative;
         margin: 0;
-        border: 1px solid #a74949;
-        border-radius: 12px;
-        background: #3b181899;
-        color: #ffd7d7;
-        padding: 9px 10px;
+        border: 1px solid #ff8f8f87;
+        border-radius: var(--radius-md);
+        background: #3d1e2fb0;
+        color: var(--danger);
+        padding: 10px 12px;
         font-size: 14px;
       }
 
       .profile {
+        position: relative;
         display: grid;
         grid-template-columns: auto 1fr;
-        gap: 12px;
+        gap: 12px 14px;
         align-items: center;
-        border: 1px solid #31517fb5;
-        border-radius: 14px;
-        background: #1e293bbf;
-        padding: 12px;
+        border: 1px solid #7facf249;
+        border-radius: var(--radius-md);
+        background: #0f1f38bf;
+        padding: clamp(12px, 1.8vw, 16px);
       }
 
       .avatar {
-        width: 66px;
-        height: 66px;
+        width: clamp(64px, 8vw, 82px);
+        height: clamp(64px, 8vw, 82px);
         border-radius: 16px;
-        border: 1px solid #3c5a89;
+        border: 1px solid #7ca8e178;
         object-fit: cover;
-        background: #0b1323;
+        background: #0b1528;
+        box-shadow: 0 10px 24px #030b1961;
       }
 
       .profile-meta h2 {
-        margin: 0 0 4px;
-        font-size: 20px;
+        margin: 0 0 6px;
+        font-size: clamp(20px, 2.1vw, 26px);
         line-height: 1.2;
+        letter-spacing: -0.02em;
       }
 
       .profile-meta p {
         margin: 0;
         color: var(--muted);
         font-size: 14px;
-        line-height: 1.45;
+        line-height: 1.5;
         word-break: break-word;
       }
 
       .grid {
+        position: relative;
         display: grid;
-        grid-template-columns: repeat(4, minmax(0, 1fr));
-        gap: 8px;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 10px;
       }
 
       .metric {
-        border: 1px solid #31517fb5;
-        border-radius: 12px;
-        background: #1e293bbf;
-        padding: 10px;
+        border: 1px solid #7facf242;
+        border-radius: var(--radius-md);
+        background: #0f1f39b8;
+        padding: 12px;
+        min-height: 94px;
+        display: grid;
+        align-content: space-between;
       }
 
       .metric-label {
-        margin: 0 0 4px;
-        color: #94a3b8;
+        margin: 0;
+        color: #9bb2d2;
         font-size: 12px;
+        font-weight: 600;
+        letter-spacing: 0.05em;
+        text-transform: uppercase;
       }
 
       .metric-value {
-        margin: 0;
-        color: #e8f1ff;
-        font-size: 19px;
+        margin: 6px 0 0;
+        color: #f1f7ff;
+        font-size: clamp(22px, 3vw, 28px);
         font-weight: 800;
-        letter-spacing: -0.01em;
+        letter-spacing: -0.02em;
+        line-height: 1.05;
       }
 
-      .summary {
-        border: 1px solid #2b8b5d9c;
-        border-radius: 12px;
-        background: #11302294;
-        padding: 10px;
+      .actions {
+        position: relative;
         display: grid;
-        gap: 6px;
-        color: #dfffe8;
-        font-size: 14px;
-      }
-
-      .summary strong {
-        color: #f4fff8;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+        gap: 10px;
       }
 
-      .actions {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 8px;
+      #user-chat-link {
+        grid-column: 1 / -1;
       }
 
       .footer {
         margin: 0;
-        color: #7f94b8;
+        color: #88a2c8;
         font-size: 12px;
-      }
+        text-align: center;
+      }
+
+      @media (min-width: 920px) {
+        .dashboard-card {
+          grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
+          grid-template-areas:
+            'status status'
+            'error error'
+            'profile grid'
+            'actions actions';
+          gap: 14px;
+        }
 
-      @media (max-width: 760px) {
-        .grid {
-          grid-template-columns: repeat(2, minmax(0, 1fr));
+        #user-status {
+          grid-area: status;
+        }
+
+        #user-error {
+          grid-area: error;
+        }
+
+        #user-profile {
+          grid-area: profile;
+        }
+
+        #user-grid {
+          grid-area: grid;
+          align-self: start;
+        }
+
+        #user-actions {
+          grid-area: actions;
+          grid-template-columns: repeat(3, minmax(0, 1fr));
+        }
+
+        #user-chat-link {
+          grid-column: span 2;
         }
       }
 
-      @media (max-width: 620px) {
+      @media (max-width: 840px) {
         .head {
-          padding: 16px;
+          grid-template-columns: 1fr;
         }
 
-        .content {
-          padding: 18px 16px;
+        .head-actions {
+          width: 100%;
+          grid-template-columns: repeat(2, minmax(0, 1fr));
+          grid-auto-flow: row;
+          grid-auto-columns: 1fr;
+        }
+
+        .head-actions .btn {
+          width: 100%;
         }
+      }
 
+      @media (max-width: 620px) {
         .profile {
           grid-template-columns: 1fr;
           text-align: center;
@@ -291,9 +384,23 @@
           margin-inline: auto;
         }
 
-        .actions .btn {
+        .actions {
+          grid-template-columns: 1fr;
+        }
+
+        #user-chat-link {
+          grid-column: auto;
+        }
+
+        .actions .btn,
+        .actions button.btn {
           width: 100%;
-          text-align: center;
+        }
+      }
+
+      @media (max-width: 430px) {
+        .grid {
+          grid-template-columns: 1fr;
         }
       }
     </style>
@@ -312,10 +419,13 @@
       </header>
 
       <section class="content">
-        <h1>Minha Conta</h1>
-        <p class="lead">Informações da sua conta vinculada ao OmniZap e atalhos rápidos de acesso.</p>
+        <div class="intro">
+          <p class="eyebrow">Painel do usuário</p>
+          <h1>Minha Conta</h1>
+          <p class="lead">Informações da sua conta vinculada ao OmniZap e atalhos rápidos para gerenciar seus stickers com agilidade no desktop e no celular.</p>
+        </div>
 
-        <article class="card">
+        <article class="card dashboard-card">
           <p id="user-status" class="status">Carregando dados da conta...</p>
           <p id="user-error" class="error" hidden></p>
 
@@ -347,12 +457,6 @@
             </article>
           </div>
 
-          <div id="user-summary" class="summary" hidden>
-            <div><strong>Owner JID:</strong> <span id="user-owner-jid"></span></div>
-            <div><strong>Google ID:</strong> <span id="user-google-sub"></span></div>
-            <div><strong>Sessão expira:</strong> <span id="user-expires-at"></span></div>
-          </div>
-
           <div id="user-actions" class="actions" hidden>
             <a id="user-chat-link" class="btn primary" href="https://api.whatsapp.com/send/?text=%2Fmenu&type=custom_url&app_absent=0" target="_blank" rel="noreferrer noopener"> Voltar ao chat do bot (/menu) </a>
             <a id="user-manage-main-link" class="btn" href="/stickers/perfil">Gerenciar meus stickers</a>

package/server/controllers/admin/adminBanService.js

@@ -0,0 +1,138 @@
+import { randomUUID } from 'node:crypto';
+
+export const createStickerCatalogAdminBanService = ({ executeQuery, tables, sanitizeText, normalizeGoogleSubject, normalizeEmail, normalizeJid, toIsoOrNull, revokeGoogleWebSessionsByIdentity = async () => 0 }) => {
+  const TABLES = tables;
+
+  const mapAdminBanRow = (row) => {
+    if (!row || typeof row !== 'object') return null;
+    return {
+      id: String(row.id || '').trim(),
+      google_sub: normalizeGoogleSubject(row.google_sub),
+      email: normalizeEmail(row.email),
+      owner_jid: normalizeJid(row.owner_jid) || null,
+      reason: sanitizeText(row.reason || '', 255, { allowEmpty: true }) || null,
+      created_by_google_sub: normalizeGoogleSubject(row.created_by_google_sub),
+      created_by_email: normalizeEmail(row.created_by_email),
+      created_at: toIsoOrNull(row.created_at),
+      updated_at: toIsoOrNull(row.updated_at),
+      revoked_at: toIsoOrNull(row.revoked_at),
+    };
+  };
+
+  const findActiveAdminBanForIdentity = async ({ googleSub = '', email = '', ownerJid = '' } = {}) => {
+    const normalizedSub = normalizeGoogleSubject(googleSub);
+    const normalizedEmail = normalizeEmail(email);
+    const normalizedOwnerJid = normalizeJid(ownerJid) || '';
+    const clauses = [];
+    const params = [];
+    if (normalizedSub) {
+      clauses.push('google_sub = ?');
+      params.push(normalizedSub);
+    }
+    if (normalizedEmail) {
+      clauses.push('email = ?');
+      params.push(normalizedEmail);
+    }
+    if (normalizedOwnerJid) {
+      clauses.push('owner_jid = ?');
+      params.push(normalizedOwnerJid);
+    }
+    if (!clauses.length) return null;
+
+    const rows = await executeQuery(
+      `SELECT *
+         FROM ${TABLES.STICKER_WEB_ADMIN_BAN}
+        WHERE revoked_at IS NULL
+          AND (${clauses.join(' OR ')})
+        ORDER BY created_at DESC
+        LIMIT 1`,
+      params,
+    );
+    return mapAdminBanRow(Array.isArray(rows) ? rows[0] : null);
+  };
+
+  const listAdminBans = async ({ activeOnly = false, limit = 100 } = {}) => {
+    const safeLimit = Math.max(1, Math.min(500, Number(limit || 100)));
+    const rows = await executeQuery(
+      `SELECT *
+         FROM ${TABLES.STICKER_WEB_ADMIN_BAN}
+        ${activeOnly ? 'WHERE revoked_at IS NULL' : ''}
+        ORDER BY created_at DESC
+        LIMIT ${safeLimit}`,
+    );
+    return (Array.isArray(rows) ? rows : []).map(mapAdminBanRow).filter(Boolean);
+  };
+
+  const createAdminBanRecord = async ({ googleSub = '', email = '', ownerJid = '', reason = '', adminSession = null }) => {
+    const normalizedSub = normalizeGoogleSubject(googleSub);
+    const normalizedEmail = normalizeEmail(email);
+    const normalizedOwnerJid = normalizeJid(ownerJid) || '';
+    if (!normalizedSub && !normalizedEmail && !normalizedOwnerJid) {
+      const error = new Error('Informe google_sub, email ou owner_jid para banir.');
+      error.statusCode = 400;
+      throw error;
+    }
+
+    const existing = await findActiveAdminBanForIdentity({
+      googleSub: normalizedSub,
+      email: normalizedEmail,
+      ownerJid: normalizedOwnerJid,
+    });
+    if (existing) return { created: false, ban: existing };
+
+    const banId = randomUUID();
+    await executeQuery(
+      `INSERT INTO ${TABLES.STICKER_WEB_ADMIN_BAN}
+        (id, google_sub, email, owner_jid, reason, created_by_google_sub, created_by_email)
+       VALUES (?, ?, ?, ?, ?, ?, ?)`,
+      [banId, normalizedSub || null, normalizedEmail || null, normalizedOwnerJid || null, sanitizeText(reason || '', 255, { allowEmpty: true }) || null, normalizeGoogleSubject(adminSession?.googleSub) || null, normalizeEmail(adminSession?.email) || null],
+    );
+
+    if (normalizedSub || normalizedEmail || normalizedOwnerJid) {
+      await revokeGoogleWebSessionsByIdentity({
+        googleSub: normalizedSub,
+        email: normalizedEmail,
+        ownerJid: normalizedOwnerJid,
+      }).catch(() => {});
+    }
+
+    const rows = await executeQuery(`SELECT * FROM ${TABLES.STICKER_WEB_ADMIN_BAN} WHERE id = ? LIMIT 1`, [banId]);
+    return { created: true, ban: mapAdminBanRow(Array.isArray(rows) ? rows[0] : null) };
+  };
+
+  const revokeAdminBanRecord = async (banId) => {
+    const normalizedId = sanitizeText(banId, 36, { allowEmpty: false });
+    if (!normalizedId) {
+      const error = new Error('ban_id invalido.');
+      error.statusCode = 400;
+      throw error;
+    }
+    await executeQuery(
+      `UPDATE ${TABLES.STICKER_WEB_ADMIN_BAN}
+          SET revoked_at = COALESCE(revoked_at, UTC_TIMESTAMP())
+        WHERE id = ?`,
+      [normalizedId],
+    );
+    const rows = await executeQuery(`SELECT * FROM ${TABLES.STICKER_WEB_ADMIN_BAN} WHERE id = ? LIMIT 1`, [normalizedId]);
+    return mapAdminBanRow(Array.isArray(rows) ? rows[0] : null);
+  };
+
+  const assertGoogleIdentityNotBanned = async ({ sub = '', email = '', ownerJid = '' } = {}) => {
+    const ban = await findActiveAdminBanForIdentity({ googleSub: sub, email, ownerJid });
+    if (!ban) return null;
+    const error = new Error('Conta bloqueada pela administracao.');
+    error.statusCode = 403;
+    error.code = 'ADMIN_BANNED';
+    error.ban = ban;
+    throw error;
+  };
+
+  return {
+    mapAdminBanRow,
+    findActiveAdminBanForIdentity,
+    listAdminBans,
+    createAdminBanRecord,
+    revokeAdminBanRecord,
+    assertGoogleIdentityNotBanned,
+  };
+};