88 lines
2.7 KiB
TypeScript
88 lines
2.7 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
|
|
type Status = 'ACTIVE' | 'DISCONNECTED' | 'BANNED' | 'PAIRING';
|
|
|
|
interface BotSummary {
|
|
id: string;
|
|
jid: string | null;
|
|
displayName: string | null;
|
|
status: Status;
|
|
}
|
|
|
|
export function BotSettingsCard({ initial }: { initial: { bot: BotSummary | null; shared: boolean; sharedBotId?: string } }) {
|
|
const [bot, setBot] = useState<BotSummary | null>(initial.bot);
|
|
const [revealedJid, setRevealedJid] = useState<string | null>(null);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
async function onReveal() {
|
|
setError(null);
|
|
const res = await fetch('/api/bot/reveal', {
|
|
method: 'POST',
|
|
credentials: 'include',
|
|
});
|
|
if (res.ok) {
|
|
const data = (await res.json()) as { jid: string };
|
|
setRevealedJid(data.jid);
|
|
} else {
|
|
setError('Reveal failed');
|
|
}
|
|
}
|
|
|
|
if (!bot) {
|
|
return (
|
|
<div className="rounded-lg border border-gray-200 p-6 bg-white">
|
|
<h2 className="text-lg font-medium mb-2">Bot</h2>
|
|
<p className="text-sm text-gray-600">
|
|
No bot assigned yet. Contact your platform administrator to get one assigned.
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="rounded-lg border border-gray-200 p-6 bg-white">
|
|
<div className="flex items-center justify-between mb-3">
|
|
<h2 className="text-lg font-medium">Bot</h2>
|
|
<span
|
|
className={`text-xs px-2 py-1 rounded ${
|
|
bot.status === 'ACTIVE'
|
|
? 'bg-green-100 text-green-800'
|
|
: bot.status === 'PAIRING'
|
|
? 'bg-yellow-100 text-yellow-800'
|
|
: 'bg-red-100 text-red-800'
|
|
}`}
|
|
>
|
|
{bot.status}
|
|
</span>
|
|
</div>
|
|
<dl className="text-sm space-y-1 mb-4">
|
|
<div>
|
|
<dt className="inline font-medium">Number: </dt>
|
|
<dd className="inline">
|
|
{revealedJid ?? (bot.jid ? '••••••••••' : '—')}
|
|
{!revealedJid && bot.status === 'ACTIVE' && (
|
|
<button
|
|
type="button"
|
|
onClick={onReveal}
|
|
className="ml-2 text-xs text-blue-600 underline"
|
|
>
|
|
Reveal
|
|
</button>
|
|
)}
|
|
</dd>
|
|
</div>
|
|
<div>
|
|
<dt className="inline font-medium">Display name: </dt>
|
|
<dd className="inline">{bot.displayName ?? '—'}</dd>
|
|
</div>
|
|
</dl>
|
|
<p className="text-xs text-gray-400">
|
|
Bot is assigned by the platform administrator. Contact support to change or remove it.
|
|
</p>
|
|
{error && <p className="text-sm text-red-600 mt-2">{error}</p>}
|
|
</div>
|
|
);
|
|
}
|