add runtime log views and standardize status dots

src/pages/applications/AppManagementPage.tsx

@@ -5,6 +5,7 @@ import { useToast } from '../../components/toast';
 import { PageTitle } from '../../layout/AppLayout';
 import { apiBaseUrl, apiFetch, authHeaders } from '../../lib/api';
 import { filterAppsByCurrentAdmin, grantAppPermissionToCurrentAdmin } from '../../lib/admin-app-permissions';
+import { runtimeStatusDotClass, statusDotToneClass } from '../../lib/status-dot';
 import { cn } from '../../lib/utils';
 import { getStoredSelectedAppId, setStoredSelectedAppId } from '../../lib/selected-app';
 import type { ApiApp, ApiAppComponent, BuildEnvVariable, RuntimePersistentVolumeClaim, RuntimeResource } from '../../types/runtime';
@@ -237,13 +238,6 @@ function runtimeStatusTone(resource: RuntimeResource, stopped: boolean): 'neutra
   return 'blue';
 }
 
-function statusDot(status?: string) {
-  if (['Running', 'Bound', 'ClusterIP', 'LoadBalancer'].includes(status ?? '')) return 'bg-emerald-400';
-  if (['Pending', 'ContainerCreating'].includes(status ?? '')) return 'bg-amber-400';
-  if (['Error', 'CrashLoopBackOff', 'ImagePullBackOff', 'Failed'].includes(status ?? '')) return 'bg-rose-400';
-  return 'bg-muted-foreground';
-}
-
 function isComponentRunning(component: ApiAppComponent, resources: RuntimeResource[]) {
   const name = component.name.toLowerCase();
   return resources.some((resource) => {
@@ -1012,7 +1006,7 @@ export function AppManagementPage() {
                         <tr key={component.name} className="hover:bg-muted/20">
                           <td className="px-5 py-3 font-medium">
                             <span className="inline-flex items-center gap-2">
-                              <span className={cn('size-2 rounded-full', running ? 'bg-emerald-400' : component.repository ? 'bg-blue-400' : 'bg-muted-foreground')} />
+                              <span className={cn('size-2.5 shrink-0 rounded-full', running ? statusDotToneClass('green') : component.repository ? statusDotToneClass('blue') : statusDotToneClass('neutral'))} />
                               {component.name}
                               {running ? <Badge tone="green">실행 중</Badge> : null}
                             </span>
@@ -1095,7 +1089,7 @@ export function AppManagementPage() {
                         <tr key={actionBase} className="hover:bg-muted/20">
                           <td className="px-5 py-3">
                             <span className="inline-flex items-center gap-2">
-                              <span className={`block size-2.5 rounded-full ${stopped ? 'bg-muted-foreground' : statusDot(resource.status)}`} />
+                              <span className={cn('block size-2.5 shrink-0 rounded-full', stopped ? statusDotToneClass('neutral') : runtimeStatusDotClass(resource.status))} />
                               <span className="text-sm text-foreground">{resource.name}</span>
                               <Badge tone={runtimeStatusTone(resource, stopped)}>{runtimeStatusLabel(resource, stopped)}</Badge>
                             </span>