connect tailscale node status through platform gateway

src/pages/launcher/LauncherAppsPage.tsx

@@ -174,7 +174,7 @@ export function LauncherAppsPage() {
   return (
     <>
       <PageTitle
-        eyebrow="런처 운영"
+        eyebrow="런처"
         title="앱 연결"
         description="등록된 앱 중 런처에 노출할 앱과 표시 순서를 관리합니다."
         actions={

src/pages/launcher/LauncherBuildPage.tsx

@@ -268,7 +268,7 @@ export function LauncherBuildPage() {
   return (
     <>
       <PageTitle
-        eyebrow="런처 운영"
+        eyebrow="런처"
         title="빌드 관리"
         description="런처 클라이언트 설치 파일과 백엔드 컨테이너 이미지를 구성요소별로 빌드합니다."
         actions={

src/pages/launcher/LauncherCommonSettingsPage.tsx

@@ -1,341 +0,0 @@
-import { ChevronLeft, ChevronRight, MoreHorizontal, Plus, SlidersHorizontal, Trash2 } from 'lucide-react';
-import { useEffect, useMemo, useState, type FormEvent } from 'react';
-import { Badge, Button, Card, CardHeader, Modal } from '../../components/ui';
-import { useToast } from '../../components/toast';
-import { authApiEndpoints } from '../../data/mock';
-import { PageTitle } from '../../layout/AppLayout';
-import { LoadingModal, useMinimumLoading } from '../operations/operation-utils';
-import {
-  createLauncherCommonSetting,
-  deleteLauncherCommonSetting,
-  listLauncherCommonSettings,
-  updateLauncherCommonSetting,
-  type LauncherCommonSetting
-} from './launcher-api';
-
-type FormState = {
-  key: string;
-  name: string;
-  type: string;
-  value: string;
-  description: string;
-  isActive: boolean;
-  isSecret: boolean;
-};
-
-const emptyForm: FormState = {
-  key: '',
-  name: '',
-  type: 'endpoint',
-  value: '',
-  description: '',
-  isActive: true,
-  isSecret: false
-};
-
-const settingsPageSize = 10;
-
-function maskValue(setting: LauncherCommonSetting) {
-  if (!setting.isSecret) return setting.value;
-  if (!setting.value) return '-';
-  return '******';
-}
-
-function toForm(setting?: LauncherCommonSetting): FormState {
-  if (!setting) return emptyForm;
-  return {
-    key: setting.key,
-    name: setting.name,
-    type: setting.type,
-    value: setting.value,
-    description: setting.description ?? '',
-    isActive: setting.isActive,
-    isSecret: setting.isSecret
-  };
-}
-
-export function LauncherCommonSettingsPage() {
-  const { toast } = useToast();
-  const [apiOpen, setApiOpen] = useState(false);
-  const [settings, setSettings] = useState<LauncherCommonSetting[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [modalOpen, setModalOpen] = useState(false);
-  const [editing, setEditing] = useState<LauncherCommonSetting | null>(null);
-  const [form, setForm] = useState<FormState>(emptyForm);
-  const [saving, setSaving] = useState(false);
-  const [page, setPage] = useState(1);
-  const loadingVisible = useMinimumLoading(loading);
-
-  const totalPages = Math.max(1, Math.ceil(settings.length / settingsPageSize));
-  const pagedSettings = settings.slice((page - 1) * settingsPageSize, page * settingsPageSize);
-  const summary = useMemo(() => ({
-    total: settings.length,
-    endpoint: settings.filter((item) => item.type === 'endpoint').length,
-    database: settings.filter((item) => item.type === 'database').length,
-    active: settings.filter((item) => item.isActive).length
-  }), [settings]);
-
-  const refresh = () => {
-    setLoading(true);
-    listLauncherCommonSettings()
-      .then(setSettings)
-      .catch((error: Error) => {
-        toast({ type: 'error', title: '공통 설정 조회 실패', message: error.message });
-      })
-      .finally(() => setLoading(false));
-  };
-
-  useEffect(() => {
-    refresh();
-  }, []);
-
-  useEffect(() => {
-    setPage((currentPage) => Math.min(currentPage, totalPages));
-  }, [totalPages]);
-
-  const openCreate = () => {
-    setEditing(null);
-    setForm(emptyForm);
-    setModalOpen(true);
-  };
-
-  const openEdit = (setting: LauncherCommonSetting) => {
-    setEditing(setting);
-    setForm(toForm(setting));
-    setModalOpen(true);
-  };
-
-  const submit = (event: FormEvent) => {
-    event.preventDefault();
-    setSaving(true);
-    const payload = {
-      key: form.key.trim(),
-      name: form.name.trim(),
-      type: form.type.trim(),
-      value: form.value.trim(),
-      description: form.description.trim(),
-      isActive: form.isActive,
-      isSecret: form.isSecret
-    };
-    const request = editing
-      ? updateLauncherCommonSetting(editing.id, payload)
-      : createLauncherCommonSetting(payload);
-
-    request
-      .then(() => {
-        toast({ type: 'success', message: editing ? '설정을 수정했습니다.' : '설정을 추가했습니다.' });
-        setModalOpen(false);
-        refresh();
-      })
-      .catch((error: Error) => {
-        toast({ type: 'error', title: editing ? '설정 수정 실패' : '설정 추가 실패', message: error.message });
-      })
-      .finally(() => setSaving(false));
-  };
-
-  const remove = () => {
-    if (!editing) return;
-    setSaving(true);
-    deleteLauncherCommonSetting(editing.id)
-      .then(() => {
-        toast({ type: 'success', message: '설정을 삭제했습니다.' });
-        setModalOpen(false);
-        refresh();
-      })
-      .catch((error: Error) => {
-        toast({ type: 'error', title: '설정 삭제 실패', message: error.message });
-      })
-      .finally(() => setSaving(false));
-  };
-
-  return (
-    <>
-      <PageTitle
-        eyebrow="런처 운영"
-        title="공통 설정"
-        description="런처에서 공통으로 사용하는 연결값과 기본 설정을 관리합니다."
-        actions={
-          <>
-            <Button variant="outline" className="h-8 px-3 text-[13px]" onClick={() => setApiOpen(true)}>
-              <SlidersHorizontal className="size-4" />
-              공통 인증 API 보기
-            </Button>
-            <Button className="h-8 px-3 text-[13px]" onClick={openCreate}>
-              <Plus className="size-4" />
-              설정 추가
-            </Button>
-          </>
-        }
-      />
-
-      <div className="grid gap-4 md:grid-cols-4">
-        {[
-          ['설정 항목', `${summary.total}개`],
-          ['Endpoint', `${summary.endpoint}개`],
-          ['Database', `${summary.database}개`],
-          ['활성 상태', `${summary.active}개`]
-        ].map(([label, value]) => (
-          <Card className="p-5" key={label}>
-            <p className="text-sm text-muted-foreground">{label}</p>
-            <p className="mt-3 text-2xl font-semibold">{value}</p>
-          </Card>
-        ))}
-      </div>
-
-      <Card className="mt-4 min-w-0 overflow-hidden">
-        <CardHeader title="런처 연결 설정" description="여러 기능에서 함께 쓰는 주소, 인증, 저장소 관련 값을 정리합니다." />
-        <div className="overflow-x-auto">
-          <table className="w-full min-w-[1120px] text-left text-sm">
-            <thead className="border-b border-border text-xs text-muted-foreground">
-              <tr>
-                <th className="w-[280px] px-5 py-3 font-medium">설정</th>
-                <th className="px-5 py-3 font-medium">Key</th>
-                <th className="px-5 py-3 font-medium">Type</th>
-                <th className="px-5 py-3 font-medium">Value</th>
-                <th className="px-5 py-3 text-right font-medium">관리</th>
-              </tr>
-            </thead>
-            <tbody className="divide-y divide-border">
-              {!loading && settings.length === 0 ? (
-                <tr>
-                  <td colSpan={5} className="px-5 py-12 text-center text-sm text-muted-foreground">등록된 설정이 없습니다.</td>
-                </tr>
-              ) : null}
-              {pagedSettings.map((setting) => (
-                <tr className="hover:bg-muted/20" key={setting.id}>
-                  <td className="px-5 py-3">
-                    <p className="inline-flex items-center gap-2 font-medium">
-                      <span className={setting.isActive ? 'size-2 rounded-full bg-emerald-400' : 'size-2 rounded-full bg-muted-foreground'} />
-                      {setting.name}
-                    </p>
-                    {setting.description ? <p className="mt-1 truncate text-xs text-muted-foreground">{setting.description}</p> : null}
-                  </td>
-                  <td className="px-5 py-3 font-medium">{setting.key}</td>
-                  <td className="px-5 py-3">{setting.type}</td>
-                  <td className="px-5 py-3 text-muted-foreground">{maskValue(setting)}</td>
-                  <td className="px-5 py-3 text-right">
-                    <Button variant="ghost" className="size-8 px-0" aria-label={`${setting.name} 관리`} onClick={() => openEdit(setting)}>
-                      <MoreHorizontal className="size-4" />
-                    </Button>
-                  </td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-        <div className="flex items-center justify-between gap-4 border-t border-border px-5 py-3 text-sm">
-          <span className="text-xs text-muted-foreground">
-            {loading ? '불러오는 중' : `총 ${settings.length}건 · ${page} / ${totalPages}`}
-          </span>
-          <div className="flex gap-2">
-            <Button
-              variant="outline"
-              className="h-8 px-3 text-[13px]"
-              disabled={page <= 1}
-              onClick={() => setPage((currentPage) => Math.max(1, currentPage - 1))}
-            >
-              <ChevronLeft className="size-4" />
-              이전
-            </Button>
-            <Button
-              variant="outline"
-              className="h-8 px-3 text-[13px]"
-              disabled={page >= totalPages}
-              onClick={() => setPage((currentPage) => Math.min(totalPages, currentPage + 1))}
-            >
-              다음
-              <ChevronRight className="size-4" />
-            </Button>
-          </div>
-        </div>
-      </Card>
-
-      <Modal
-        open={modalOpen}
-        title={editing ? '설정 수정' : '설정 추가'}
-        onClose={() => setModalOpen(false)}
-        className="!max-w-2xl"
-        footer={
-          <>
-            {editing ? (
-              <Button variant="outline" className="border-rose-500/40 text-rose-300 hover:bg-rose-500/10" onClick={remove} disabled={saving}>
-                <Trash2 className="size-4" />
-                삭제
-              </Button>
-            ) : null}
-            <Button variant="outline" onClick={() => setModalOpen(false)}>취소</Button>
-            <Button onClick={submit as unknown as () => void} disabled={saving || !form.key.trim() || !form.name.trim() || !form.type.trim()}>
-              {saving ? '저장 중' : '저장'}
-            </Button>
-          </>
-        }
-      >
-        <form className="grid gap-4" onSubmit={submit}>
-          <div className="grid gap-4 md:grid-cols-2">
-            <label className="block">
-              <span className="text-xs font-medium text-muted-foreground">설정명</span>
-              <input className="mt-2 h-9 w-full rounded-md border border-input bg-background px-3 text-sm text-foreground outline-none focus:ring-2 focus:ring-ring" value={form.name} onChange={(event) => setForm((prev) => ({ ...prev, name: event.target.value }))} />
-            </label>
-            <label className="block">
-              <span className="text-xs font-medium text-muted-foreground">Type</span>
-              <input className="mt-2 h-9 w-full rounded-md border border-input bg-background px-3 text-sm text-foreground outline-none focus:ring-2 focus:ring-ring" value={form.type} onChange={(event) => setForm((prev) => ({ ...prev, type: event.target.value }))} />
-            </label>
-          </div>
-          <label className="block">
-            <span className="text-xs font-medium text-muted-foreground">Key</span>
-            <input className="mt-2 h-9 w-full rounded-md border border-input bg-background px-3 font-mono text-sm text-foreground outline-none focus:ring-2 focus:ring-ring" value={form.key} onChange={(event) => setForm((prev) => ({ ...prev, key: event.target.value }))} />
-          </label>
-          <label className="block">
-            <span className="text-xs font-medium text-muted-foreground">Value</span>
-            <input className="mt-2 h-9 w-full rounded-md border border-input bg-background px-3 font-mono text-sm text-foreground outline-none focus:ring-2 focus:ring-ring" value={form.value} onChange={(event) => setForm((prev) => ({ ...prev, value: event.target.value }))} />
-          </label>
-          <label className="block">
-            <span className="text-xs font-medium text-muted-foreground">설명</span>
-            <textarea className="mt-2 min-h-20 w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground outline-none focus:ring-2 focus:ring-ring" value={form.description} onChange={(event) => setForm((prev) => ({ ...prev, description: event.target.value }))} />
-          </label>
-          <div className="flex flex-wrap gap-4">
-            <label className="inline-flex items-center gap-2 text-sm">
-              <input type="checkbox" checked={form.isActive} onChange={(event) => setForm((prev) => ({ ...prev, isActive: event.target.checked }))} />
-              활성
-            </label>
-            <label className="inline-flex items-center gap-2 text-sm">
-              <input type="checkbox" checked={form.isSecret} onChange={(event) => setForm((prev) => ({ ...prev, isSecret: event.target.checked }))} />
-              민감값
-            </label>
-          </div>
-        </form>
-      </Modal>
-
-      <Modal open={apiOpen} title="공통 인증 API" onClose={() => setApiOpen(false)} className="!max-w-[1280px]" footer={<Button variant="ghost" onClick={() => setApiOpen(false)}>닫기</Button>}>
-        <div className="max-h-[70vh] overflow-x-auto overflow-y-auto">
-          <table className="w-full min-w-[980px] text-left text-sm">
-            <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>
-                <th className="px-5 py-3 font-medium">Method</th>
-                <th className="px-5 py-3 font-medium">Path</th>
-                <th className="px-5 py-3 font-medium">용도</th>
-                <th className="px-5 py-3 font-medium">권한</th>
-              </tr>
-            </thead>
-            <tbody className="divide-y divide-border">
-              {authApiEndpoints.map((endpoint) => (
-                <tr className="hover:bg-muted/20" key={`${endpoint.method}-${endpoint.path}`}>
-                  <td className="px-5 py-3">{endpoint.group}</td>
-                  <td className="px-5 py-3 font-semibold">{endpoint.method}</td>
-                  <td className="px-5 py-3 font-medium">{endpoint.path}</td>
-                  <td className="px-5 py-3 text-muted-foreground">{endpoint.purpose}</td>
-                  <td className="px-5 py-3">
-                    <Badge tone={endpoint.auth === '없음' ? 'neutral' : endpoint.auth === 'ADMIN' ? 'amber' : 'blue'}>{endpoint.auth}</Badge>
-                  </td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-      </Modal>
-
-      <LoadingModal open={loadingVisible} />
-    </>
-  );
-}

src/pages/launcher/LauncherComponentsPage.tsx

@@ -228,7 +228,7 @@ export function LauncherComponentsPage() {
   return (
     <>
       <PageTitle
-        eyebrow="런처 운영"
+        eyebrow="런처"
         title="구성요소"
         description="런처 클라이언트, 백엔드, DB의 배포 기준과 런타임 상태를 한 화면에서 확인합니다."
         actions={

src/pages/launcher/LauncherSourcePage.tsx

@@ -537,7 +537,7 @@ export function LauncherSourcePage() {
   return (
     <>
       <PageTitle
-        eyebrow="런처 운영"
+        eyebrow="런처"
         title="소스 관리"
         description="런처 클라이언트와 백엔드 소스 저장소를 구성요소별로 연결합니다."
         actions={

src/pages/launcher/LauncherVersionsPage.tsx

@@ -144,7 +144,7 @@ export function LauncherVersionsPage() {
   return (
     <>
       <PageTitle
-        eyebrow="런처 운영"
+        eyebrow="런처"
         title="버전 관리"
         description="스튜디오 메인 런처 클라이언트 릴리즈와 백엔드 배포를 관리합니다."
         actions={

src/pages/launcher/launcher-api.ts

@@ -129,19 +129,6 @@ export type LauncherAppLink = {
   release?: AppRelease | null;
 };
 
-export type LauncherCommonSetting = {
-  id: string;
-  key: string;
-  name: string;
-  type: string;
-  value: string;
-  description?: string | null;
-  isActive: boolean;
-  isSecret: boolean;
-  createdAt: string;
-  updatedAt?: string;
-};
-
 export type LauncherUnlinkedApp = AppWithComponents & {
   releases?: AppRelease[];
 };
@@ -380,48 +367,6 @@ export function deleteLauncherAppLink(id: string) {
   return apiRequest<{ deleted: boolean }>(`/launcher/app-links/${id}`, { method: 'DELETE' });
 }
 
-export function listLauncherCommonSettings() {
-  return apiRequest<LauncherCommonSetting[]>('/launcher/common-settings');
-}
-
-export function createLauncherCommonSetting(input: {
-  key: string;
-  name: string;
-  type: string;
-  value: string;
-  description?: string;
-  isActive?: boolean;
-  isSecret?: boolean;
-}) {
-  return apiRequest<{ setting: LauncherCommonSetting }>('/launcher/common-settings', {
-    method: 'POST',
-    body: JSON.stringify(input)
-  });
-}
-
-export function updateLauncherCommonSetting(
-  id: string,
-  input: Partial<{
-    key: string;
-    name: string;
-    type: string;
-    value: string;
-    description: string;
-    isActive: boolean;
-    isSecret: boolean;
-  }>
-) {
-  return apiRequest<{ setting: LauncherCommonSetting }>(`/launcher/common-settings/${id}`, {
-    method: 'PATCH',
-    body: JSON.stringify(input)
-  });
-}
-
-export function deleteLauncherCommonSetting(id: string) {
-  return apiRequest<{ deleted: boolean }>(`/launcher/common-settings/${id}`, { method: 'DELETE' });
-}
-
-
 export type RuntimeWorkloadEnvVariable = {
   key: string;
   value: string;