Skip to content

Commit 05d7e5c

Browse files
Copilothotlong
Copilot
and
hotlong
authored
fix: address all PR review comments - use SchemaRenderer, semantic HTML, pluralization, remove false affordance
Agent-Logs-Url: https://github.com/objectstack-ai/objectui/sessions/f45bbfad-453a-42a8-9f55-09107853caaa Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
1 parent 6f8c952 commit 05d7e5c

File tree

2 files changed

+34
-37
lines changed

2 files changed

+34
-37
lines changed

‎apps/console/src/components/schema/ObjectDetailTabsWidget.tsx‎

Lines changed: 7 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,7 @@ import { useState } from 'react';
1717
import { Tabs, TabsList, TabsTrigger, TabsContent } from '@object-ui/components';
1818
import { Settings2, Columns, Link2, Table } from 'lucide-react';
1919
import type { SchemaNode } from '@object-ui/core';
20-
import {
21-
ObjectPropertiesWidget,
22-
ObjectRelationshipsWidget,
23-
ObjectKeysWidget,
24-
ObjectDataExperienceWidget,
25-
ObjectDataPreviewWidget,
26-
} from './objectDetailWidgets';
27-
import { ObjectFieldDesignerWidget } from './ObjectFieldDesignerWidget';
20+
import { SchemaRenderer } from '@object-ui/react';
2821

