feat(connections): move close connection button next to search input

This commit is contained in:
kunish 2023-09-03 22:15:15 +08:00
parent aff1fc56a2
commit 4b8175d718
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430

View File

@ -111,16 +111,7 @@ export default () => {
{ {
accessorKey: CONNECTIONS_TABLE_ACCESSOR_KEY.Close, accessorKey: CONNECTIONS_TABLE_ACCESSOR_KEY.Close,
enableSorting: false, enableSorting: false,
header: () => ( header: () => t('close'),
<div class="flex h-full items-center">
<Button
class="btn-circle btn-xs"
onClick={() => request.delete('connections')}
>
<IconCircleX size="18" />
</Button>
</div>
),
cell: ({ row }) => ( cell: ({ row }) => (
<div class="flex h-full items-center"> <div class="flex h-full items-center">
<Button <Button
@ -238,13 +229,20 @@ export default () => {
return ( return (
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="flex w-full"> <div class="flex w-full items-center gap-2">
<input <input
class="input input-primary mr-4 w-40 flex-1" class="input input-primary flex-1"
placeholder={t('search')} placeholder={t('search')}
onInput={(e) => setSearch(e.target.value)} onInput={(e) => setSearch(e.target.value)}
/> />
<Button
class="btn-circle"
onClick={() => request.delete('connections')}
>
<IconCircleX />
</Button>
<label for="connection-modal" class="btn btn-circle"> <label for="connection-modal" class="btn btn-circle">
<IconSettings /> <IconSettings />
</label> </label>
@ -272,7 +270,7 @@ export default () => {
<th class="bg-base-300"> <th class="bg-base-300">
<div <div
class={twMerge( class={twMerge(
'flex items-center justify-between', 'flex items-center justify-between gap-2',
header.column.getCanSort() && header.column.getCanSort() &&
'cursor-pointer select-none', 'cursor-pointer select-none',
)} )}