Skip to content
This repository was archived by the owner on Jan 24, 2025. It is now read-only.

Commit 0640885

Browse files
committed
style
1 parent 3a857bd commit 0640885

File tree

7 files changed

+39
-38
lines changed

7 files changed

+39
-38
lines changed

packages/react-databrowser/src/components/databrowser/components/add-key-modal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ export function AddKeyModal() {
124124
>
125125
Cancel
126126
</Button>
127-
<Button variant={"primary"} type="submit">
127+
<Button variant="primary" type="submit">
128128
<Spinner isLoading={isPending} isLoadingText={"Creating"}>
129129
Create
130130
</Spinner>

packages/react-databrowser/src/components/databrowser/components/display/display-header.tsx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { TTLPopover } from "./ttl-popover"
2020
export const DisplayHeader = ({
2121
dataKey,
2222
type,
23-
hideBadges,
23+
// hideBadges,
2424
content,
2525
}: {
2626
content?: string
@@ -59,15 +59,15 @@ export const DisplayHeader = ({
5959
</div>
6060
</div>
6161

62-
{!hideBadges && (
63-
<div className="flex h-10 flex-wrap items-center gap-1">
64-
<TypeTag variant={type} type="badge" />
65-
<SizeBadge dataKey={dataKey} />
66-
<LengthBadge dataKey={dataKey} type={type} content={content} />
67-
{length && <Badge label="Length:">{size}</Badge>}
68-
<TTLBadge dataKey={dataKey} />
69-
</div>
70-
)}
62+
{/*{!hideBadges && (*/}
63+
<div className="flex h-10 flex-wrap items-center gap-1">
64+
<TypeTag variant={type} type="badge" />
65+
<SizeBadge dataKey={dataKey} />
66+
<LengthBadge dataKey={dataKey} type={type} content={content} />
67+
{length && <Badge label="Length:">{size}</Badge>}
68+
<TTLBadge dataKey={dataKey} />
69+
</div>
70+
{/*)}*/}
7171
</div>
7272
)
7373
}

packages/react-databrowser/src/components/databrowser/components/display/display-list-edit.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,27 +67,26 @@ const ListEditForm = ({
6767
<form onSubmit={onSubmit} className="flex flex-col gap-2">
6868
<div className="flex grow flex-col gap-2">
6969
{type !== "list" && <FormItem name="key" label={keyLabel} />}
70+
7071
{type === "zset" ? (
7172
<NumberFormItem name="value" label={valueLabel} />
7273
) : (
7374
type !== "set" && <FormItem name="value" label={valueLabel} />
7475
)}
7576
</div>
7677

77-
<div className="flex justify-end gap-1">
78+
<div className="flex justify-end gap-2">
7879
<Button
79-
type="button"
8080
onClick={() => {
8181
setSelectedListItem(undefined)
8282
}}
83-
className="h-6 rounded-md border bg-white px-3 font-normal text-zinc-700 hover:bg-zinc-100"
8483
>
8584
Cancel
8685
</Button>
8786
<SimpleTooltip content={type === "stream" ? "Streams are not mutable" : undefined}>
8887
<Button
88+
variant="primary"
8989
type="submit"
90-
className="h-6 rounded-md bg-emerald-500 px-3 font-normal text-white hover:bg-emerald-600 disabled:opacity-50"
9190
disabled={!form.formState.isValid || !form.formState.isDirty || type === "stream"}
9291
>
9392
<Spinner isLoading={isPending} isLoadingText={"Saving"}>

packages/react-databrowser/src/components/databrowser/components/display/display-simple.tsx

Lines changed: 6 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { useEffect } from "react"
22
import type { SimpleDataType } from "@/types"
33
import { useForm } from "react-hook-form"
44

5-
import { cn } from "@/lib/utils"
65
import { Button } from "@/components/ui/button"
76
import { Spinner } from "@/components/ui/spinner"
87

@@ -17,6 +16,7 @@ export const EditorDisplay = ({ dataKey, type }: { dataKey: string; type: Simple
1716
return (
1817
<div className="flex h-full w-full flex-col gap-2 overflow-y-scroll">
1918
<DisplayHeader dataKey={dataKey} type={type} content={data ?? undefined} />
19+
2020
{data === undefined ? (
2121
<div className="flex h-full items-center justify-center">
2222
<Spinner isLoadingText={""} isLoading={true} />
@@ -63,25 +63,17 @@ const EditorDisplayForm = ({
6363
return (
6464
<>
6565
<div className="grow rounded-md border border-zinc-300 bg-white p-1">{editor}</div>
66-
<div className="flex flex-shrink-0 justify-between px-3 pb-2 pt-1">
66+
67+
<div className="flex shrink-0 items-center justify-between gap-2 px-3 pb-2 pt-1">
6768
{type === "json" ? <div /> : selector}
6869

69-
<div className="flex gap-1">
70-
{form.formState.isDirty && (
71-
<Button
72-
onClick={handleCancel}
73-
className="h-6 rounded-md border bg-white px-3 font-normal text-zinc-700 hover:bg-zinc-100"
74-
>
75-
Cancel
76-
</Button>
77-
)}
70+
<div className="flex gap-2">
71+
{form.formState.isDirty && <Button onClick={handleCancel}>Cancel</Button>}
7872
<Button
7973
onClick={form.handleSubmit(async ({ value }) => {
8074
await setKey(value)
8175
})}
82-
className={cn(
83-
"h-6 rounded-md bg-emerald-500 px-3 font-normal text-white hover:bg-emerald-600 disabled:opacity-50"
84-
)}
76+
variant="primary"
8577
disabled={!form.formState.isValid || !form.formState.isDirty}
8678
>
8779
<Spinner isLoading={isSettingKey} isLoadingText={"Saving"}>

packages/react-databrowser/src/components/databrowser/components/display/input/content-type-select.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export const ContentTypeSelect = ({
2727

2828
return (
2929
<Select value={value} onValueChange={onChange}>
30-
<SelectTrigger className="h-6 w-auto border-none bg-transparent pl-0 pr-7 text-xs text-zinc-500">
30+
<SelectTrigger className="h-6 w-auto border-none bg-transparent pl-0 pr-6 text-xs text-zinc-500">
3131
<SelectValue placeholder="Expires" />
3232
</SelectTrigger>
3333
<SelectContent>

packages/react-databrowser/src/components/databrowser/components/display/ttl-popover.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -135,10 +135,10 @@ export function TTLPopover({
135135
Persist
136136
</Button>
137137
<div className="flex gap-2">
138-
<Button size={"sm"} variant={"outline"} onClick={() => setOpen(false)} type="button">
138+
<Button variant="outline" onClick={() => setOpen(false)} type="button">
139139
Cancel
140140
</Button>
141-
<Button size={"sm"} variant={"primary"} type="submit">
141+
<Button variant="primary" type="submit">
142142
<Spinner isLoading={isPending} isLoadingText="Saving">
143143
Save
144144
</Spinner>

packages/react-databrowser/src/components/ui/button.tsx

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,30 @@ import { cva, type VariantProps } from "class-variance-authority"
55
import { cn } from "@/lib/utils"
66

77
const buttonVariants = cva(
8-
"inline-flex items-center justify-center rounded-md text-sm ring-offset-white transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 dark:ring-offset-zinc-950 dark:focus-visible:ring-zinc-300",
8+
"inline-flex items-center justify-center rounded-md text-sm " +
9+
"ring-offset-white transition-colors " +
10+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 " +
11+
"disabled:pointer-events-none disabled:opacity-50 " +
12+
"dark:ring-offset-zinc-950 dark:focus-visible:ring-zinc-300",
913
{
1014
variants: {
1115
variant: {
1216
default:
13-
"bg-white text-black border shadow-sm border-zinc-300 hover:bg-[#FFFFFF]/70 dark:bg-black" +
17+
"bg-white text-black border shadow-sm border-zinc-300 " +
18+
"hover:bg-[#FFFFFF]/70 dark:bg-black" +
1419
" dark:text-[#FFFFFF]" +
1520
" dark:hover:bg-black/10",
1621
destructive:
17-
"bg-red-500 text-zinc-50 hover:bg-red-500/90 dark:bg-red-900 dark:text-zinc-50 dark:hover:bg-red-900/90",
22+
"bg-red-500 text-zinc-50 hover:bg-red-500/90 " +
23+
"dark:bg-red-900 dark:text-zinc-50 dark:hover:bg-red-900/90",
1824
outline:
19-
"border border-zinc-200 bg-white hover:bg-zinc-100 hover:text-zinc-900 dark:border-zinc-800 dark:bg-zinc-950 dark:hover:bg-zinc-800 dark:hover:text-neutral-50",
25+
"border border-zinc-200 bg-white " +
26+
"hover:bg-zinc-100 hover:text-zinc-900 " +
27+
"dark:border-zinc-800 dark:bg-zinc-950 " +
28+
"dark:hover:bg-zinc-800 dark:hover:text-neutral-50",
2029
primary:
21-
"bg-emerald-500 text-white shadow-sm hover:bg-emerald-600 dark:bg-emerald-500 dark:text-white" +
30+
"bg-emerald-500 text-white shadow-sm " +
31+
"hover:bg-emerald-600 dark:bg-emerald-500 dark:text-white" +
2232
" dark:hover:bg-emerald-600",
2333
secondary:
2434
"bg-neutral-100 text-neutral-900 hover:bg-neutral-100/80 dark:bg-neutral-800 dark:text-neutral-50 dark:hover:bg-neutral-800/80",
@@ -36,7 +46,7 @@ const buttonVariants = cva(
3646
},
3747
defaultVariants: {
3848
variant: "default",
39-
size: "default",
49+
size: "sm",
4050
},
4151
}
4252
)

0 commit comments

Comments
 (0)