2922
/** Schema props for object detail tabs widget. */
3023
interface ObjectDetailTabsSchema extends SchemaNode {
@@ -108,27 +101,27 @@ export function ObjectDetailTabsWidget({ schema }: { schema: ObjectDetailTabsSch
108101

109102
<TabsContent value="details" className="mt-6">
110103
<div className="space-y-6">
111-
<ObjectPropertiesWidget schema={detailsSchema} />
104+
<SchemaRenderer schema={detailsSchema} />
112105
</div>
113106
</TabsContent>
114107

115108
<TabsContent value="fields" className="mt-6">
116109
<div className="space-y-6">
117-
<ObjectFieldDesignerWidget schema={fieldsSchema} />
110+
<SchemaRenderer schema={fieldsSchema} />
118111
</div>
119112
</TabsContent>
120113

121114
<TabsContent value="relationships" className="mt-6">
122115
<div className="space-y-6">
123-
<ObjectRelationshipsWidget schema={relationshipsSchema} />
124-
<ObjectKeysWidget schema={keysSchema} />
116+
<SchemaRenderer schema={relationshipsSchema} />
117+
<SchemaRenderer schema={keysSchema} />
125118
</div>
126119
</TabsContent>
127120

128121
<TabsContent value="data" className="mt-6">
129122
<div className="space-y-6">
130-
<ObjectDataPreviewWidget schema={dataPreviewSchema} />
131-
<ObjectDataExperienceWidget schema={dataExperienceSchema} />
123+
<SchemaRenderer schema={dataPreviewSchema} />
124+
<SchemaRenderer schema={dataExperienceSchema} />
132125
</div>
133126
</TabsContent>
134127
</Tabs>

‎apps/console/src/components/schema/objectDetailWidgets.tsx‎

Lines changed: 27 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -80,57 +80,61 @@ export function ObjectPropertiesWidget({ schema }: { schema: ObjectWidgetSchema
8080
<h3 className="text-sm font-semibold text-muted-foreground uppercase tracking-wide mb-3">
8181
Basic Information
8282
</h3>
83-
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
83+
<dl className="grid grid-cols-1 sm:grid-cols-2 gap-4">
8484
<div className="space-y-1.5">
85-
<label className="text-xs font-medium text-muted-foreground">Display Name</label>
86-
<p className="text-sm font-medium">{object.label}</p>
85+
<dt className="text-xs font-medium text-muted-foreground">Display Name</dt>
86+
<dd className="text-sm font-medium">{object.label}</dd>
8787
</div>
8888
<div className="space-y-1.5">
89-
<label className="text-xs font-medium text-muted-foreground">API Name</label>
90-
<p className="text-sm font-mono bg-muted/50 rounded px-2 py-1">{object.name}</p>
89+
<dt className="text-xs font-medium text-muted-foreground">API Name</dt>
90+
<dd className="text-sm font-mono bg-muted/50 rounded px-2 py-1">{object.name}</dd>
9191
</div>
9292
{object.pluralLabel && (
9393
<div className="space-y-1.5">
94-
<label className="text-xs font-medium text-muted-foreground">Plural Label</label>
95-
<p className="text-sm font-medium">{object.pluralLabel}</p>
94+
<dt className="text-xs font-medium text-muted-foreground">Plural Label</dt>
95+
<dd className="text-sm font-medium">{object.pluralLabel}</dd>
9696
</div>
9797
)}
9898
{object.group && (
9999
<div className="space-y-1.5">
100-
<label className="text-xs font-medium text-muted-foreground">Group</label>
101-
<p className="text-sm font-medium">{object.group}</p>
100+
<dt className="text-xs font-medium text-muted-foreground">Group</dt>
101+
<dd className="text-sm font-medium">{object.group}</dd>
102102
</div>
103103
)}
104-
</div>
104+
</dl>
105105
</div>
106106

107107
{/* Configuration Section */}
108108
<div>
109109
<h3 className="text-sm font-semibold text-muted-foreground uppercase tracking-wide mb-3">
110110
Configuration
111111
</h3>
112-
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
112+
<dl className="grid grid-cols-1 sm:grid-cols-3 gap-4">
113113
<div className="space-y-1.5">
114-
<label className="text-xs font-medium text-muted-foreground">Status</label>
115-
<div>
114+
<dt className="text-xs font-medium text-muted-foreground">Status</dt>
115+
<dd>
116116
<Badge variant={object.enabled !== false ? 'default' : 'secondary'} className="font-normal">
117117
{object.enabled !== false ? 'Enabled' : 'Disabled'}
118118
</Badge>
119-
</div>
119+
</dd>
120120
</div>
121121
<div className="space-y-1.5">
122-
<label className="text-xs font-medium text-muted-foreground">Field Count</label>
123-
<p className="text-sm font-medium">{object.fieldCount ?? fields.length} fields</p>
122+
<dt className="text-xs font-medium text-muted-foreground">Field Count</dt>
123+
<dd className="text-sm font-medium">
124+
{(object.fieldCount ?? fields.length) === 1
125+
? '1 field'
126+
: `${object.fieldCount ?? fields.length} fields`}
127+
</dd>
124128
</div>
125129
{object.isSystem && (
126130
<div className="space-y-1.5">
127-
<label className="text-xs font-medium text-muted-foreground">Type</label>
128-
<div>
131+
<dt className="text-xs font-medium text-muted-foreground">Type</dt>
132+
<dd>
129133
<Badge variant="secondary" className="font-normal">System Object</Badge>
130-
</div>
134+
</dd>
131135
</div>
132136
)}
133-
</div>
137+
</dl>
134138
</div>
135139
</div>
136140
);
@@ -261,17 +265,17 @@ export function ObjectDataExperienceWidget(_props: { schema: ObjectWidgetSchema
261265
Configure how users interact with data in this object
262266
</p>
263267
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4">
264-
<div className="rounded-lg border p-6 text-center hover:bg-accent/50 transition-colors cursor-pointer" data-testid="data-experience-forms">
268+
<div className="rounded-lg border p-6 text-center" data-testid="data-experience-forms">
265269
<PanelTop className="h-8 w-8 mx-auto mb-3 text-muted-foreground" />
266270
<p className="text-sm font-semibold mb-1">Forms</p>
267271
<p className="text-xs text-muted-foreground">Design forms for data entry</p>
268272
</div>
269-
<div className="rounded-lg border p-6 text-center hover:bg-accent/50 transition-colors cursor-pointer" data-testid="data-experience-views">
273+
<div className="rounded-lg border p-6 text-center" data-testid="data-experience-views">
270274
<LayoutList className="h-8 w-8 mx-auto mb-3 text-muted-foreground" />
271275
<p className="text-sm font-semibold mb-1">Views</p>
272276
<p className="text-xs text-muted-foreground">Configure list and detail views</p>
273277
</div>
274-
<div className="rounded-lg border p-6 text-center hover:bg-accent/50 transition-colors cursor-pointer" data-testid="data-experience-dashboards">
278+
<div className="rounded-lg border p-6 text-center" data-testid="data-experience-dashboards">
275279
<BarChart3 className="h-8 w-8 mx-auto mb-3 text-muted-foreground" />
276280
<p className="text-sm font-semibold mb-1">Dashboards</p>
277281
<p className="text-xs text-muted-foreground">Build visual dashboards</p>

0 commit comments

Comments
 (0)