UI adjustments

This commit is contained in:
Simon Gruber
2026-05-05 20:07:08 +02:00
parent bfa04936b2
commit b00cde2a6e
@@ -92,36 +92,52 @@ export default function HomeOrdersTable({
const isClosed = !!item.closed; const isClosed = !!item.closed;
const closedStr = isClosed ? " Closed" : "Open"; const closedStr = isClosed ? " Closed" : "Open";
const dateStr = const dateStr = item.created_at
item.created_at ? new Date(item.created_at).toLocaleString()
? new Date(item.created_at).toLocaleString() : "Unknown creation time";
: "Unknown creation time";
return ( return (
<Space size={16}> <Space size={16}>
<Icon path={mdiFood} size={1} style={getOrderIconStyle(isClosed)} /> <Icon
path={mdiFood}
size={1}
style={getOrderIconStyle(isClosed)}
/>
<Space direction="vertical" size={0}> <Space direction="vertical" size={0}>
<Space size={8} align="center"> <Space size={8} align="center">
<Text strong>{item.title || item.id}</Text> <Text strong>{item.title || item.id}</Text>
{item.is_owner ? <Tag color="geekblue">Owner</Tag> : null} <Space size={0} align="center">
{item.is_owner && item.has_unpaid_submissions ? ( {item.is_owner ? <Tag color="geekblue">Owner</Tag> : null}
<Tag color="volcano">Open payments</Tag> {item.is_owner && item.has_unpaid_submissions ? (
) : null} <Tag color="volcano">Open payments</Tag>
{state === "paid" ? <Tag color="green">Paid</Tag> : null} ) : null}
{state === "unpaid" ? ( {state === "paid" ? <Tag color="green">Paid</Tag> : null}
<Tag color="volcano">Unpaid</Tag> {state === "unpaid" ? (
) : null} <Tag color="volcano">Unpaid</Tag>
{state === "pending" ? <Tag color="blue">Pending</Tag> : null} ) : null}
{state === "pending" ? (
<Tag color="blue">Pending</Tag>
) : null}
</Space>
</Space> </Space>
<Text type="secondary"> <Text type="secondary">
{<Tooltip title={`Order is ${closedStr.toLocaleLowerCase()}`}>{closedStr}</Tooltip>}{" • "} {
{<Tooltip title={`Created at: ${dateStr}`}>{dateStr}</Tooltip>} <Tooltip
title={`Order is ${closedStr.toLocaleLowerCase()}`}
>
{closedStr}
</Tooltip>
}
{" • "}
{
<Tooltip title={`Created at: ${dateStr}`}>
{dateStr}
</Tooltip>
}
{item.is_participant && formatted && ( {item.is_participant && formatted && (
<> <>
{" • "} {" • "}
<Tooltip title="Your order"> <Tooltip title="Your order">{formatted}</Tooltip>
{formatted}
</Tooltip>
</> </>
)} )}
</Text> </Text>