260707_1_대시보드정리 1차

A00_Common/app_shell.ts

@@ -12,6 +12,8 @@ import { createButton } from "@ui/ui_template_elements";
 import { THEME_STORAGE_KEY, LANG_STORAGE_KEY, ROUTES } from "@config/config_frontend";
 import { navigateTo, isAuthenticated } from "./router";
 
+const BRAND_ICON_URL = new URL("../resources/prog_icon.jpg", import.meta.url).href;
+
 /** locale 헬퍼: 현재 언어 인덱스로 문구 반환 */
 function L(key: keyof typeof ui_locales): string {
   return ui_locales[key][currentLanguageIndex];
@@ -67,7 +69,14 @@ function buildHeader(): HTMLElement {
   const brand = document.createElement("button");
   brand.className = "app-brand";
   brand.type = "button";
-  brand.textContent = L("App_BrandName");
+  const brandIcon = document.createElement("img");
+  brandIcon.className = "app-brand__icon";
+  brandIcon.src = BRAND_ICON_URL;
+  brandIcon.alt = "";
+  const brandName = document.createElement("span");
+  brandName.className = "app-brand__name";
+  brandName.textContent = L("App_BrandName");
+  brand.append(brandIcon, brandName);
   brand.addEventListener("click", () => navigateTo(ROUTES.A01_HOME));
 
   // 네비게이션 링크
@@ -120,9 +129,11 @@ async function fillAuthActions(slot: HTMLElement): Promise<void> {
   const loggedIn = await isAuthenticated();
   slot.innerHTML = "";
   if (loggedIn) {
+    const { fetchSessionUser } = await import("../A06_Login/A06_Login_Api_Fetch");
+    const user = await fetchSessionUser();
     slot.append(
       createButton({
-        label: L("Nav_MyAccount"),
+        label: user?.name?.trim() || L("Nav_MyAccount"),
         variant: "ghost",
         onClick: () => navigateTo(ROUTES.B01_ACCOUNT),
       }),
@@ -188,6 +199,9 @@ const SHELL_CSS = `
   z-index: var(--z-header);
 }
 .app-brand {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--spacing-8);
   font-family: var(--font-display);
   font-size: var(--text-subheading);
   font-weight: var(--font-weight-medium);
@@ -197,6 +211,15 @@ const SHELL_CSS = `
   cursor: pointer;
   padding: 0;
 }
+.app-brand__icon {
+  width: 32px;
+  height: 32px;
+  object-fit: cover;
+  border-radius: var(--radius-icons);
+}
+.app-brand__name {
+  line-height: 1;
+}
 .app-nav {
   display: flex;
   gap: var(--spacing-4);