[deploy]

public/ts-build/components/admin/index.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initAdminSection = initAdminSection;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function initAdminSection(guildId) {
+    const section = document.getElementById('section-admin');
+    if (!section)
+        return;
+    section.innerHTML = '<p class="muted">Lade Admin-Daten...</p>';
+    try {
+        const data = await api_js_1.api.settings(guildId);
+        section.innerHTML = `
+      <h2 class="section-title">Admin</h2>
+      <div class="card">
+        <p class="muted">Rohdaten (nur Admin):</p>
+        <pre style="white-space:pre-wrap;max-height:320px;overflow:auto;">${JSON.stringify(data, null, 2)}</pre>
+      </div>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        section.innerHTML = '<div class="empty-state">Admin-Daten konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Admin-Daten', true);
+    }
+}

public/ts-build/components/dashboard.js

@@ -0,0 +1,93 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initDashboardView = initDashboardView;
+const api_js_1 = require("../services/api.js");
+const store_js_1 = require("../state/store.js");
+const toast_js_1 = require("../ui/toast.js");
+const overview_js_1 = require("./overview.js");
+const index_js_1 = require("./tickets/index.js");
+const index_js_2 = require("./modules/index.js");
+const index_js_3 = require("./events/index.js");
+const index_js_4 = require("./admin/index.js");
+const settings_js_1 = require("./settings.js");
+let overviewInterval = null;
+let ticketsInterval = null;
+async function populateGuildSelect() {
+    const select = document.getElementById('guildSelect');
+    const cfg = (0, store_js_1.getConfig)();
+    if (!select || !cfg)
+        return;
+    select.innerHTML = `<option>Loading...</option>`;
+    try {
+        const data = await api_js_1.api.guilds();
+        select.innerHTML = '';
+        data.guilds.forEach((g) => {
+            const opt = document.createElement('option');
+            opt.value = g.id;
+            opt.textContent = g.name;
+            if (g.id === cfg.initialGuildId)
+                opt.selected = true;
+            select.appendChild(opt);
+        });
+        const current = select.value || cfg.initialGuildId || data.guilds[0]?.id;
+        (0, store_js_1.setState)({ guildId: current || undefined });
+        select.value = current || '';
+    }
+    catch (err) {
+        console.error(err);
+        (0, toast_js_1.showToast)('Guilds konnten nicht geladen werden', true);
+    }
+}
+function registerGuildChange() {
+    const select = document.getElementById('guildSelect');
+    if (!select)
+        return;
+    select.addEventListener('change', () => {
+        const guildId = select.value;
+        (0, store_js_1.setState)({ guildId });
+        refreshSections();
+    });
+}
+async function refreshSections() {
+    const { guildId } = (0, store_js_1.getState)();
+    if (!guildId)
+        return;
+    await (0, overview_js_1.renderOverview)(guildId);
+    await (0, index_js_1.initTicketsSection)(guildId);
+    await (0, index_js_2.initModulesSection)(guildId);
+    await (0, settings_js_1.renderSettingsSection)(guildId);
+    await (0, index_js_3.initEventsSection)(guildId);
+    const cfg = (0, store_js_1.getConfig)();
+    if (cfg?.isAdmin) {
+        await (0, index_js_4.initAdminSection)(guildId);
+    }
+}
+function setupPolling() {
+    const { guildId } = (0, store_js_1.getState)();
+    if (overviewInterval)
+        window.clearInterval(overviewInterval);
+    if (ticketsInterval)
+        window.clearInterval(ticketsInterval);
+    overviewInterval = window.setInterval(() => {
+        const current = (0, store_js_1.getState)().guildId;
+        if (current)
+            (0, overview_js_1.renderOverview)(current);
+    }, 10000);
+    ticketsInterval = window.setInterval(() => {
+        const current = (0, store_js_1.getState)().guildId;
+        if (current)
+            (0, index_js_1.initTicketsSection)(current);
+    }, 12000);
+}
+function initDashboardView() {
+    const cfg = (0, store_js_1.getConfig)();
+    const logoutBtn = document.getElementById('logoutBtn');
+    if (logoutBtn && cfg) {
+        logoutBtn.addEventListener('click', () => (window.location.href = `${cfg.baseAuth}/logout`));
+    }
+    populateGuildSelect().then(() => {
+        registerGuildChange();
+        refreshSections();
+        setupPolling();
+    });
+}

public/ts-build/components/events/index.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initEventsSection = initEventsSection;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function initEventsSection(guildId) {
+    const section = document.getElementById('section-events');
+    if (!section)
+        return;
+    section.innerHTML = '<p class="muted">Lade Events...</p>';
+    try {
+        const data = await api_js_1.api.events(guildId);
+        const events = data?.events || data || [];
+        section.innerHTML = '<h2 class="section-title">Events</h2>';
+        if (!events.length) {
+            section.innerHTML += '<div class="empty-state">Keine Events geplant.</div>';
+            return;
+        }
+        const list = document.createElement('div');
+        list.className = 'ticket-list';
+        events.forEach((ev) => {
+            const item = document.createElement('div');
+            item.className = 'ticket-item';
+            item.innerHTML = `
+        <div class="row" style="justify-content:space-between;">
+          <div>
+            <div style="font-weight:750;">${ev.title || 'Event'}</div>
+            <div class="muted">${ev.date || ''}</div>
+          </div>
+          <span class="pill">${ev.status || 'open'}</span>
+        </div>
+        <div class="muted">${ev.description || ''}</div>
+      `;
+            list.appendChild(item);
+        });
+        section.appendChild(list);
+    }
+    catch (err) {
+        console.error(err);
+        section.innerHTML = '<div class="empty-state">Events konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Events', true);
+    }
+}

public/ts-build/components/guildSelect.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initSelectionView = initSelectionView;
+const api_js_1 = require("../services/api.js");
+const store_js_1 = require("../state/store.js");
+const toast_js_1 = require("../ui/toast.js");
+async function initSelectionView() {
+    const cfg = (0, store_js_1.getConfig)();
+    const grid = document.getElementById('guildGrid');
+    const logoutBtn = document.getElementById('logoutBtn');
+    const userInfo = document.getElementById('userInfo');
+    if (logoutBtn && cfg) {
+        logoutBtn.addEventListener('click', () => {
+            window.location.href = `${cfg.baseAuth}/logout`;
+        });
+    }
+    try {
+        const me = await api_js_1.api.me();
+        if (userInfo && me?.user)
+            userInfo.textContent = `${me.user.username}#${me.user.discriminator}`;
+    }
+    catch {
+        // ignore
+    }
+    if (!grid || !cfg)
+        return;
+    grid.innerHTML = '<div class="muted">Lade Guilds...</div>';
+    try {
+        const data = await api_js_1.api.guilds();
+        grid.innerHTML = '';
+        (data.guilds || []).forEach((g) => {
+            const card = document.createElement('div');
+            card.className = 'card clickable';
+            card.innerHTML = `
+        <div class="row">
+          <img src="${g.icon ? `https://cdn.discordapp.com/icons/${g.id}/${g.icon}.png` : 'https://cdn.discordapp.com/embed/avatars/0.png'}" alt="icon" style="width:42px;height:42px;border-radius:12px;object-fit:cover;"/>
+          <div>
+            <div style="font-weight:700;">${g.name}</div>
+            <div class="muted">ID: ${g.id}</div>
+          </div>
+        </div>
+        <div style="margin-top:10px;" class="pill">Zum Dashboard</div>
+      `;
+            card.addEventListener('click', () => {
+                const qs = g.id ? `?guildId=${encodeURIComponent(g.id)}` : '';
+                window.location.href = `${cfg.baseDashboard}${qs}`;
+            });
+            grid.appendChild(card);
+        });
+        if (!data.guilds?.length) {
+            grid.innerHTML = '<div class="empty-state">Bot ist in keiner Guild. Bitte Bot einladen.</div>';
+        }
+    }
+    catch (err) {
+        console.error(err);
+        grid.innerHTML = '<div class="empty-state">Fehler beim Laden der Guilds</div>';
+        (0, toast_js_1.showToast)('Guilds konnten nicht geladen werden', true);
+    }
+}

public/ts-build/components/modules/dynamicVoice.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderDynamicVoiceModule = renderDynamicVoiceModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderDynamicVoiceModule(guildId) {
+    const container = document.getElementById('module-dynamicvoice');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Dynamic Voice...</p>';
+    try {
+        const data = await api_js_1.api.dynamicVoice(guildId);
+        const cfg = data?.config || data?.dynamicVoiceConfig || {};
+        container.innerHTML = `
+      <h3 class="label">Dynamic Voice</h3>
+      <p class="muted">Lobby: ${cfg.lobbyChannelId || '-'}</p>
+      <p class="muted">Template: ${cfg.template || '-'}</p>
+      <p class="muted">User-Limit: ${cfg.userLimit ?? '-'}</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Dynamic Voice konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden von Dynamic Voice', true);
+    }
+}

public/ts-build/components/modules/index.js

@@ -0,0 +1,104 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initModulesSection = initModulesSection;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+const switch_js_1 = require("../../ui/switch.js");
+const welcome_js_1 = require("./welcome.js");
+const logging_js_1 = require("./logging.js");
+const reactionRoles_js_1 = require("./reactionRoles.js");
+const dynamicVoice_js_1 = require("./dynamicVoice.js");
+const statuspage_js_1 = require("./statuspage.js");
+const serverstats_js_1 = require("./serverstats.js");
+async function initModulesSection(guildId) {
+    const section = document.getElementById('section-modules');
+    if (!section)
+        return;
+    section.innerHTML = `
+    <h2 class="section-title">Module</h2>
+    <div class="card">
+      <div class="module-list" id="module-toggles"></div>
+    </div>
+    <div class="grid" style="margin-top:16px;">
+      <div class="card" id="module-welcome"></div>
+      <div class="card" id="module-logging"></div>
+      <div class="card" id="module-reactionroles"></div>
+      <div class="card" id="module-dynamicvoice"></div>
+      <div class="card" id="module-statuspage"></div>
+      <div class="card" id="module-serverstats"></div>
+    </div>
+  `;
+    await Promise.all([
+        renderModuleToggles(guildId),
+        (0, welcome_js_1.renderWelcomeModule)(guildId),
+        (0, logging_js_1.renderLoggingModule)(guildId),
+        (0, reactionRoles_js_1.renderReactionRolesModule)(guildId),
+        (0, dynamicVoice_js_1.renderDynamicVoiceModule)(guildId),
+        (0, statuspage_js_1.renderStatuspageModule)(guildId),
+        (0, serverstats_js_1.renderServerStatsModule)(guildId)
+    ]);
+}
+async function renderModuleToggles(guildId) {
+    const container = document.getElementById('module-toggles');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Module...</p>';
+    try {
+        const data = await api_js_1.api.modules(guildId);
+        const modules = data?.modules || data || {};
+        container.innerHTML = '';
+        const entries = [
+            { key: 'ticketsEnabled', label: 'Tickets', desc: 'Ticket-System aktivieren' },
+            { key: 'automodEnabled', label: 'Automod', desc: 'Moderations-Filter' },
+            { key: 'welcomeEnabled', label: 'Welcome', desc: 'Begrueßungsnachrichten' },
+            { key: 'musicEnabled', label: 'Musik', desc: 'Musiksteuerung' },
+            { key: 'levelingEnabled', label: 'Leveling', desc: 'XP/Level System' },
+            { key: 'statuspageEnabled', label: 'Statuspage', desc: 'Statusberichte' },
+            { key: 'serverStatsEnabled', label: 'Server Stats', desc: 'Stat-Channel' },
+            { key: 'birthdayEnabled', label: 'Birthday', desc: 'Geburtstagsmodul' },
+            { key: 'reactionRolesEnabled', label: 'Reaction Roles', desc: 'Selbstzuweisbare Rollen' },
+            { key: 'eventsEnabled', label: 'Events', desc: 'Event-Planung' },
+            { key: 'dynamicVoiceEnabled', label: 'Dynamic Voice', desc: 'Dynamische Voice Channels' }
+        ];
+        entries.forEach((entry) => {
+            const row = document.createElement('div');
+            row.className = 'module-item';
+            row.innerHTML = `
+        <div class="module-meta">
+          <div class="module-title">${entry.label}</div>
+          <div class="module-desc">${entry.desc}</div>
+        </div>
+        <div class="switch ${modules[entry.key] ? 'on' : ''}" data-key="${entry.key}"></div>
+      `;
+            const toggle = row.querySelector('.switch');
+            toggle.addEventListener('click', async () => {
+                (0, switch_js_1.setSwitch)(toggle, !(0, switch_js_1.getSwitch)(toggle));
+                await saveModules(guildId);
+            });
+            container.appendChild(row);
+        });
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Module konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Module', true);
+    }
+}
+async function saveModules(guildId) {
+    const toggles = Array.from(document.querySelectorAll('#module-toggles .switch'));
+    const payload = { guildId };
+    toggles.forEach((t) => {
+        const key = t.dataset.key;
+        if (!key)
+            return;
+        payload[key] = t.classList.contains('on');
+    });
+    try {
+        await api_js_1.api.saveSettings(payload);
+        (0, toast_js_1.showToast)('Module gespeichert');
+    }
+    catch (err) {
+        console.error(err);
+        (0, toast_js_1.showToast)('Module speichern fehlgeschlagen', true);
+    }
+}

public/ts-build/components/modules/logging.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderLoggingModule = renderLoggingModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderLoggingModule(guildId) {
+    const container = document.getElementById('module-logging');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Logging...</p>';
+    try {
+        const data = await api_js_1.api.settings(guildId);
+        const cfg = data?.settings?.loggingConfig || data?.loggingConfig || {};
+        container.innerHTML = `
+      <h3 class="label">Logging</h3>
+      <p class="muted">Channel: ${cfg.logChannelId || '-'}</p>
+      <p class="muted">Join/Leave: ${cfg.categories?.joinLeave ? 'an' : 'aus'}</p>
+      <p class="muted">System: ${cfg.categories?.system ? 'an' : 'aus'}</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Logging konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden von Logging', true);
+    }
+}

public/ts-build/components/modules/reactionRoles.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderReactionRolesModule = renderReactionRolesModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderReactionRolesModule(guildId) {
+    const container = document.getElementById('module-reactionroles');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Reaction Roles...</p>';
+    try {
+        const data = await api_js_1.api.reactionRoles(guildId);
+        const entries = data?.entries || data?.reactionRoles || [];
+        container.innerHTML = '<h3 class="label">Reaction Roles</h3>';
+        if (!entries.length) {
+            container.innerHTML += '<div class="empty-state">Keine Reaction Roles.</div>';
+            return;
+        }
+        const list = document.createElement('div');
+        list.className = 'ticket-list';
+        entries.slice(0, 3).forEach((e) => {
+            const item = document.createElement('div');
+            item.className = 'ticket-item';
+            item.innerHTML = `
+        <div style="font-weight:750;">${e.title || e.messageId || 'Eintrag'}</div>
+        <div class="muted">${e.channelId || ''}</div>
+      `;
+            list.appendChild(item);
+        });
+        container.appendChild(list);
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Reaction Roles konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Reaction Roles', true);
+    }
+}

public/ts-build/components/modules/serverstats.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderServerStatsModule = renderServerStatsModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderServerStatsModule(guildId) {
+    const container = document.getElementById('module-serverstats');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Server Stats...</p>';
+    try {
+        const data = await api_js_1.api.serverStats(guildId);
+        const cfg = data?.config || data || {};
+        const items = cfg.items || [];
+        container.innerHTML = `
+      <h3 class="label">Server Stats</h3>
+      <p class="muted">Kategorie: ${cfg.categoryId || '-'}</p>
+      <p class="muted">Refresh: ${cfg.refresh || '-'}m</p>
+      <p class="muted">Items: ${items.length}</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Server Stats konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Server Stats', true);
+    }
+}

public/ts-build/components/modules/statuspage.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderStatuspageModule = renderStatuspageModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderStatuspageModule(guildId) {
+    const container = document.getElementById('module-statuspage');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Statuspage...</p>';
+    try {
+        const data = await api_js_1.api.statuspage(guildId);
+        const cfg = data?.config || data || {};
+        const services = cfg.services || [];
+        container.innerHTML = `
+      <h3 class="label">Statuspage</h3>
+      <p class="muted">Channel: ${cfg.channelId || '-'}</p>
+      <p class="muted">Intervall: ${cfg.interval || '-'}m</p>
+      <p class="muted">Services: ${services.length}</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Statuspage konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Statuspage', true);
+    }
+}

public/ts-build/components/modules/welcome.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderWelcomeModule = renderWelcomeModule;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderWelcomeModule(guildId) {
+    const container = document.getElementById('module-welcome');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Welcome...</p>';
+    try {
+        const data = await api_js_1.api.settings(guildId);
+        const cfg = data?.settings?.welcomeConfig || data?.welcomeConfig || {};
+        container.innerHTML = `
+      <h3 class="label">Welcome</h3>
+      <p class="muted">Channel: ${cfg.channelId || '-'}</p>
+      <p class="muted">Embed Titel: ${cfg.embedTitle || '-'}</p>
+      <p class="muted">Status: ${data?.settings?.welcomeEnabled ? 'aktiv' : 'inaktiv'}</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Welcome konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden von Welcome', true);
+    }
+}

public/ts-build/components/overview.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderOverview = renderOverview;
+const api_js_1 = require("../services/api.js");
+const toast_js_1 = require("../ui/toast.js");
+async function renderOverview(guildId) {
+    const section = document.getElementById('section-overview');
+    if (!section)
+        return;
+    section.innerHTML = '<p class="muted">Lade Uebersicht...</p>';
+    try {
+        const data = await api_js_1.api.overview(guildId);
+        const stats = data?.stats || {};
+        section.innerHTML = `
+      <h2 class="section-title">Uebersicht</h2>
+      <div class="grid">
+        <div class="card">
+          <p class="label">Tickets offen</p>
+          <p class="stat">${stats.openTickets ?? '-'}</p>
+        </div>
+        <div class="card">
+          <p class="label">Module aktiv</p>
+          <p class="stat">${stats.activeModules ?? '-'}</p>
+        </div>
+        <div class="card">
+          <p class="label">Events geplant</p>
+          <p class="stat">${stats.events ?? '-'}</p>
+        </div>
+      </div>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        section.innerHTML = '<div class="empty-state">Uebersicht konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Uebersicht', true);
+    }
+}

public/ts-build/components/settings.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderSettingsSection = renderSettingsSection;
+const api_js_1 = require("../services/api.js");
+const toast_js_1 = require("../ui/toast.js");
+async function renderSettingsSection(guildId) {
+    const section = document.getElementById('section-settings');
+    if (!section)
+        return;
+    section.innerHTML = '<p class="muted">Lade Einstellungen...</p>';
+    try {
+        const data = await api_js_1.api.settings(guildId);
+        const settings = data?.settings || {};
+        section.innerHTML = `
+      <h2 class="section-title">Einstellungen</h2>
+      <div class="card">
+        <pre style="white-space:pre-wrap;">${JSON.stringify(settings, null, 2)}</pre>
+      </div>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        section.innerHTML = '<div class="empty-state">Einstellungen konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Einstellungen', true);
+    }
+}

public/ts-build/components/tickets/automations.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderAutomations = renderAutomations;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderAutomations(guildId) {
+    const container = document.getElementById('tickets-automations');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Automationen...</p>';
+    try {
+        const data = await api_js_1.api.automations(guildId);
+        const rules = data?.rules || data || [];
+        if (!rules.length) {
+            container.innerHTML = '<div class="empty-state">Keine Regeln angelegt.</div>';
+            return;
+        }
+        const list = document.createElement('div');
+        list.className = 'ticket-list';
+        rules.forEach((r) => {
+            const item = document.createElement('div');
+            item.className = 'ticket-item';
+            item.innerHTML = `
+        <div class="row" style="justify-content:space-between;">
+          <div>
+            <div style="font-weight:750;">${r.name || 'Regel'}</div>
+            <div class="muted">${r.condition?.type || r.condition?.status || ''}</div>
+          </div>
+          <span class="pill">${r.active ? 'aktiv' : 'inaktiv'}</span>
+        </div>
+      `;
+            list.appendChild(item);
+        });
+        container.innerHTML = '<h3 class="label">Automationen</h3>';
+        container.appendChild(list);
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Automationen konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Automationen', true);
+    }
+}

public/ts-build/components/tickets/index.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initTicketsSection = initTicketsSection;
+const list_js_1 = require("./list.js");
+const pipeline_js_1 = require("./pipeline.js");
+const sla_js_1 = require("./sla.js");
+const automations_js_1 = require("./automations.js");
+const kb_js_1 = require("./kb.js");
+async function initTicketsSection(guildId) {
+    const section = document.getElementById('section-tickets');
+    if (!section)
+        return;
+    section.innerHTML = `
+    <h2 class="section-title">Tickets</h2>
+    <div class="tickets-grid">
+      <div class="card" id="tickets-list"></div>
+      <div class="card" id="tickets-pipeline"></div>
+      <div class="card" id="tickets-sla"></div>
+    </div>
+    <div class="grid" style="margin-top:16px;">
+      <div class="card" id="tickets-automations"></div>
+      <div class="card" id="tickets-kb"></div>
+    </div>
+  `;
+    await Promise.all([
+        (0, list_js_1.renderTicketList)(guildId),
+        (0, pipeline_js_1.renderPipeline)(guildId),
+        (0, sla_js_1.renderSla)(guildId),
+        (0, automations_js_1.renderAutomations)(guildId),
+        (0, kb_js_1.renderKb)(guildId)
+    ]);
+}

public/ts-build/components/tickets/kb.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderKb = renderKb;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderKb(guildId) {
+    const container = document.getElementById('tickets-kb');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Knowledge Base...</p>';
+    try {
+        const data = await api_js_1.api.kb(guildId);
+        const entries = data?.articles || data?.kb || [];
+        if (!entries.length) {
+            container.innerHTML = '<div class="empty-state">Keine KB-Eintraege.</div>';
+            return;
+        }
+        const list = document.createElement('div');
+        list.className = 'ticket-list';
+        entries.slice(0, 4).forEach((k) => {
+            const item = document.createElement('div');
+            item.className = 'ticket-item';
+            item.innerHTML = `
+        <div style="font-weight:750;">${k.title || 'Artikel'}</div>
+        <div class="muted">${k.keywords || ''}</div>
+      `;
+            list.appendChild(item);
+        });
+        container.innerHTML = '<h3 class="label">Knowledge Base</h3>';
+        container.appendChild(list);
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">KB konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der KB', true);
+    }
+}

public/ts-build/components/tickets/list.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderTicketList = renderTicketList;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderTicketList(guildId) {
+    const container = document.getElementById('tickets-list');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Tickets...</p>';
+    try {
+        const data = await api_js_1.api.tickets(guildId);
+        const tickets = data?.tickets || [];
+        if (!tickets.length) {
+            container.innerHTML = '<div class="empty-state">Keine Tickets</div>';
+            return;
+        }
+        const list = document.createElement('div');
+        list.className = 'ticket-list';
+        tickets.slice(0, 5).forEach((t) => {
+            const item = document.createElement('div');
+            item.className = 'ticket-item';
+            item.innerHTML = `
+        <div class="row" style="justify-content:space-between;">
+          <div>
+            <div style="font-weight:750;font-size:15px;">${t.title || t.id}</div>
+            <div class="muted">${t.user || ''}</div>
+          </div>
+          <div class="ticket-status status-${t.status || 'open'}">${t.status || 'open'}</div>
+        </div>
+        <div class="muted">${t.description || ''}</div>
+      `;
+            list.appendChild(item);
+        });
+        container.innerHTML = '<h3 class="label">Aktuelle Tickets</h3>';
+        container.appendChild(list);
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Tickets konnten nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Tickets', true);
+    }
+}

public/ts-build/components/tickets/pipeline.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderPipeline = renderPipeline;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderPipeline(guildId) {
+    const container = document.getElementById('tickets-pipeline');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade Pipeline...</p>';
+    try {
+        const data = await api_js_1.api.pipeline(guildId);
+        const lanes = data?.lanes || [];
+        container.innerHTML = '<h3 class="label">Pipeline</h3>';
+        if (!lanes.length) {
+            container.innerHTML += '<div class="empty-state">Keine Pipeline-Daten</div>';
+            return;
+        }
+        const grid = document.createElement('div');
+        grid.className = 'grid';
+        lanes.forEach((lane) => {
+            const card = document.createElement('div');
+            card.className = 'card';
+            card.innerHTML = `
+        <p class="label">${lane.name || 'Lane'}</p>
+        <p class="stat">${lane.count ?? 0}</p>
+      `;
+            grid.appendChild(card);
+        });
+        container.appendChild(grid);
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">Pipeline konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der Pipeline', true);
+    }
+}

public/ts-build/components/tickets/sla.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderSla = renderSla;
+const api_js_1 = require("../../services/api.js");
+const toast_js_1 = require("../../ui/toast.js");
+async function renderSla(guildId) {
+    const container = document.getElementById('tickets-sla');
+    if (!container)
+        return;
+    container.innerHTML = '<p class="muted">Lade SLA...</p>';
+    try {
+        const data = await api_js_1.api.sla(guildId);
+        const stats = data?.stats || {};
+        container.innerHTML = `
+      <h3 class="label">SLA</h3>
+      <p class="stat">${stats.averageResponse ?? '-'}m</p>
+      <p class="muted">Durchschnittliche Antwortzeit</p>
+    `;
+    }
+    catch (err) {
+        console.error(err);
+        container.innerHTML = '<div class="empty-state">SLA konnte nicht geladen werden.</div>';
+        (0, toast_js_1.showToast)('Fehler beim Laden der SLA', true);
+    }
+}