Use a smaller spinner on rail session rows
This commit is contained in:
@@ -16,13 +16,22 @@ type Props = {
|
|||||||
* bot's name, its title and how recent. The active one says so; any other
|
* bot's name, its title and how recent. The active one says so; any other
|
||||||
* reopens on click.
|
* reopens on click.
|
||||||
*/
|
*/
|
||||||
export default function RailBotSessionRow({ session, loading, disabled, onOpen }: Props) {
|
export default function RailBotSessionRow({
|
||||||
|
session,
|
||||||
|
loading,
|
||||||
|
disabled,
|
||||||
|
onOpen,
|
||||||
|
}: Props) {
|
||||||
const active = session.status == "active";
|
const active = session.status == "active";
|
||||||
const at = session.last_activity_at || session.created_at;
|
const at = session.last_activity_at || session.created_at;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
title={active ? "This is the current session" : `Reopen "${session.title || "Untitled"}"`}
|
title={
|
||||||
|
active
|
||||||
|
? "This is the current session"
|
||||||
|
: `Reopen "${session.title || "Untitled"}"`
|
||||||
|
}
|
||||||
type="button"
|
type="button"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
color="text"
|
color="text"
|
||||||
@@ -32,8 +41,12 @@ export default function RailBotSessionRow({ session, loading, disabled, onOpen }
|
|||||||
buttonContentProps={{ className: "w-full min-w-0 flex-nowrap" }}
|
buttonContentProps={{ className: "w-full min-w-0 flex-nowrap" }}
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
"w-full h-8 shrink-0 justify-start! items-center! gap-2! rounded-default px-2! @rail:pl-14! text-left text-ink dark:text-ink hover:bg-ink/5 hover:dark:bg-ink/5 focus-visible:ring-2 focus-visible:ring-ink",
|
"w-full h-8 shrink-0 justify-start! items-center! gap-2! rounded-default px-2! @rail:pl-14! text-left text-ink dark:text-ink hover:bg-ink/5 hover:dark:bg-ink/5 focus-visible:ring-2 focus-visible:ring-ink",
|
||||||
active && "bg-transparent hover:bg-transparent hover:dark:bg-transparent opacity-100!",
|
active &&
|
||||||
|
"bg-transparent hover:bg-transparent hover:dark:bg-transparent opacity-100!",
|
||||||
)}
|
)}
|
||||||
|
loadingProps={{
|
||||||
|
size: "smaller",
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<Span
|
<Span
|
||||||
className={twMerge(
|
className={twMerge(
|
||||||
@@ -44,10 +57,16 @@ export default function RailBotSessionRow({ session, loading, disabled, onOpen }
|
|||||||
{session.title || "Untitled session"}
|
{session.title || "Untitled session"}
|
||||||
</Span>
|
</Span>
|
||||||
{session.unread && !active ? (
|
{session.unread && !active ? (
|
||||||
<Span className="shrink-0 text-[11px] font-bold leading-4 text-ink">New</Span>
|
<Span className="shrink-0 text-[11px] font-bold leading-4 text-ink">
|
||||||
|
New
|
||||||
|
</Span>
|
||||||
) : null}
|
) : null}
|
||||||
<Span className="shrink-0 text-[11px] leading-4 text-ink-secondary">
|
<Span className="shrink-0 text-[11px] leading-4 text-ink-secondary">
|
||||||
{active ? "Current" : at ? relativeTime({ at: Number(at) }) : ""}
|
{active
|
||||||
|
? "Current"
|
||||||
|
: at
|
||||||
|
? relativeTime({ at: Number(at) })
|
||||||
|
: ""}
|
||||||
</Span>
|
</Span>
|
||||||
</Button>
|
</Button>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user