@cartanova/qgrid-cli 2.10.10 → 2.11.0

package/bundle/web-dist/server/assets/settings-C3gbGk0m.js

@@ -0,0 +1,830 @@
+import { F as require_react, N as useQueryClient, a as SettingService, k as require_jsx_dev_runtime, o as TokenService, tt as __toESM } from "./services.generated-DQATJ6qf.js";
+import { s as lucideRotateCcw } from "../entry-server.generated.js";
+import { t as useUpdateTokenMutation } from "./use-update-token-mutation-BEbgOzaa.js";
+import { t as lucidePlus } from "./plus-DwG7h9kq.js";
+//#region ~icons/lucide/eye.jsx
+var import_react = /* @__PURE__ */ __toESM(require_react());
+var import_jsx_dev_runtime = require_jsx_dev_runtime();
+var _jsxFileName$4 = "~icons/lucide/eye.jsx";
+var lucideEye = (props) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("svg", {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em",
+	...props,
+	children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("g", {
+		fill: "none",
+		stroke: "currentColor",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: 2,
+		children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("path", { d: "M2.062 12.348a1 1 0 0 1 0-.696a10.75 10.75 0 0 1 19.876 0a1 1 0 0 1 0 .696a10.75 10.75 0 0 1-19.876 0" }, void 0, false, {
+			fileName: _jsxFileName$4,
+			lineNumber: 2,
+			columnNumber: 191
+		}, void 0), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("circle", {
+			cx: 12,
+			cy: 12,
+			r: 3
+		}, void 0, false, {
+			fileName: _jsxFileName$4,
+			lineNumber: 2,
+			columnNumber: 305
+		}, void 0)]
+	}, void 0, true, {
+		fileName: _jsxFileName$4,
+		lineNumber: 2,
+		columnNumber: 93
+	}, void 0)
+}, void 0, false, {
+	fileName: _jsxFileName$4,
+	lineNumber: 2,
+	columnNumber: 28
+}, void 0);
+//#endregion
+//#region ~icons/lucide/eye-off.jsx
+var _jsxFileName$3 = "~icons/lucide/eye-off.jsx";
+var lucideEyeOff = (props) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("svg", {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em",
+	...props,
+	children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("g", {
+		fill: "none",
+		stroke: "currentColor",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: 2,
+		children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("path", { d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575a1 1 0 0 1 0 .696a10.8 10.8 0 0 1-1.444 2.49m-6.41-.679a3 3 0 0 1-4.242-4.242" }, void 0, false, {
+			fileName: _jsxFileName$3,
+			lineNumber: 2,
+			columnNumber: 194
+		}, void 0), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("path", { d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151a1 1 0 0 1 0-.696a10.75 10.75 0 0 1 4.446-5.143M2 2l20 20" }, void 0, false, {
+			fileName: _jsxFileName$3,
+			lineNumber: 2,
+			columnNumber: 330
+		}, void 0)]
+	}, void 0, true, {
+		fileName: _jsxFileName$3,
+		lineNumber: 2,
+		columnNumber: 96
+	}, void 0)
+}, void 0, false, {
+	fileName: _jsxFileName$3,
+	lineNumber: 2,
+	columnNumber: 31
+}, void 0);
+//#endregion
+//#region ~icons/lucide/minus.jsx
+var _jsxFileName$2 = "~icons/lucide/minus.jsx";
+var lucideMinus = (props) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("svg", {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em",
+	...props,
+	children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("path", {
+		fill: "none",
+		stroke: "currentColor",
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		strokeWidth: 2,
+		d: "M5 12h14"
+	}, void 0, false, {
+		fileName: _jsxFileName$2,
+		lineNumber: 2,
+		columnNumber: 95
+	}, void 0)
+}, void 0, false, {
+	fileName: _jsxFileName$2,
+	lineNumber: 2,
+	columnNumber: 30
+}, void 0);
+//#endregion
+//#region src/components/qgrid/SettingsPanel.tsx
+var _jsxFileName$1 = "/home/runner/work/qgrid/qgrid/packages/web/src/components/qgrid/SettingsPanel.tsx";
+var GROUP_LABELS = new Map([
+	["qgrid", "Qgrid"],
+	["slack", "Slack 알림"],
+	["slackConnection", "Slack 연결"]
+]);
+function maskValue(value) {
+	if (!value) return "";
+	if (value.length <= 12) return "•".repeat(value.length);
+	return `${value.slice(0, 8)}${"•".repeat(12)}${value.slice(-4)}`;
+}
+/** 정수·실수는 타이핑보다 증감이 빠르다. 범위도 버튼이 알아서 지킨다. */
+function Stepper({ value, min, max, step, disabled, onChange }) {
+	const current = Number(value);
+	const valid = Number.isFinite(current);
+	const lower = min ?? Number.NEGATIVE_INFINITY;
+	const upper = max ?? Number.POSITIVE_INFINITY;
+	const adjust = (delta) => {
+		const next = Math.min(Math.max((valid ? current : min ?? 0) + delta, lower), upper);
+		onChange(String(Number(next.toFixed(2))));
+	};
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "inline-flex items-center rounded-lg border border-sand-200/80 bg-white overflow-hidden",
+		children: [
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+				type: "button",
+				"aria-label": "감소",
+				onClick: () => adjust(-step),
+				disabled: disabled || valid && current <= lower,
+				className: "size-7 grid place-items-center text-sand-500 hover:bg-sand-100 disabled:opacity-30 disabled:hover:bg-transparent transition-colors duration-150",
+				children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(lucideMinus, { className: "size-3" }, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 64,
+					columnNumber: 9
+				}, this)
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 57,
+				columnNumber: 7
+			}, this),
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("input", {
+				value,
+				onChange: (e) => onChange(e.target.value),
+				disabled,
+				inputMode: "decimal",
+				className: "w-12 text-center text-[12px] tabular-nums text-sand-800 bg-transparent border-x border-sand-200/80 py-1 focus:outline-none focus:bg-sand-50"
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 66,
+				columnNumber: 7
+			}, this),
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+				type: "button",
+				"aria-label": "증가",
+				onClick: () => adjust(step),
+				disabled: disabled || valid && current >= upper,
+				className: "size-7 grid place-items-center text-sand-500 hover:bg-sand-100 disabled:opacity-30 disabled:hover:bg-transparent transition-colors duration-150",
+				children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(lucidePlus, { className: "size-3" }, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 80,
+					columnNumber: 9
+				}, this)
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 73,
+				columnNumber: 7
+			}, this)
+		]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 56,
+		columnNumber: 5
+	}, this);
+}
+/** 고정 선택지. 자유 입력보다 고르는 편이 빠르고, 범위를 벗어난 값이 생기지 않는다. */
+function PresetGroup({ value, presets, disabled, onChange }) {
+	const current = Number(value);
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "segmented-control inline-flex",
+		children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+			type: "button",
+			disabled,
+			"data-active": current === preset,
+			onClick: () => onChange(String(preset)),
+			className: "rounded-[6px] px-2.5 py-1 text-[11px] font-medium tabular-nums text-sand-500 transition-colors hover:text-sand-800 disabled:opacity-50 data-[active=true]:text-sand-900",
+			children: preset >= 60 ? `${preset / 60}시간` : `${preset}분`
+		}, preset, false, {
+			fileName: _jsxFileName$1,
+			lineNumber: 103,
+			columnNumber: 9
+		}, this))
+	}, void 0, false, {
+		fileName: _jsxFileName$1,
+		lineNumber: 101,
+		columnNumber: 5
+	}, this);
+}
+/** 값이 어디서 왔는지. 되돌림 버튼이 무엇을 지우는지 이 배지가 설명한다. */
+function SourceBadge({ source }) {
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+		className: `text-[10px] px-1.5 py-0.5 rounded ${source === "db" ? "bg-sienna-50 text-sienna-600" : "bg-sand-100 text-sand-500"}`,
+		children: source === "db" ? "저장값" : source === "env" ? "환경변수" : "기본값"
+	}, void 0, false, {
+		fileName: _jsxFileName$1,
+		lineNumber: 123,
+		columnNumber: 5
+	}, this);
+}
+function Toggle({ on, disabled, onChange }) {
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+		type: "button",
+		role: "switch",
+		"aria-checked": on,
+		disabled,
+		onClick: () => onChange(!on),
+		className: `relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition-colors duration-200 disabled:opacity-50 ${on ? "bg-sage-400" : "bg-sand-300"}`,
+		children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", { className: `inline-block h-3.5 w-3.5 rounded-full bg-white transition-transform duration-200 ${on ? "translate-x-4.5" : "translate-x-0.5"}` }, void 0, false, {
+			fileName: _jsxFileName$1,
+			lineNumber: 153,
+			columnNumber: 7
+		}, this)
+	}, void 0, false, {
+		fileName: _jsxFileName$1,
+		lineNumber: 143,
+		columnNumber: 5
+	}, this);
+}
+function SettingRow({ item, disabled = false }) {
+	const [draft, setDraft] = (0, import_react.useState)(null);
+	const [revealed, setRevealed] = (0, import_react.useState)(false);
+	const [error, setError] = (0, import_react.useState)(null);
+	const queryClient = useQueryClient();
+	const updateMutation = SettingService.useUpdateSettingMutation();
+	const resetMutation = SettingService.useResetSettingMutation();
+	const pending = disabled || updateMutation.isPending || resetMutation.isPending;
+	const value = draft ?? item.value;
+	const dirty = draft !== null && draft !== item.value;
+	const invalidate = () => queryClient.invalidateQueries({ queryKey: SettingService.getSettingListQueryOptions().queryKey });
+	const commit = async (next) => {
+		setError(null);
+		try {
+			await updateMutation.mutateAsync({
+				key: item.key,
+				value: next
+			});
+			await invalidate();
+			setDraft(null);
+		} catch (e) {
+			setError(e instanceof Error ? e.message : String(e));
+		}
+	};
+	const reset = async () => {
+		setError(null);
+		try {
+			await resetMutation.mutateAsync({ key: item.key });
+			await invalidate();
+			setDraft(null);
+		} catch (e) {
+			setError(e instanceof Error ? e.message : String(e));
+		}
+	};
+	const isSecret = item.kind === "secret";
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "px-4 py-3 sm:px-5",
+		children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+			className: "flex items-start gap-4",
+			children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "min-w-0 flex-1",
+				children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+							className: "text-[13px] text-sand-800",
+							children: item.label
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 210,
+							columnNumber: 13
+						}, this),
+						/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(SourceBadge, { source: item.source }, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 211,
+							columnNumber: 13
+						}, this),
+						item.applies === "restart" && /* @__PURE__ */ (void 0)("span", {
+							className: "text-[10px] text-caution-500",
+							title: "저장해도 다음 재시작부터 반영됩니다",
+							children: "재시작 필요"
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 213,
+							columnNumber: 15
+						}, this)
+					]
+				}, void 0, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 209,
+					columnNumber: 11
+				}, this), item.help && /* @__PURE__ */ (void 0)("p", {
+					className: "mt-0.5 text-[11px] text-sand-500",
+					children: item.help
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 221,
+					columnNumber: 25
+				}, this)]
+			}, void 0, true, {
+				fileName: _jsxFileName$1,
+				lineNumber: 208,
+				columnNumber: 9
+			}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "flex items-center gap-1.5 shrink-0",
+				children: [
+					item.kind === "boolean" && /* @__PURE__ */ (void 0)(Toggle, {
+						on: value === "true",
+						disabled: pending,
+						onChange: (next) => void commit(String(next))
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 227,
+						columnNumber: 13
+					}, this),
+					item.kind === "preset" && /* @__PURE__ */ (void 0)(PresetGroup, {
+						value,
+						presets: item.presets,
+						disabled: pending,
+						onChange: (next) => void commit(next)
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 235,
+						columnNumber: 13
+					}, this),
+					(item.kind === "integer" || item.kind === "number") && /* @__PURE__ */ (void 0)(Stepper, {
+						value,
+						min: item.min,
+						max: item.max,
+						step: item.kind === "integer" ? 1 : .5,
+						disabled: pending,
+						onChange: setDraft
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 244,
+						columnNumber: 13
+					}, this),
+					(item.kind === "string" || isSecret) && /* @__PURE__ */ (void 0)("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ (void 0)("input", {
+							value: isSecret && !revealed ? maskValue(value) : value,
+							onChange: (e) => setDraft(e.target.value),
+							onFocus: () => isSecret && setRevealed(true),
+							disabled: pending,
+							className: `w-48 sm:w-64 rounded-lg border border-sand-200/80 bg-white py-1.5 pl-2.5 text-[12px] text-sand-800 focus:outline-none focus:border-sienna-300 ${isSecret ? "pr-8 font-mono" : "pr-2.5"}`
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 256,
+							columnNumber: 15
+						}, this), isSecret && /* @__PURE__ */ (void 0)("button", {
+							type: "button",
+							"aria-label": revealed ? "값 숨기기" : "값 보기",
+							onClick: () => setRevealed((r) => !r),
+							className: "absolute right-1.5 top-1/2 -translate-y-1/2 size-6 grid place-items-center text-sand-400 hover:text-sand-600 transition-colors duration-150",
+							children: revealed ? /* @__PURE__ */ (void 0)(lucideEyeOff, { className: "size-3.5" }, void 0, false, {
+								fileName: _jsxFileName$1,
+								lineNumber: 273,
+								columnNumber: 21
+							}, this) : /* @__PURE__ */ (void 0)(lucideEye, { className: "size-3.5" }, void 0, false, {
+								fileName: _jsxFileName$1,
+								lineNumber: 275,
+								columnNumber: 21
+							}, this)
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 266,
+							columnNumber: 17
+						}, this)]
+					}, void 0, true, {
+						fileName: _jsxFileName$1,
+						lineNumber: 255,
+						columnNumber: 13
+					}, this),
+					dirty && /* @__PURE__ */ (void 0)("button", {
+						type: "button",
+						onClick: () => void commit(value),
+						disabled: pending,
+						className: "px-2.5 py-1.5 text-[11px] font-medium rounded-lg bg-sienna-400 text-white hover:bg-sienna-500 disabled:opacity-50 transition-colors duration-150",
+						children: updateMutation.isPending ? "저장 중" : "저장"
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 283,
+						columnNumber: 13
+					}, this),
+					!dirty && item.source === "db" && /* @__PURE__ */ (void 0)("button", {
+						type: "button",
+						title: "저장값을 지웁니다 — 환경변수 또는 기본값으로 돌아갑니다",
+						onClick: () => void reset(),
+						disabled: pending,
+						className: "size-7 grid place-items-center rounded-lg text-sand-400 hover:text-sand-600 hover:bg-sand-100 disabled:opacity-50 transition-colors duration-150",
+						children: /* @__PURE__ */ (void 0)(lucideRotateCcw, { className: "size-3.5" }, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 302,
+							columnNumber: 15
+						}, this)
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 295,
+						columnNumber: 13
+					}, this)
+				]
+			}, void 0, true, {
+				fileName: _jsxFileName$1,
+				lineNumber: 224,
+				columnNumber: 9
+			}, this)]
+		}, void 0, true, {
+			fileName: _jsxFileName$1,
+			lineNumber: 207,
+			columnNumber: 7
+		}, this), error && /* @__PURE__ */ (void 0)("p", {
+			className: "mt-1.5 text-[11px] text-red-500",
+			children: error
+		}, void 0, false, {
+			fileName: _jsxFileName$1,
+			lineNumber: 308,
+			columnNumber: 17
+		}, this)]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 206,
+		columnNumber: 5
+	}, this);
+}
+function KeepaliveTokenSettings({ runnerEnabled }) {
+	const queryClient = useQueryClient();
+	const [error, setError] = (0, import_react.useState)(null);
+	const tokensQuery = TokenService.useTokens("A", {
+		orderBy: "ord-asc",
+		num: 100
+	});
+	const updateMutation = useUpdateTokenMutation();
+	const anthropicTokens = (tokensQuery.data?.rows ?? []).filter((token) => token.provider === "anthropic");
+	const toggle = async (id, keepaliveEnabled) => {
+		setError(null);
+		try {
+			await updateMutation.mutateAsync({
+				id,
+				keepaliveEnabled
+			});
+			await queryClient.invalidateQueries({ queryKey: ["Token", "getTokens"] });
+		} catch (cause) {
+			setError(cause instanceof Error ? cause.message : String(cause));
+		}
+	};
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "border-t border-sand-100/80 bg-sand-50/40 px-4 py-3 sm:px-5",
+		children: [
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "mb-2 flex items-center justify-between gap-3",
+				children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", { children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+					className: "text-[11px] font-medium text-sand-600",
+					children: "토큰별 keepalive"
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 338,
+					columnNumber: 11
+				}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+					className: "mt-0.5 text-[10px] text-sand-400",
+					children: runnerEnabled ? "켜진 활성 Anthropic 토큰만 5시간 윈도우를 유지합니다" : "이 인스턴스는 keepalive runner로 지정되지 않았습니다"
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 339,
+					columnNumber: 11
+				}, this)] }, void 0, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 337,
+					columnNumber: 9
+				}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+					className: `shrink-0 rounded px-1.5 py-0.5 text-[10px] ${runnerEnabled ? "bg-sage-50 text-sage-600" : "bg-sand-100 text-sand-500"}`,
+					children: runnerEnabled ? "runner" : "실행 안 함"
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 345,
+					columnNumber: 9
+				}, this)]
+			}, void 0, true, {
+				fileName: _jsxFileName$1,
+				lineNumber: 336,
+				columnNumber: 7
+			}, this),
+			tokensQuery.isLoading ? /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+				className: "py-2 text-[11px] text-sand-400",
+				children: "토큰을 불러오는 중…"
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 355,
+				columnNumber: 9
+			}, this) : anthropicTokens.length === 0 ? /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+				className: "py-2 text-[11px] text-sand-400",
+				children: "등록된 Anthropic 토큰이 없습니다"
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 357,
+				columnNumber: 9
+			}, this) : /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "overflow-hidden rounded-lg border border-sand-200/70 bg-white",
+				children: anthropicTokens.map((token) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "flex items-center justify-between gap-4 border-b border-sand-100/80 px-3 py-2 last:border-b-0",
+					children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+							className: "block truncate text-[12px] text-sand-700",
+							children: token.name
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 366,
+							columnNumber: 17
+						}, this), !token.active && /* @__PURE__ */ (void 0)("span", {
+							className: "text-[10px] text-sand-400",
+							children: "토큰 비활성"
+						}, void 0, false, {
+							fileName: _jsxFileName$1,
+							lineNumber: 367,
+							columnNumber: 35
+						}, this)]
+					}, void 0, true, {
+						fileName: _jsxFileName$1,
+						lineNumber: 365,
+						columnNumber: 15
+					}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(Toggle, {
+						on: token.keepalive_enabled,
+						disabled: !runnerEnabled || updateMutation.isPending,
+						onChange: (next) => void toggle(token.id, next)
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 369,
+						columnNumber: 15
+					}, this)]
+				}, token.id, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 361,
+					columnNumber: 13
+				}, this))
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 359,
+				columnNumber: 9
+			}, this),
+			error && /* @__PURE__ */ (void 0)("p", {
+				className: "mt-2 text-[11px] text-red-500",
+				children: error
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 378,
+				columnNumber: 17
+			}, this)
+		]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 335,
+		columnNumber: 5
+	}, this);
+}
+/** 만료 알림을 주기를 기다리지 않고 지금 보낸다. 설정이 제대로 붙었는지 확인하는 용도. */
+function TriggerReminderButton() {
+	const [result, setResult] = (0, import_react.useState)(null);
+	const mutation = SettingService.useTriggerExpiryReminderMutation();
+	const trigger = async () => {
+		setResult(null);
+		try {
+			const { sent } = await mutation.mutateAsync();
+			setResult(sent === 0 ? "재로그인이 필요한 토큰이 없습니다" : `${sent}건 발송`);
+		} catch (e) {
+			setResult(e instanceof Error ? e.message : String(e));
+		}
+	};
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "flex items-center gap-2",
+		children: [result && /* @__PURE__ */ (void 0)("span", {
+			className: "text-[11px] text-sand-500",
+			children: result
+		}, void 0, false, {
+			fileName: _jsxFileName$1,
+			lineNumber: 402,
+			columnNumber: 18
+		}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+			type: "button",
+			onClick: () => void trigger(),
+			disabled: mutation.isPending,
+			className: "px-2 py-1 text-[11px] rounded-lg border border-sand-200/80 text-sand-600 hover:bg-sand-100 disabled:opacity-50 transition-colors duration-150",
+			children: mutation.isPending ? "보내는 중" : "지금 보내기"
+		}, void 0, false, {
+			fileName: _jsxFileName$1,
+			lineNumber: 403,
+			columnNumber: 7
+		}, this)]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 401,
+		columnNumber: 5
+	}, this);
+}
+function SettingsPanel() {
+	const settingsQuery = SettingService.useSettingList();
+	const { data, isLoading } = settingsQuery;
+	if (isLoading) return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "space-y-4",
+		children: [0, 1].map((i) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+			className: "panel overflow-hidden",
+			children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "panel-header px-4 py-2.5 sm:px-5",
+				children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", { className: "h-3 w-24 rounded bg-sand-200 animate-pulse" }, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 425,
+					columnNumber: 15
+				}, this)
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 424,
+				columnNumber: 13
+			}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "divide-y divide-sand-100/80",
+				children: [
+					0,
+					1,
+					2
+				].map((j) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "px-4 py-3 sm:px-5 flex items-center justify-between gap-4",
+					children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", { className: "h-3 w-40 rounded bg-sand-100 animate-pulse" }, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 430,
+						columnNumber: 19
+					}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", { className: "h-7 w-24 rounded-lg bg-sand-100 animate-pulse" }, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 431,
+						columnNumber: 19
+					}, this)]
+				}, j, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 429,
+					columnNumber: 17
+				}, this))
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 427,
+				columnNumber: 13
+			}, this)]
+		}, i, true, {
+			fileName: _jsxFileName$1,
+			lineNumber: 423,
+			columnNumber: 11
+		}, this))
+	}, void 0, false, {
+		fileName: _jsxFileName$1,
+		lineNumber: 421,
+		columnNumber: 7
+	}, this);
+	if (settingsQuery.isError && !data) return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "panel px-5 py-6 text-center",
+		children: [
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+				className: "text-[13px] font-medium text-sand-800",
+				children: "설정을 불러오지 못했습니다"
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 444,
+				columnNumber: 9
+			}, this),
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("p", {
+				className: "mt-1 text-[11px] text-red-500",
+				children: settingsQuery.error.message
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 445,
+				columnNumber: 9
+			}, this),
+			/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("button", {
+				type: "button",
+				onClick: () => void settingsQuery.refetch(),
+				disabled: settingsQuery.isFetching,
+				className: "mt-3 px-3 py-1.5 text-[12px] rounded-lg border border-sand-200 text-sand-600 hover:bg-sand-100 disabled:opacity-50",
+				children: settingsQuery.isFetching ? "다시 불러오는 중" : "다시 시도"
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 446,
+				columnNumber: 9
+			}, this)
+		]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 443,
+		columnNumber: 7
+	}, this);
+	const settings = data?.settings ?? [];
+	const runtime = data?.runtime ?? [];
+	const groups = [...new Set(settings.map((s) => s.group))];
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "space-y-4",
+		children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+			className: "panel overflow-hidden",
+			children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "panel-header flex items-center justify-between px-4 py-2.5 sm:px-5",
+				children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+					className: "text-[13px] font-medium text-sand-700",
+					children: "환경"
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 466,
+					columnNumber: 11
+				}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+					className: "text-[11px] text-sand-400",
+					children: "기동 시점 값"
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 467,
+					columnNumber: 11
+				}, this)]
+			}, void 0, true, {
+				fileName: _jsxFileName$1,
+				lineNumber: 465,
+				columnNumber: 9
+			}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("dl", {
+				className: "px-4 py-3 sm:px-5 grid grid-cols-1 sm:grid-cols-2 gap-x-8 gap-y-1.5",
+				children: runtime.map((info) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "flex items-baseline justify-between gap-3 min-w-0",
+					children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("dt", {
+						className: "text-[11px] text-sand-500 shrink-0",
+						children: info.label
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 472,
+						columnNumber: 15
+					}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("dd", {
+						className: "text-[12px] font-mono text-sand-700 truncate",
+						children: info.value
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 473,
+						columnNumber: 15
+					}, this)]
+				}, info.label, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 471,
+					columnNumber: 13
+				}, this))
+			}, void 0, false, {
+				fileName: _jsxFileName$1,
+				lineNumber: 469,
+				columnNumber: 9
+			}, this)]
+		}, void 0, true, {
+			fileName: _jsxFileName$1,
+			lineNumber: 464,
+			columnNumber: 7
+		}, this), groups.map((group) => {
+			const items = settings.filter((s) => s.group === group);
+			return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+				className: "panel overflow-hidden",
+				children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "panel-header flex items-center justify-between px-4 py-2.5 sm:px-5",
+					children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("span", {
+						className: "text-[13px] font-medium text-sand-700",
+						children: GROUP_LABELS.get(group) ?? group
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 485,
+						columnNumber: 15
+					}, this), group === "slack" && /* @__PURE__ */ (void 0)(TriggerReminderButton, {}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 488,
+						columnNumber: 37
+					}, this)]
+				}, void 0, true, {
+					fileName: _jsxFileName$1,
+					lineNumber: 484,
+					columnNumber: 13
+				}, this), /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+					className: "divide-y divide-sand-100/80",
+					children: items.map((item) => /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", { children: [/* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(SettingRow, {
+						item,
+						disabled: item.key === "qgrid.tokenWindowKeepaliveEnabled" && !data?.keepaliveRunnerEnabled
+					}, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 493,
+						columnNumber: 19
+					}, this), item.key === "qgrid.tokenWindowKeepaliveEnabled" && /* @__PURE__ */ (void 0)(KeepaliveTokenSettings, { runnerEnabled: data?.keepaliveRunnerEnabled ?? false }, void 0, false, {
+						fileName: _jsxFileName$1,
+						lineNumber: 501,
+						columnNumber: 21
+					}, this)] }, item.key, true, {
+						fileName: _jsxFileName$1,
+						lineNumber: 492,
+						columnNumber: 17
+					}, this))
+				}, void 0, false, {
+					fileName: _jsxFileName$1,
+					lineNumber: 490,
+					columnNumber: 13
+				}, this)]
+			}, group, true, {
+				fileName: _jsxFileName$1,
+				lineNumber: 483,
+				columnNumber: 11
+			}, this);
+		})]
+	}, void 0, true, {
+		fileName: _jsxFileName$1,
+		lineNumber: 463,
+		columnNumber: 5
+	}, this);
+}
+//#endregion
+//#region src/routes/settings.tsx?tsr-split=component
+var _jsxFileName = "/home/runner/work/qgrid/qgrid/packages/web/src/routes/settings.tsx?tsr-split=component";
+function SettingsPage() {
+	return /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)("div", {
+		className: "max-w-4xl mx-auto",
+		children: /* @__PURE__ */ (0, import_jsx_dev_runtime.jsxDEV)(SettingsPanel, {}, void 0, false, {
+			fileName: _jsxFileName,
+			lineNumber: 4,
+			columnNumber: 7
+		}, this)
+	}, void 0, false, {
+		fileName: _jsxFileName,
+		lineNumber: 3,
+		columnNumber: 10
+	}, this);
+}
+//#endregion
+export { SettingsPage as component };