perf: url display in webhook dialog

This commit is contained in:
Junyan Qin
2025-11-20 16:48:06 +08:00
parent dbc09f46f4
commit 763c1a885c
@@ -289,12 +289,16 @@ export default function ApiIntegrationDialog({
{t('common.noApiKeys')} {t('common.noApiKeys')}
</div> </div>
) : ( ) : (
<div className="border rounded-md"> <div className="border rounded-md overflow-x-auto">
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHead>{t('common.name')}</TableHead> <TableHead className="min-w-[120px]">
<TableHead>{t('common.apiKeyValue')}</TableHead> {t('common.name')}
</TableHead>
<TableHead className="min-w-[200px]">
{t('common.apiKeyValue')}
</TableHead>
<TableHead className="w-[100px]"> <TableHead className="w-[100px]">
{t('common.actions')} {t('common.actions')}
</TableHead> </TableHead>
@@ -372,16 +376,20 @@ export default function ApiIntegrationDialog({
{t('common.noWebhooks')} {t('common.noWebhooks')}
</div> </div>
) : ( ) : (
<div className="border rounded-md"> <div className="border rounded-md overflow-x-auto max-w-full">
<Table> <Table className="table-fixed w-full">
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHead>{t('common.name')}</TableHead> <TableHead className="w-[150px]">
<TableHead>{t('common.webhookUrl')}</TableHead> {t('common.name')}
</TableHead>
<TableHead className="w-[380px]">
{t('common.webhookUrl')}
</TableHead>
<TableHead className="w-[80px]"> <TableHead className="w-[80px]">
{t('common.webhookEnabled')} {t('common.webhookEnabled')}
</TableHead> </TableHead>
<TableHead className="w-[100px]"> <TableHead className="w-[80px]">
{t('common.actions')} {t('common.actions')}
</TableHead> </TableHead>
</TableRow> </TableRow>
@@ -389,20 +397,30 @@ export default function ApiIntegrationDialog({
<TableBody> <TableBody>
{webhooks.map((webhook) => ( {webhooks.map((webhook) => (
<TableRow key={webhook.id}> <TableRow key={webhook.id}>
<TableCell> <TableCell className="truncate">
<div> <div className="truncate">
<div className="font-medium">{webhook.name}</div> <div
className="font-medium truncate"
title={webhook.name}
>
{webhook.name}
</div>
{webhook.description && ( {webhook.description && (
<div className="text-sm text-muted-foreground"> <div
className="text-sm text-muted-foreground truncate"
title={webhook.description}
>
{webhook.description} {webhook.description}
</div> </div>
)} )}
</div> </div>
</TableCell> </TableCell>
<TableCell> <TableCell>
<code className="text-sm bg-muted px-2 py-1 rounded break-all"> <div className="overflow-x-auto max-w-[380px]">
{webhook.url} <code className="text-sm bg-muted px-2 py-1 rounded whitespace-nowrap inline-block">
</code> {webhook.url}
</code>
</div>
</TableCell> </TableCell>
<TableCell> <TableCell>
<Switch <Switch