Skip to content

Commit 593a92c

Browse files
committed
fix: replace whole-card click with dedicated "Load in Editor" button in Model Gallery (#362)
1 parent 33dd41f commit 593a92c

17 files changed

Lines changed: 98 additions & 36 deletions

File tree

app/gallery/page.tsx

Lines changed: 67 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,15 @@
1616
import React, { useState } from 'react';
1717
import { useRouter } from 'next/navigation';
1818
import { clsx } from 'clsx';
19-
import { ArrowLeft, Search } from 'lucide-react';
19+
import { ArrowLeft, ExternalLink, Search } from 'lucide-react';
2020
import { useLang } from '@/app/context/LangContext';
2121
import { modelMetadata, categories } from '@/app/config/modelMetadata';
22+
import {
23+
Tooltip,
24+
TooltipContent,
25+
TooltipProvider,
26+
TooltipTrigger,
27+
} from '@/app/components/ui/tooltip';
2228

2329
export default function GalleryPage() {
2430
const { theme, t } = useLang();
@@ -151,43 +157,68 @@ export default function GalleryPage() {
151157
</div>
152158

153159
{/* Model Grid */}
154-
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
155-
{filteredModels.map((model) => {
156-
return (
157-
<div
158-
key={model.key}
159-
onClick={() => {
160-
return handleModelClick(model.key);
161-
}}
162-
className={clsx(
163-
'rounded-lg border border-border shadow-sm cursor-pointer transition-all duration-200',
164-
cardBgClass,
165-
hoverClass,
166-
'hover:shadow-lg hover:border-primary/50',
167-
)}
168-
>
169-
<div className="p-6">
170-
<div className="flex items-start justify-between mb-3">
171-
<h3 className={clsx('text-xl font-semibold', textClass)}>
172-
{t(model.name)}
173-
</h3>
174-
<span
175-
className={clsx(
176-
'px-2 py-1 text-xs font-medium rounded',
177-
'bg-primary/10 text-primary',
178-
)}
179-
>
180-
{t(model.category)}
181-
</span>
160+
<TooltipProvider delayDuration={700} skipDelayDuration={0}>
161+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
162+
{filteredModels.map((model) => {
163+
return (
164+
<div
165+
key={model.key}
166+
className={clsx(
167+
'rounded-lg border border-border shadow-sm transition-all duration-200',
168+
cardBgClass,
169+
'hover:shadow-lg',
170+
)}
171+
>
172+
<div className="p-6">
173+
<div className="flex items-start justify-between mb-3">
174+
<h3 className={clsx('text-xl font-semibold', textClass)}>
175+
{t(model.name)}
176+
</h3>
177+
<span
178+
className={clsx(
179+
'px-2 py-1 text-xs font-medium rounded',
180+
'bg-primary/10 text-primary',
181+
)}
182+
>
183+
{t(model.category)}
184+
</span>
185+
</div>
186+
<p className={clsx('text-sm mb-4', textClass, 'opacity-70')}>
187+
{t(model.description)}
188+
</p>
189+
<div className="flex justify-end">
190+
<Tooltip>
191+
<TooltipTrigger asChild>
192+
<button
193+
onClick={() => {
194+
handleModelClick(model.key);
195+
}}
196+
className={clsx(
197+
'inline-flex items-center gap-2 p-2 rounded-lg',
198+
'text-sm font-medium transition-all duration-200',
199+
'bg-primary text-primary-foreground',
200+
'hover:bg-primary/90 hover:shadow-md',
201+
'focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2',
202+
)}
203+
>
204+
<ExternalLink className="w-4 h-4" />
205+
</button>
206+
</TooltipTrigger>
207+
<TooltipContent
208+
className={clsx(
209+
'bg-white dark:bg-gray-800 text-primary border border-primary',
210+
)}
211+
>
212+
<p>{t('Load in Editor')}</p>
213+
</TooltipContent>
214+
</Tooltip>
215+
</div>
182216
</div>
183-
<p className={clsx('text-sm', textClass, 'opacity-70')}>
184-
{t(model.description)}
185-
</p>
186217
</div>
187-
</div>
188-
);
189-
})}
190-
</div>
218+
);
219+
})}
220+
</div>
221+
</TooltipProvider>
191222
</div>
192223
</div>
193224

messages/ar.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "إعادة تعيين جميع الحقول إلى قيمها الافتراضية.",
1010
"Policy": "سياسة",
1111
"Policy Editor": "محرر السياسة",
12+
"Model Gallery": "معرض النماذج",
13+
"Load in Editor": "تحميل في المحرر",
1214
"Request": "طلب",
1315
"Enforcement Result": "نتيجة التنفيذ",
1416
"Why this result": "لماذا هذه النتيجة",

messages/de.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "Alle Felder auf ihre Standardwerte zurücksetzen.",
1010
"Policy": "Richtlinie",
1111
"Policy Editor": "Richtlinien-Editor",
12+
"Model Gallery": "Modell-Galerie",
13+
"Load in Editor": "Im Editor öffnen",
1214
"Request": "Anfrage",
1315
"Enforcement Result": "Durchsetzungsergebnis",
1416
"Why this result": "Warum dieses Ergebnis?",

messages/en.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
"Policy": "Policy",
1111
"Policy Editor": "Policy Editor",
1212
"Model Gallery": "Model Gallery",
13+
"Load in Editor": "Load in Editor",
1314
"Request": "Request",
1415
"Enforcement Result": "Enforcement Result",
1516
"Why this result": "Why this result",

messages/es.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "Restablecer todos los campos a sus valores predeterminados.",
1010
"Policy": "Política",
1111
"Policy Editor": "Editor de políticas",
12+
"Model Gallery": "Galería de modelos",
13+
"Load in Editor": "Cargar en el editor",
1214
"Request": "Solicitud",
1315
"Enforcement Result": "Resultado de ejecución",
1416
"Why this result": "Por qué este resultado",

messages/fr.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "Réinitialiser tous les champs à leurs valeurs par défaut.",
1010
"Policy": "Politique",
1111
"Policy Editor": "Éditeur de politique",
12+
"Model Gallery": "Galerie de modèles",
13+
"Load in Editor": "Charger dans l'éditeur",
1214
"Request": "Requête",
1315
"Enforcement Result": "Résultat d'application",
1416
"Why this result": "Pourquoi ce résultat ?",

messages/id.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "Reset semua bidang ke nilai default.",
1010
"Policy": "Kebijakan",
1111
"Policy Editor": "Editor kebijakan",
12+
"Model Gallery": "Galeri model",
13+
"Load in Editor": "Muat di editor",
1214
"Request": "Permintaan",
1315
"Enforcement Result": "Hasil penegakan",
1416
"Why this result": "Mengapa hasil ini",

messages/it.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "Reimposta tutti i campi ai valori predefiniti.",
1010
"Policy": "Politica",
1111
"Policy Editor": "Editor di politiche",
12+
"Model Gallery": "Galleria di modelli",
13+
"Load in Editor": "Carica nell'editor",
1214
"Request": "Richiesta",
1315
"Enforcement Result": "Risultato dell'applicazione",
1416
"Why this result": "Perché questo risultato",

messages/ja.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "すべてのフィールドをデフォルト値にリセットします。",
1010
"Policy": "ポリシー",
1111
"Policy Editor": "ポリシーエディタ",
12+
"Model Gallery": "モデルギャラリー",
13+
"Load in Editor": "エディタで開く",
1214
"Request": "リクエスト",
1315
"Enforcement Result": "実行結果",
1416
"Why this result": "なぜこの結果?",

messages/ko.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,8 @@
99
"Reset tooltip": "모든 필드를 기본값으로 재설정합니다.",
1010
"Policy": "정책",
1111
"Policy Editor": "정책 편집기",
12+
"Model Gallery": "모델 갤러리",
13+
"Load in Editor": "편집기에서 열기",
1214
"Request": "요청",
1315
"Enforcement Result": "집행 결과",
1416
"Why this result": "이 결과의 이유",

0 commit comments

Comments
 (0)