add telegram post creation feature but experimental

This commit is contained in:
2026-02-19 20:02:49 +01:00
parent 5ba5cae98f
commit 2d3c559fcb
7 changed files with 631 additions and 1 deletions

View File

@@ -169,6 +169,71 @@
{% endif %}
</div>
<!-- Telegram Bot Connection -->
{% if telegram_enabled %}
<div class="card-bg rounded-xl border border-gray-700 p-6 mb-6">
<h2 class="text-xl font-semibold text-white mb-4 flex items-center gap-2">
<svg class="w-5 h-5 text-[#26A5E4]" fill="currentColor" viewBox="0 0 24 24">
<path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
</svg>
Telegram verbinden
<span class="text-xs bg-yellow-500/20 text-yellow-400 px-2 py-0.5 rounded ml-2">Experimentell</span>
</h2>
{% if telegram_account %}
<!-- Connected State -->
<div class="bg-green-900/20 border border-green-600 rounded-lg p-4 mb-4">
<div class="flex items-center gap-3">
<svg class="w-5 h-5 text-green-400 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
<div>
<p class="text-white font-medium">
{% if telegram_account.telegram_username %}
@{{ telegram_account.telegram_username }}
{% elif telegram_account.telegram_first_name %}
{{ telegram_account.telegram_first_name }}
{% else %}
Telegram verbunden
{% endif %}
</p>
{% if telegram_account.created_at %}
<p class="text-gray-400 text-sm mt-0.5">
Verbunden seit {{ telegram_account.created_at.strftime('%d.%m.%Y') }}
</p>
{% endif %}
</div>
</div>
</div>
<button onclick="disconnectTelegram()"
class="px-6 py-3 bg-red-600 hover:bg-red-700 text-white rounded-lg transition-colors flex items-center gap-2">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
</svg>
Verbindung trennen
</button>
{% else %}
<!-- Not Connected State -->
<p class="text-gray-400 mb-4">
Verbinde Telegram, um LinkedIn-Posts direkt per Chat zu erstellen ohne die Web-App öffnen zu müssen.
</p>
<button onclick="connectTelegram()"
class="inline-flex items-center gap-2 px-6 py-3 bg-[#26A5E4] hover:bg-[#1a8bc4] text-white rounded-lg transition-colors">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
<path d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/>
</svg>
Mit Telegram verbinden
</button>
<div id="telegramLinkBox" class="hidden mt-4 p-4 bg-brand-bg-light rounded-lg border border-brand-bg-light">
<p class="text-sm text-gray-400 mb-2">Öffne diesen Link in Telegram:</p>
<a id="telegramLink" href="#" target="_blank" rel="noopener"
class="text-[#26A5E4] hover:underline break-all text-sm font-mono"></a>
<p class="text-xs text-gray-500 mt-2">Der Link ist 10 Minuten gültig.</p>
</div>
{% endif %}
</div>
{% endif %}
<!-- Workflow Info -->
<div class="card-bg rounded-xl border p-6">
<h2 class="text-lg font-semibold text-white mb-4 flex items-center gap-2">
@@ -255,6 +320,36 @@ document.getElementById('emailSettingsForm').addEventListener('submit', async (e
}
});
// Telegram connect
async function connectTelegram() {
try {
const res = await fetch('/settings/telegram/start');
if (!res.ok) throw new Error('Fehler beim Generieren des Links');
const data = await res.json();
const link = `https://t.me/${data.bot_username}?start=${data.token}`;
document.getElementById('telegramLink').href = link;
document.getElementById('telegramLink').textContent = link;
document.getElementById('telegramLinkBox').classList.remove('hidden');
} catch (error) {
console.error('Error connecting Telegram:', error);
alert('Fehler: ' + error.message);
}
}
// Telegram disconnect
async function disconnectTelegram() {
if (!confirm('Telegram-Verbindung wirklich trennen?')) {
return;
}
try {
await fetch('/api/settings/telegram/disconnect', { method: 'POST' });
window.location.reload();
} catch (error) {
console.error('Error disconnecting Telegram:', error);
alert('Fehler: ' + error.message);
}
}
// LinkedIn disconnect
async function disconnectLinkedIn() {
if (!confirm('LinkedIn-Verbindung wirklich trennen?\n\nPosts werden dann nicht mehr automatisch veröffentlicht und du erhältst wieder Email-Benachrichtigungen.')) {