Skip to content

Commit 2a3ffa5

Browse files
MildTomatoMildTomato
committed
moar fixes
1 parent b97cd81 commit 2a3ffa5

File tree

10 files changed

+143
-79
lines changed

10 files changed

+143
-79
lines changed

‎apps/postgres-new/components/chat-message.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ function ChatMessage({ message, isLast }: ChatMessageProps) {
3939
x: 0,
4040
},
4141
}}
42-
className="self-end px-5 py-2.5 text-base rounded-3xl bg-foreground text-background whitespace-pre-wrap"
42+
className="self-end px-5 py-2.5 text-base rounded-3xl bg-border text-foreground whitespace-pre-wrap"
4343
>
4444
{message.content}
4545
</m.div>

‎apps/postgres-new/components/code-accordion.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export default function CodeAccordion({
2828
<AccordionItem
2929
value="item-1"
3030
className={cn(
31-
'border bg-card px-3 py-2 rounded-md',
31+
'border bg-muted px-3 py-2 rounded-md',
3232
error ? 'bg-destructive text-destructive-foreground' : undefined,
3333
className
3434
)}
@@ -47,7 +47,7 @@ export default function CodeAccordion({
4747
>
4848
{code}
4949
</CodeBlock>
50-
{error && <div className="text-destructive-600 text-xs">{error}</div>}
50+
{error && <div className="text-destructive text-xs">{error}</div>}
5151
</AccordionContent>
5252
</AccordionItem>
5353
</Accordion>

‎apps/postgres-new/components/ide.tsx

Lines changed: 40 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { cn } from '~/lib/utils'
1616
import { useApp } from './app-provider'
1717
import SchemaGraph from './schema/graph'
1818
import { useWorkspace } from './workspace'
19+
import { buttonVariants } from './ui/button'
1920

2021
const initialMigrationSql = '-- Migrations will appear here as you chat with AI\n'
2122
const initialSeedSql = '-- Seeds will appear here as you chat with AI\n'
@@ -105,28 +106,56 @@ export default function IDE({ children, className }: IDEProps) {
105106
value={tab}
106107
onValueChange={(tab) => setTab(tabsSchema.parse(tab))}
107108
>
108-
<TabsList className="grid w-full grid-cols-3 lg:grid-cols-2">
109+
<TabsList className="grid w-full grid-cols-3 lg:grid-cols-2 !h-min bg-muted">
109110
{isSmallBreakpoint && (
110-
<TabsTrigger value="chat" className="flex items-center gap-1">
111+
<TabsTrigger
112+
value="chat"
113+
className={cn(
114+
buttonVariants({ variant: tab === 'chat' ? 'default' : 'ghost' }),
115+
tab === 'chat' && '!shadow-sm',
116+
'gap-2'
117+
)}
118+
>
111119
<MessageSquareMore size={14} />
112-
<span className="hidden xs:inline">Chat</span>
120+
<span className="hidden sm:inline">Chat</span>
113121
</TabsTrigger>
114122
)}
115-
<TabsTrigger value="diagram" className="flex items-center gap-1">
123+
<TabsTrigger
124+
value="diagram"
125+
className={cn(
126+
buttonVariants({ variant: tab === 'diagram' ? 'default' : 'ghost' }),
127+
tab === 'diagram' && '!shadow-sm',
128+
'gap-2'
129+
)}
130+
>
116131
<Workflow size={14} />
117-
<span className="hidden xs:inline">Diagram</span>
132+
<span className="hidden sm:inline">Diagram</span>
118133
</TabsTrigger>
119-
<TabsTrigger value="migrations" className="flex items-center gap-1">
134+
<TabsTrigger
135+
value="migrations"
136+
className={cn(
137+
buttonVariants({ variant: tab === 'migrations' ? 'default' : 'ghost' }),
138+
tab === 'migrations' && '!shadow-sm',
139+
'gap-2'
140+
)}
141+
>
120142
<FileCode size={14} />
121-
<span className="hidden xs:inline">Migrations</span>
143+
<span className="hidden sm:inline">Migrations</span>
122144
</TabsTrigger>
123145
{/* Temporarily hide seeds until we get pg_dump working */}
124-
{false && (
125-
<TabsTrigger value="seeds" className="flex items-center gap-1">
146+
{/* {false && (
147+
<TabsTrigger
148+
value="seeds"
149+
className={cn(
150+
buttonVariants({ variant: tab === 'seeds' ? 'default' : 'ghost' }),
151+
tab === 'seeds' && '!shadow-sm',
152+
'gap-2'
153+
)}
154+
>
126155
<Sprout size={14} />
127-
<span className="hidden xs:inline">Seeds</span>
156+
<span className="hidden sm:inline">Seeds</span>
128157
</TabsTrigger>
129-
)}
158+
)} */}
130159
</TabsList>
131160

132161
{isSmallBreakpoint && (

‎apps/postgres-new/components/schema/legend.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { DiamondIcon, Fingerprint, Hash, Key } from 'lucide-react'
22

33
const SchemaGraphLegend = () => {
44
return (
5-
<div className="border-t flex justify-center p-5 shadow-md bg-surface-100 text-xs md:text-[0.625rem]">
5+
<div className="border-t flex justify-center px-3 h-10 shadow-md bg-muted/50 text-xs md:text-[0.625rem] text-muted-foreground">
66
<ul className="flex flex-wrap items-center justify-center gap-4">
77
<li className="flex items-center font-mono gap-1">
88
<Key size={15} strokeWidth={1.5} className="flex-shrink-0 text-light" />

‎apps/postgres-new/components/schema/table-graph.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -131,24 +131,27 @@ export default function TablesGraph({
131131
)}
132132

133133
{isEmpty && (
134-
<h2 className="text-4xl text-lighter font-light">Ask AI to create a table</h2>
134+
<h2 className="text-4xl text-lighter font-light w-[500px]">Ask AI to create a table</h2>
135135
)}
136136
</div>
137137

138138
<Controls showZoom={false} showInteractive={false} position="top-right" />
139139

140140
<div className="absolute bottom-0 left-0 right-0 z-10 flex flex-col"></div>
141141
</ReactFlow>
142-
<div className="p-2.5 flex justify-center bg-white/20 text-xs text-neutral-200">
142+
<div className="p-2.5 flex justify-center bg-muted text-xs text-muted-foreground border-t">
143143
{visibility === 'local' && (
144144
<Tooltip>
145-
<TooltipTrigger asChild>
146-
<div className="flex gap-1 items-center cursor-default">
145+
<TooltipTrigger className="group flex gap-1 items-center cursor-default">
146+
<span className="group-data-[state=delayed-open]:text-foreground transition">
147147
Local-only database
148-
<Info size={12} />
149-
</div>
148+
</span>
149+
<Info
150+
size={12}
151+
className="group-data-[state=delayed-open]:text-foreground transition"
152+
/>
150153
</TooltipTrigger>
151-
<TooltipContent className="bg-white text-black">
154+
<TooltipContent>
152155
<p className="max-w-[28rem] text-center">
153156
This Postgres database lives directly in your browser&apos;s IndexedDB storage and
154157
not in the cloud, so it is only accessible to you.

‎apps/postgres-new/components/schema/table-node.tsx

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ export function TableNode({ id, data, targetPosition, sourcePosition }: NodeProp
119119
itemHeight
120120
)}
121121
>
122-
<Table2 strokeWidth={1.3} size={21} className="text-muted-foreground" />
122+
<Table2 strokeWidth={1.3} size={21} className="text-secondary-foreground" />
123123

124124
{/* Animate the old title out and new title in */}
125125
<AnimatePresence mode="popLayout">
@@ -228,7 +228,11 @@ function TableColumn({
228228
animate="show"
229229
exit="hidden"
230230
>
231-
<Key size={16} strokeWidth={2} className={cn('flex-shrink-0', 'text-light')} />
231+
<Key
232+
size={16}
233+
strokeWidth={2}
234+
className={cn('flex-shrink-0', 'text-muted-foreground')}
235+
/>
232236
</m.div>
233237
)}
234238
</AnimatePresence>
@@ -243,7 +247,11 @@ function TableColumn({
243247
animate="show"
244248
exit="hidden"
245249
>
246-
<DiamondIcon size={16} strokeWidth={2} className="flex-shrink-0 text-light" />
250+
<DiamondIcon
251+
size={16}
252+
strokeWidth={2}
253+
className="flex-shrink-0 text-muted-foreground"
254+
/>
247255
</m.div>
248256
) : (
249257
<m.div
@@ -257,7 +265,7 @@ function TableColumn({
257265
size={16}
258266
strokeWidth={2}
259267
fill="currentColor"
260-
className="flex-shrink-0 text-light"
268+
className="flex-shrink-0 text-muted-foreground"
261269
/>
262270
</m.div>
263271
)}
@@ -273,7 +281,11 @@ function TableColumn({
273281
animate="show"
274282
exit="hidden"
275283
>
276-
<Fingerprint size={16} strokeWidth={2} className="flex-shrink-0 text-light" />
284+
<Fingerprint
285+
size={16}
286+
strokeWidth={2}
287+
className="flex-shrink-0 text-muted-foreground"
288+
/>
277289
</m.div>
278290
)}
279291
</AnimatePresence>
@@ -288,7 +300,7 @@ function TableColumn({
288300
animate="show"
289301
exit="hidden"
290302
>
291-
<Hash size={16} strokeWidth={2} className="flex-shrink-0 text-light" />
303+
<Hash size={16} strokeWidth={2} className="flex-shrink-0 text-muted-foreground" />
292304
</m.div>
293305
)}
294306
</AnimatePresence>
@@ -313,7 +325,7 @@ function TableColumn({
313325
<AnimatePresence mode="popLayout">
314326
<m.span
315327
key={column.format}
316-
className="px-4 inline-flex justify-end font-mono text-lighter text-[0.8rem]"
328+
className="px-4 inline-flex justify-end font-mono text-muted-foreground text-[0.8rem]"
317329
variants={inOutTop}
318330
initial="hidden"
319331
animate="show"
@@ -346,7 +358,7 @@ function TableColumn({
346358
<DropdownMenuContent
347359
side="right"
348360
align="start"
349-
className="w-[300px]"
361+
// className="w-content"
350362
onEscapeKeyDown={(e) => {
351363
if (isRenaming) {
352364
e.preventDefault()

0 commit comments

Comments
 (0)