studio/studio-admin-fe
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

paginate app operations and refine runtime settings layout
ci/woodpecker/push/woodpecker Pipeline failed
Details

Browse Source
This commit is contained in:
chyoo
2026-07-07 15:32:56 +09:00
parent 1de085790d
commit 9cb82249d7
14 changed files with 805 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/runtime/RuntimeConfigPage.tsx
+32 -17
View File
@@ -462,8 +462,15 @@ export function RuntimeConfigPage() {
</div>
<span className="text-xs text-muted-foreground">총 {variables.length}개</span>
</div>
<div className="max-h-[480px] overflow-x-auto overflow-y-auto">
<table className="w-full min-w-[920px] text-left text-sm">
<div className="max-h-[480px] overflow-y-auto">
<table className="w-full table-fixed text-left text-sm">
<colgroup>
<col className="w-[22%]" />
<col className="w-[29%]" />
<col className="w-[19%]" />
<col className="w-[24%]" />
<col className="w-20" />
</colgroup>
<thead className="sticky top-0 z-10 border-b border-border bg-card text-xs text-muted-foreground">
<tr>
<th className="px-5 py-3 font-medium">구성요소</th>
@@ -479,16 +486,16 @@ export function RuntimeConfigPage() {
) : null}
{variables.map((variable) => (
<tr key={variable.id} className="hover:bg-muted/20">
<td className="px-5 py-3">
<td className="px-4 py-3">
<span className="inline-flex items-center gap-2">
<span className={variable.isSecret ? 'block size-2.5 rounded-full bg-amber-400' : 'block size-2.5 rounded-full bg-emerald-400'} />
<span>{variable.component?.name ?? '-'}</span>
<span className="truncate">{variable.component?.name ?? '-'}</span>
</span>
</td>
<td className="px-5 py-3 font-mono text-xs font-medium text-foreground">{variable.key}</td>
<td className="px-5 py-3 font-mono text-xs text-muted-foreground">{variable.isSecret ? '********' : variable.value}</td>
<td className="px-5 py-3 text-xs text-muted-foreground">{formatDate(variable.createdAt)}</td>
<td className="px-5 py-3 text-right">
<td className="break-all px-4 py-3 font-mono text-xs font-medium text-foreground">{variable.key}</td>
<td className="break-all px-4 py-3 font-mono text-xs text-muted-foreground">{variable.isSecret ? '********' : variable.value}</td>
<td className="px-4 py-3 text-xs text-muted-foreground">{formatDate(variable.createdAt)}</td>
<td className="px-3 py-3 text-right">
<Button variant="ghost" className="h-8 w-8 p-0 text-rose-300 hover:text-rose-200" title="삭제" aria-label={`${variable.key} 삭제`} onClick={() => removeVariable(variable.id)} disabled={Boolean(actionKey)}>
<Trash2 className="size-4" />
</Button>
@@ -552,8 +559,16 @@ export function RuntimeConfigPage() {
</div>
<span className="text-xs text-muted-foreground">총 {ingressRules.length}개</span>
</div>
<div className="max-h-[320px] overflow-x-auto overflow-y-auto">
<table className="w-full min-w-[940px] text-left text-sm">
<div className="max-h-[320px] overflow-y-auto">
<table className="w-full table-fixed text-left text-sm">
<colgroup>
<col className="w-[24%]" />
<col className="w-[32%]" />
<col className="w-[16%]" />
<col className="w-[10%]" />
<col className="w-[10%]" />
<col className="w-14" />
</colgroup>
<thead className="sticky top-0 z-10 border-b border-border bg-card text-xs text-muted-foreground">
<tr>
<th className="px-5 py-3 font-medium">구성요소</th>
@@ -570,17 +585,17 @@ export function RuntimeConfigPage() {
) : null}
{ingressRules.map((rule) => (
<tr key={rule.id} className="hover:bg-muted/20">
<td className="px-5 py-3">
<td className="px-4 py-3">
<span className="inline-flex items-center gap-2">
<span className="block size-2.5 rounded-full bg-sky-400" />
<span>{rule.component?.name ?? '-'}</span>
<span className="truncate">{rule.component?.name ?? '-'}</span>
</span>
</td>
<td className="px-5 py-3 text-foreground">{rule.host}</td>
<td className="px-5 py-3 text-muted-foreground">{rule.path}</td>
<td className="px-5 py-3 text-muted-foreground">{rule.servicePort}</td>
<td className="px-5 py-3 text-muted-foreground">{rule.stripPrefix ? '제거' : '유지'}</td>
<td className="px-5 py-3 text-right">
<td className="break-all px-4 py-3 text-foreground">{rule.host}</td>
<td className="break-all px-4 py-3 text-muted-foreground">{rule.path}</td>
<td className="px-4 py-3 text-muted-foreground">{rule.servicePort}</td>
<td className="px-4 py-3 text-muted-foreground">{rule.stripPrefix ? '제거' : '유지'}</td>
<td className="px-3 py-3 text-right">
<Button variant="ghost" className="h-8 w-8 p-0 text-rose-300 hover:text-rose-200" title="삭제" aria-label={`${rule.host} 삭제`} onClick={() => removeIngressRule(rule.id)} disabled={Boolean(actionKey)}>
<Trash2 className="size-4" />
</Button>