Neru_Han/checkflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(i18n,admin): modular localization dictionary & admin console demo preview
Build and Push Docker Image / build-and-push (push) Successful in 13m7s
Details

Browse Source
This commit is contained in:
Neru_Han
2026-08-21 20:00:01 +09:00
parent 94217d773d
commit 04fef885a8
12 changed files with 881 additions and 612 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/settings/SettingsModal.tsx
+70 -9
View File
@@ -8,7 +8,7 @@ import { useUserPrefs } from "@/lib/useUserPrefs";
interface SettingsModalProps {
isOpen: boolean;
onClose: () => void;
user: { id: string; name?: string | null; email?: string | null };
user: { id: string; name?: string | null; email?: string | null; role?: string | null };
isDemo?: boolean;
}
@@ -125,7 +125,7 @@ function PrefSlider({
);
}
export function SettingsModal({ isOpen, onClose, user, isDemo: _isDemo = false }: SettingsModalProps) {
export function SettingsModal({ isOpen, onClose, user, isDemo = false }: SettingsModalProps) {
const { t, lang, setLang } = useI18n();
const { theme, toggleTheme } = useTheme();
const { prefs, updatePrefs, resetToDefaults } = useUserPrefs();
@@ -660,13 +660,74 @@ export function SettingsModal({ isOpen, onClose, user, isDemo: _isDemo = false }
{/* Tab 4: Admin Quick Access */}
{activeTab === "admin" && (
<div className="settings-tab-content">
<h3 style={{ fontSize: 14, fontWeight: 700, marginBottom: 8 }}>👑 Multi-User Admin Console</h3>
<p style={{ fontSize: 13, color: "var(--text-secondary)", marginBottom: 14 }}>
Manage registered users, user roles (User/Admin), system statistics, and storage allocations.
</p>
<a href="/admin" className="btn btn-primary" style={{ display: "inline-flex", alignItems: "center", gap: 8 }}>
🚀 Open Admin Dashboard →
</a>
<div style={{ display: "flex", alignItems: "center", gap: 10, marginBottom: 12 }}>
<span style={{ fontSize: 24 }}>👑</span>
<div>
<h3 style={{ fontSize: 15, fontWeight: 700, margin: 0 }}>
{t("admin") || "Admin Console"}
</h3>
<p style={{ fontSize: 12, color: "var(--text-tertiary)", margin: "2px 0 0" }}>
Multi-user administration, account control, and system telemetry
</p>
</div>
</div>
<div
style={{
background: "var(--bg-secondary)",
borderRadius: "var(--radius-md)",
padding: 16,
border: "1px solid var(--border)",
marginBottom: 16,
fontSize: 13,
lineHeight: 1.6,
}}
>
<div style={{ display: "flex", justifyContent: "space-between", marginBottom: 10, flexWrap: "wrap", gap: 8 }}>
<div>
<strong style={{ color: "var(--text-primary)" }}>Current Account:</strong>{" "}
<code style={{ background: "var(--bg-primary)", padding: "2px 6px", borderRadius: 4, border: "1px solid var(--border)" }}>
{user.email || "demo@checkflow.local"}
</code>
</div>
<div>
<span
style={{
padding: "2px 8px",
borderRadius: "var(--radius-sm)",
fontSize: 11,
fontWeight: 700,
background: "rgba(75, 123, 245, 0.15)",
color: "var(--accent)",
border: "1px solid var(--border)",
}}
>
{user.role || (isDemo ? "DEMO_ADMIN" : "USER")}
</span>
</div>
</div>
<div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10, marginTop: 12 }}>
<div style={{ background: "var(--bg-primary)", padding: "10px 12px", borderRadius: "var(--radius-sm)", border: "1px solid var(--border)" }}>
<div style={{ fontSize: 11, color: "var(--text-tertiary)" }}>Isolation Mode</div>
<div style={{ fontSize: 13, fontWeight: 600, marginTop: 2, color: "var(--success)" }}>● Multi-User Privacy</div>
</div>
<div style={{ background: "var(--bg-primary)", padding: "10px 12px", borderRadius: "var(--radius-sm)", border: "1px solid var(--border)" }}>
<div style={{ fontSize: 11, color: "var(--text-tertiary)" }}>CalDAV Endpoint</div>
<div style={{ fontSize: 13, fontWeight: 600, marginTop: 2, color: "var(--accent)" }}>● Active / Enabled</div>
</div>
</div>
</div>
<div style={{ display: "flex", gap: 10 }}>
<a
href="/admin"
className="btn btn-primary"
style={{ display: "inline-flex", alignItems: "center", gap: 8, textDecoration: "none" }}
>
🚀 Open Admin Dashboard →
</a>
</div>
</div>
)}
</div>