platform/lms-adm-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(platforms): widen platform column and prioritize unregistered agents

Browse Source
This commit is contained in:
chyoo
2026-09-29 16:41:51 +09:00
parent 53c6ada470
commit 0d3cdfbe0c
1 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/platforms/PlatformsPage.tsx
+8 -5
View File
@@ -121,6 +121,9 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
}); });
return keys; return keys;
}, [platforms]); }, [platforms]);
const sortedAgents = useMemo(() => [...agents].sort((a, b) =>
Number(isRegisteredAgent(a, registeredAgentKeys)) - Number(isRegisteredAgent(b, registeredAgentKeys)),
), [agents, registeredAgentKeys]);
const pagedPlatforms = useMemo(() => filteredPlatforms.slice((page - 1) * pageSize, page * pageSize), [filteredPlatforms, page, pageSize]); const pagedPlatforms = useMemo(() => filteredPlatforms.slice((page - 1) * pageSize, page * pageSize), [filteredPlatforms, page, pageSize]);
const summaryItems = [ const summaryItems = [
{ label: '전체 플랫폼', value: `${summary.totalPlatforms}대`, icon: Car, tone: 'bg-[#eff6ff] text-[#2563eb]' }, { label: '전체 플랫폼', value: `${summary.totalPlatforms}대`, icon: Car, tone: 'bg-[#eff6ff] text-[#2563eb]' },
@@ -449,7 +452,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
<div className="overflow-x-auto"> <div className="overflow-x-auto">
<div className="xl:min-w-[1020px]"> <div className="xl:min-w-[1020px]">
<div className="hidden select-none gap-4 grid-cols-[44px_200px_110px_92px_110px_150px_184px] items-center border-b border-[#cbd5e1] bg-[#f8fafc] px-4 py-3 text-center text-[11px] font-bold text-[#64748b] xl:grid"> <div className="hidden select-none gap-4 grid-cols-[44px_minmax(200px,1fr)_110px_92px_110px_150px_184px] items-center border-b border-[#cbd5e1] bg-[#f8fafc] px-4 py-3 text-center text-[11px] font-bold text-[#64748b] xl:grid">
<span>No.</span> <span>No.</span>
<span>플랫폼</span> <span>플랫폼</span>
<span>연결</span> <span>연결</span>
@@ -471,7 +474,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
</div> </div>
) : pagedPlatforms.length > 0 ? ( ) : pagedPlatforms.length > 0 ? (
pagedPlatforms.map((platform, index) => ( pagedPlatforms.map((platform, index) => (
<article className="grid select-none gap-4 px-4 py-4 xl:grid-cols-[44px_200px_110px_92px_110px_150px_184px] xl:items-center" key={platform.id}> <article className="grid select-none gap-4 px-4 py-4 xl:grid-cols-[44px_minmax(200px,1fr)_110px_92px_110px_150px_184px] xl:items-center" key={platform.id}>
<div className="text-center"> <div className="text-center">
<p className="mb-2 text-[11px] font-bold text-[#94a3b8] xl:hidden">번호</p> <p className="mb-2 text-[11px] font-bold text-[#94a3b8] xl:hidden">번호</p>
<span className="text-[13px] font-bold text-[#64748b]">{filteredPlatforms.length - ((page - 1) * pageSize + index)}</span> <span className="text-[13px] font-bold text-[#64748b]">{filteredPlatforms.length - ((page - 1) * pageSize + index)}</span>
@@ -483,7 +486,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
</span> </span>
<div className="min-w-0"> <div className="min-w-0">
<h3 className="truncate text-[14px] font-black text-[#111827]">{platform.name}</h3> <h3 className="truncate text-[14px] font-black text-[#111827]">{platform.name}</h3>
<p className="mt-1 text-[12px] font-bold text-[#64748b]">{platform.type}</p> <p className="mt-1 break-words text-[12px] font-bold text-[#64748b]">{platform.type}</p>
</div> </div>
</div> </div>
@@ -606,7 +609,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
<div className="p-5"> <div className="p-5">
<div> <div>
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<span className="text-[12px] font-black text-[#475569]">등록된 에이전트</span> <span className="text-[12px] font-black text-[#475569]">검색된 에이전트</span>
<span className="text-[11px] font-bold text-[#94a3b8]"> <span className="text-[11px] font-bold text-[#94a3b8]">
{agentsLoading ? '조회 중' : `${agents.filter((agent) => agent.connected && !agent.expired).length}/${agents.length} 연결`} {agentsLoading ? '조회 중' : `${agents.filter((agent) => agent.connected && !agent.expired).length}/${agents.length} 연결`}
</span> </span>
@@ -619,7 +622,7 @@ export function PlatformsPage({ session }: { session: AuthSession }) {
</div> </div>
) : agentsError ? ( ) : agentsError ? (
<div className="rounded-md border border-dashed border-[#fecdd3] bg-[#fff1f2] px-3 py-8 text-center text-[12px] font-bold text-[#e11d48]">{agentsError}</div> <div className="rounded-md border border-dashed border-[#fecdd3] bg-[#fff1f2] px-3 py-8 text-center text-[12px] font-bold text-[#e11d48]">{agentsError}</div>
) : agents.length ? agents.map((agent) => { ) : sortedAgents.length ? sortedAgents.map((agent) => {
const selected = selectedAgentId === agent.id; const selected = selectedAgentId === agent.id;
const available = agent.connected && !agent.expired; const available = agent.connected && !agent.expired;
const registered = isRegisteredAgent(agent, registeredAgentKeys); const registered = isRegisteredAgent(agent, registeredAgentKeys);