forked from pinks/eris
main #14
|
@ -48,14 +48,18 @@ export function AdminsPage(props: { sessionId: string | null }) {
|
||||||
|
|
||||||
{getAdmins.data?.length
|
{getAdmins.data?.length
|
||||||
? (
|
? (
|
||||||
<ul className="my-4 flex flex-col gap-2">
|
<ul className="flex flex-col gap-2">
|
||||||
{getAdmins.data.map((admin) => (
|
{getAdmins.data.map((admin) => (
|
||||||
<AdminListItem key={admin.id} admin={admin} sessionId={sessionId} />
|
<AdminListItem key={admin.id} admin={admin} sessionId={sessionId} />
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
)
|
)
|
||||||
: getAdmins.data?.length === 0
|
: getAdmins.data?.length === 0
|
||||||
? <p>No admins</p>
|
? (
|
||||||
|
<li className="flex flex-col gap-2 rounded-md bg-zinc-100 dark:bg-zinc-800 p-2">
|
||||||
|
<p key="no-admins" className="text-center text-gray-500">No admins.</p>
|
||||||
|
</li>
|
||||||
|
)
|
||||||
: getAdmins.error
|
: getAdmins.error
|
||||||
? <p className="alert">Loading admins failed</p>
|
? <p className="alert">Loading admins failed</p>
|
||||||
: <div className="spinner self-center" />}
|
: <div className="spinner self-center" />}
|
||||||
|
|
|
@ -15,36 +15,43 @@ export function QueuePage() {
|
||||||
return (
|
return (
|
||||||
<FlipMove
|
<FlipMove
|
||||||
typeName={"ul"}
|
typeName={"ul"}
|
||||||
className="flex flex-col items-stretch gap-2 p-2 bg-zinc-200 dark:bg-zinc-800 rounded-xl"
|
className="flex flex-col items-stretch gap-2 p-2 bg-zinc-200 dark:bg-zinc-800 rounded-md"
|
||||||
enterAnimation="fade"
|
enterAnimation="fade"
|
||||||
leaveAnimation="fade"
|
leaveAnimation="fade"
|
||||||
>
|
>
|
||||||
{getJobs.data?.map((job) => (
|
{getJobs.data && getJobs.data.length === 0
|
||||||
<li
|
? <li key="no-jobs" className="text-center text-gray-500">Queue is empty.</li>
|
||||||
className="flex items-baseline gap-2 bg-zinc-100 dark:bg-zinc-700 px-2 py-1 rounded-xl"
|
: (
|
||||||
key={job.id.join("/")}
|
getJobs.data?.map((job) => (
|
||||||
>
|
<li
|
||||||
<span className="">
|
className="flex items-baseline gap-2 bg-zinc-100 dark:bg-zinc-700 px-2 py-1 rounded-md"
|
||||||
{job.place}.
|
key={job.id.join("/")}
|
||||||
</span>
|
>
|
||||||
<span>{getFlagEmoji(job.state.from.language_code)}</span>
|
<span className="">{job.place}.</span>
|
||||||
<strong>{job.state.from.first_name} {job.state.from.last_name}</strong>
|
<span>{getFlagEmoji(job.state.from.language_code)}</span>
|
||||||
{job.state.from.username
|
<strong>{job.state.from.first_name} {job.state.from.last_name}</strong>
|
||||||
? (
|
{job.state.from.username
|
||||||
<a className="link" href={`https://t.me/${job.state.from.username}`} target="_blank">
|
? (
|
||||||
@{job.state.from.username}
|
<a
|
||||||
</a>
|
className="link"
|
||||||
)
|
href={`https://t.me/${job.state.from.username}`}
|
||||||
: null}
|
target="_blank"
|
||||||
<span className="flex-grow self-center h-full">
|
>
|
||||||
{job.state.progress != null &&
|
@{job.state.from.username}
|
||||||
<Progress className="w-full h-full" value={job.state.progress} />}
|
</a>
|
||||||
</span>
|
)
|
||||||
<span className="text-sm text-zinc-500 dark:text-zinc-400">
|
: null}
|
||||||
{job.state.workerInstanceKey}
|
<span className="flex-grow self-center h-full">
|
||||||
</span>
|
{job.state.progress != null && (
|
||||||
</li>
|
<Progress className="w-full h-full" value={job.state.progress} />
|
||||||
))}
|
)}
|
||||||
|
</span>
|
||||||
|
<span className="text-sm text-zinc-500 dark:text-zinc-400">
|
||||||
|
{job.state.workerInstanceKey}
|
||||||
|
</span>
|
||||||
|
</li>
|
||||||
|
))
|
||||||
|
)}
|
||||||
</FlipMove>
|
</FlipMove>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -31,14 +31,18 @@ export function WorkersPage(props: { sessionId: string | null }) {
|
||||||
<>
|
<>
|
||||||
{getWorkers.data?.length
|
{getWorkers.data?.length
|
||||||
? (
|
? (
|
||||||
<ul className="my-4 flex flex-col gap-2">
|
<ul className="flex flex-col gap-2">
|
||||||
{getWorkers.data?.map((worker) => (
|
{getWorkers.data?.map((worker) => (
|
||||||
<WorkerListItem key={worker.id} worker={worker} sessionId={sessionId} />
|
<WorkerListItem key={worker.id} worker={worker} sessionId={sessionId} />
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
)
|
)
|
||||||
: getWorkers.data?.length === 0
|
: getWorkers.data?.length === 0
|
||||||
? <p>No workers</p>
|
? (
|
||||||
|
<li className="flex flex-col gap-2 rounded-md bg-zinc-100 dark:bg-zinc-800 p-2">
|
||||||
|
<p key="no-workers" className="text-center text-gray-500">No workers.</p>
|
||||||
|
</li>
|
||||||
|
)
|
||||||
: getWorkers.error
|
: getWorkers.error
|
||||||
? <p className="alert">Loading workers failed</p>
|
? <p className="alert">Loading workers failed</p>
|
||||||
: <div className="spinner self-center" />}
|
: <div className="spinner self-center" />}
|
||||||
|
|
Loading…
Reference in New Issue