better list
This commit is contained in:
parent
44e90059b3
commit
a4f92b2da8
@ -457,8 +457,7 @@ export default function StudioPage() {
|
|||||||
<div className="hidden md:flex items-center px-4 py-3 bg-muted/50 rounded-lg text-sm font-semibold text-muted-foreground border border-border/50">
|
<div className="hidden md:flex items-center px-4 py-3 bg-muted/50 rounded-lg text-sm font-semibold text-muted-foreground border border-border/50">
|
||||||
<div className="flex-1 min-w-0">{t('promptName')}</div>
|
<div className="flex-1 min-w-0">{t('promptName')}</div>
|
||||||
<div className="w-28 text-center hidden lg:block">{t('updatedAt')}</div>
|
<div className="w-28 text-center hidden lg:block">{t('updatedAt')}</div>
|
||||||
<div className="w-24 text-center hidden xl:block">{t('lastUsed')}</div>
|
<div className="w-32 text-center">{t('tags')}</div>
|
||||||
<div className="w-16 text-center">{t('tags')}</div>
|
|
||||||
<div className="w-20 text-center">Actions</div>
|
<div className="w-20 text-center">Actions</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -477,11 +476,6 @@ export default function StudioPage() {
|
|||||||
{prompt.name}
|
{prompt.name}
|
||||||
</span>
|
</span>
|
||||||
</h3>
|
</h3>
|
||||||
<div className="flex items-center space-x-1 md:hidden">
|
|
||||||
<span className="text-xs text-muted-foreground bg-muted px-2 py-1 rounded-full">
|
|
||||||
{prompt.tags?.length || 0} tags
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<p className="text-xs text-muted-foreground line-clamp-2 leading-relaxed mb-2">
|
<p className="text-xs text-muted-foreground line-clamp-2 leading-relaxed mb-2">
|
||||||
{prompt.description || 'No description available'}
|
{prompt.description || 'No description available'}
|
||||||
@ -489,12 +483,7 @@ export default function StudioPage() {
|
|||||||
|
|
||||||
{/* Mobile metadata */}
|
{/* Mobile metadata */}
|
||||||
<div className="flex items-center justify-between text-xs text-muted-foreground md:hidden">
|
<div className="flex items-center justify-between text-xs text-muted-foreground md:hidden">
|
||||||
<div className="flex items-center space-x-3">
|
<span>Updated {formatDate(prompt.updatedAt)}</span>
|
||||||
<span>Updated {formatDate(prompt.updatedAt)}</span>
|
|
||||||
{prompt.lastUsed && (
|
|
||||||
<span>Used {formatDate(prompt.lastUsed)}</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
{prompt.currentVersion && (
|
{prompt.currentVersion && (
|
||||||
<span className="bg-muted px-2 py-1 rounded text-xs font-medium">
|
<span className="bg-muted px-2 py-1 rounded text-xs font-medium">
|
||||||
v{prompt.currentVersion}
|
v{prompt.currentVersion}
|
||||||
@ -504,24 +493,27 @@ export default function StudioPage() {
|
|||||||
|
|
||||||
{/* Mobile tags */}
|
{/* Mobile tags */}
|
||||||
<div className="flex flex-wrap gap-1 mt-2 md:hidden">
|
<div className="flex flex-wrap gap-1 mt-2 md:hidden">
|
||||||
{prompt.tags?.slice(0, 3).map((tag: string | { name: string }) => {
|
{prompt.tags?.slice(0, 4).map((tag: string | { name: string }) => {
|
||||||
const tagName = typeof tag === 'string' ? tag : tag?.name || '';
|
const tagName = typeof tag === 'string' ? tag : tag?.name || '';
|
||||||
const displayTag = tagName.length > 15 ? tagName.slice(0, 15) + '...' : tagName;
|
const displayTag = tagName.length > 12 ? tagName.slice(0, 12) + '...' : tagName;
|
||||||
return (
|
return (
|
||||||
<span
|
<span
|
||||||
key={tagName}
|
key={tagName}
|
||||||
className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-primary/5 text-primary/80 rounded-full border border-primary/10"
|
className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-primary/10 text-primary rounded-full border border-primary/20"
|
||||||
title={tagName}
|
title={tagName}
|
||||||
>
|
>
|
||||||
{displayTag}
|
{displayTag}
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
{prompt.tags && prompt.tags.length > 3 && (
|
{prompt.tags && prompt.tags.length > 4 && (
|
||||||
<span className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-muted text-muted-foreground rounded-full">
|
<span className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-muted text-muted-foreground rounded-full" title={`${prompt.tags.length - 4} more tags`}>
|
||||||
+{prompt.tags.length - 3}
|
+{prompt.tags.length - 4}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
|
{(!prompt.tags || prompt.tags.length === 0) && (
|
||||||
|
<span className="text-xs text-muted-foreground/50 italic">No tags</span>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -530,13 +522,30 @@ export default function StudioPage() {
|
|||||||
<div className="w-28 text-sm text-muted-foreground text-center hidden lg:block">
|
<div className="w-28 text-sm text-muted-foreground text-center hidden lg:block">
|
||||||
{formatDate(prompt.updatedAt)}
|
{formatDate(prompt.updatedAt)}
|
||||||
</div>
|
</div>
|
||||||
<div className="w-24 text-sm text-muted-foreground text-center hidden xl:block">
|
<div className="w-32 flex justify-center">
|
||||||
{prompt.lastUsed ? formatDate(prompt.lastUsed) : t('never')}
|
<div className="flex flex-wrap gap-1 items-center justify-center">
|
||||||
</div>
|
{prompt.tags?.slice(0, 2).map((tag: string | { name: string }) => {
|
||||||
<div className="w-16 flex justify-center">
|
const tagName = typeof tag === 'string' ? tag : tag?.name || '';
|
||||||
<span className="inline-flex items-center px-2 py-1 text-xs font-medium bg-primary/10 text-primary rounded-full border border-primary/20">
|
const displayTag = tagName.length > 8 ? tagName.slice(0, 8) + '...' : tagName;
|
||||||
{prompt.tags?.length || 0}
|
return (
|
||||||
</span>
|
<span
|
||||||
|
key={tagName}
|
||||||
|
className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-primary/10 text-primary rounded-full border border-primary/20"
|
||||||
|
title={tagName}
|
||||||
|
>
|
||||||
|
{displayTag}
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
{prompt.tags && prompt.tags.length > 2 && (
|
||||||
|
<span className="inline-flex items-center px-2 py-0.5 text-xs font-medium bg-muted text-muted-foreground rounded-full" title={`${prompt.tags.length - 2} more tags`}>
|
||||||
|
+{prompt.tags.length - 2}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
{(!prompt.tags || prompt.tags.length === 0) && (
|
||||||
|
<span className="text-xs text-muted-foreground/50 italic">No tags</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user