refactor(config): lift the tool-agnostic config modals out of CcConfig

Moves FileViewer, EditorModal, ConfirmDeleteModal, ToastNotice, MdItemList,
ScopeBadge, and the shared atoms (Empty/SkeletonRows/CopyButton/formatBytes)
into client/src/components/config/ so the upcoming Codex config panel can
reuse them. EditorModal now takes a fetchContent callback instead of calling
api.ccConfig.file itself; CcConfig.tsx supplies the Claude-specific fetcher.
The moved EditorState/ConfirmDeleteState type field widens from
CcArtifactType to string so non-Claude callers can use them too, with a cast
at the two remaining Claude-specific call sites in CcConfig.tsx.

client/src/components/config/ScopeBadge.tsx

@@ -0,0 +1,32 @@
+/**
+ * @file ScopeBadge.tsx
+ * @description Small colored badge for a config artifact's scope (user /
+ * project / project-local). Tool-agnostic — takes a plain string so it works
+ * for Claude Code and Codex scopes alike.
+ * @author Nguyễn Ngọc Trí Vĩ <vinnt@smartgift.vn>
+ */
+
+import { useTranslation } from "react-i18next";
+
+export function ScopeBadge({ scope }: { scope: string }) {
+  const { t } = useTranslation("ccConfig");
+  const color =
+    scope === "user"
+      ? "bg-sky-500/10 text-sky-300 border-sky-500/30"
+      : scope === "project"
+        ? "bg-status-success/10 text-status-success border-status-success/30"
+        : scope === "project-local"
+          ? "bg-violet-500/10 text-violet-300 border-violet-500/30"
+          : "bg-surface-3 text-fg-secondary border-border";
+  const label =
+    scope === "project-local"
+      ? t("scope.projectLocal")
+      : scope === "user"
+        ? t("scope.user")
+        : scope === "project"
+          ? t("scope.project")
+          : scope;
+  return (
+    <span className={`text-[10px] font-mono px-1.5 py-0.5 rounded border ${color}`}>{label}</span>
+  );
+}