// Storybook fixture for SWHomeMenu: the Figma 26:10591 sample menu (rj6wpsfk24lOWvWiVRAANP).
// Texts, icons and ids are sample data only; the package ships no menu items or icons.
import type { ReactNode } from "react"
import type { SWFileEntry, SWHomeMenuSectionData } from "@hm-design/sw"
import monitorA from "./assets/home-menu/file-open-monitor-a.svg"
import monitorB from "./assets/home-menu/file-open-monitor-b.svg"
import save from "./assets/home-menu/save.svg"
import saveHover from "./assets/home-menu/save-hover.svg"
import saveAs from "./assets/home-menu/save-as.svg"
import saveAsHover from "./assets/home-menu/save-as-hover.svg"
import exportIcon from "./assets/home-menu/export.svg"
import exportHover from "./assets/home-menu/export-hover.svg"
import bundle from "./assets/home-menu/bundle.svg"
import bundleHover from "./assets/home-menu/bundle-hover.svg"
import findOpen from "./assets/home-menu/find-open.svg"
import findOpenHover from "./assets/home-menu/find-open-hover.svg"
import recent from "./assets/home-menu/recent.svg"
import recentHover from "./assets/home-menu/recent-hover.svg"
import newFile from "./assets/home-menu/new-file.svg"
import newFileHover from "./assets/home-menu/new-file-hover.svg"
import recover from "./assets/home-menu/recover.svg"
import recoverHover from "./assets/home-menu/recover-hover.svg"
import tempFile from "./assets/home-menu/temp-file.svg"
import tempFileHover from "./assets/home-menu/temp-file-hover.svg"
import display from "./assets/home-menu/display.svg"
import displayHover from "./assets/home-menu/display-hover.svg"
import settingSave from "./assets/home-menu/setting-save.svg"
import settingSaveHover from "./assets/home-menu/setting-save-hover.svg"
import settingLoad from "./assets/home-menu/setting-load.svg"
import settingLoadHover from "./assets/home-menu/setting-load-hover.svg"
import help from "./assets/home-menu/help.svg"
import helpHover from "./assets/home-menu/help-hover.svg"
import inquiry from "./assets/home-menu/inquiry.svg"
import inquiryHover from "./assets/home-menu/inquiry-hover.svg"
import swInfo from "./assets/home-menu/sw-info.svg"
import swInfoHover from "./assets/home-menu/sw-info-hover.svg"

/**
 * Figma icon asset (SVG with its own shadow margin). `dx` / `dy` move it from the centered position in the
 * 18px slot to its Figma position (measured from each tile's icon frame and asset inset, 2026-10-19).
 */
function figmaIcon(src: string, width: number, height: number, dx = 0, dy = 0) {
  return <img src={src} alt="" width={width} height={height} style={dx || dy ? { transform: `translate(${dx}px, ${dy}px)` } : undefined} />
}
function pair(defaultSrc: string, hoverSrc: string, width: number, height: number, dx = 0, dy = 0) {
  return { icon: figmaIcon(defaultSrc, width, height, dx, dy), hoverIcon: figmaIcon(hoverSrc, width, height, dx, dy) }
}

/** Figma node of each tile component set, for the 22-node checklist. */
export const figmaTileNodes: Record<string, string> = {
  save: "26:11355", "save-as": "26:11371", export: "26:11387", bundle: "26:11403",
  "find-open": "26:11416", recent: "26:11450", "new-file": "26:11485",
  recover: "26:11507", "temp-file": "26:11529",
  display: "26:11542", "setting-save": "26:11558", "setting-load": "26:11586",
  help: "26:11599", inquiry: "26:11615", "sw-info": "26:11631",
}
export const figmaTitleNodes: Record<string, string> = {
  working: "26:12604", open: "26:12610", damaged: "26:12622", setting: "26:12628 (참고)", help: "26:12616",
}

export const figmaHomeMenuSections: SWHomeMenuSectionData[] = [
  { id: "working", title: "작업중인 파일", items: [
    { id: "save", label: "저장", ...pair(save, saveHover, 21.5, 21.5, -0.25, -0.25) },
    { id: "save-as", label: "복사저장", ...pair(saveAs, saveAsHover, 23.3, 23, 0, 0.5) },
    { id: "export", label: "내보내기", ...pair(exportIcon, exportHover, 22.52, 23.2775, 0, 0.64) },
    { id: "bundle", label: "도면묶기", ...pair(bundle, bundleHover, 23, 22) },
  ] },
  { id: "open", title: "다른파일 열기", items: [
    { id: "find-open", label: "찾아열기", ...pair(findOpen, findOpenHover, 24.6989, 20, -0.15, -1) },
    { id: "recent", label: "최근파일", ...pair(recent, recentHover, 22, 24.5, 1, 1.25) },
    { id: "new-file", label: "새파일", ...pair(newFile, newFileHover, 20, 23) },
  ] },
  { id: "damaged", title: "파일 손상시", items: [
    { id: "recover", label: "복구하기", ...pair(recover, recoverHover, 21, 22.3601, 0, -0.5) },
    { id: "temp-file", label: "임시파일", ...pair(tempFile, tempFileHover, 22.25, 24.5, 0.125, 0.25) },
  ] },
  { id: "setting", title: "My Setting", items: [
    { id: "display", label: "Display...", ...pair(display, displayHover, 24, 22, 1, 2) },
    { id: "setting-save", label: "저장하기", ...pair(settingSave, settingSaveHover, 24.3087, 24.5, 1.15, 1.25) },
    { id: "setting-load", label: "불러오기", ...pair(settingLoad, settingLoadHover, 18, 18, 1, 0) },
  ] },
  { id: "help", title: "궁금하면", items: [
    { id: "help", label: "설명보기", ...pair(help, helpHover, 18, 18, 1, 0) },
    { id: "inquiry", label: "문의하기", ...pair(inquiry, inquiryHover, 23, 23, 1, 0.5) },
    { id: "sw-info", label: "S/W정보", ...pair(swInfo, swInfoHover, 21.5, 20, 0.75, 0) },
  ] },
]

export const figmaHomeMenuItemIds = figmaHomeMenuSections.flatMap(section => section.items.map(item => item.id))

// Figma 최근파일 662:67331 sample rows (15) and the 2-depth preview 662:67471 (sample data only; 2026-10-21: the preview shows the hovered file name over an empty black body).
const recentNames = [
  ["001-연결종합 계획평면도.dwg", "a"], ["03.암발파공법적용도_231011.grm", "b"], ["1.배수공-일반사항_231004.dwg", "b"],
  ["00.시공상세도 분석 및 목차_20240416.grm"], ["0_목차.dwg"], ["001-연결종합 계획평면도22222222.dwg"], ["03.암발파공법적용도_231011.grm"],
  ["001-연결종합 계획평면도22222222.dwg"], ["03.암발파공법적용도_231011.grm"], ["0_목차.dwg"], ["00.시공상세도 분석 및 목차_20240416.grm"],
  ["001-연결종합 계획평면도22222222.dwg"], ["03.암발파공법적용도_231011.grm"], ["0_목차.dwg"], ["00.시공상세도 분석 및 목차_20240416.grm"],
] as const
const monitor = { a: monitorA, b: monitorB }
export const figmaRecentFiles: SWFileEntry[] = recentNames.map(([name, badge], index) => ({
  id: `recent-${index + 1}`,
  name,
  // Full folder (the list cuts it with CSS ellipsis); the preview shows this folder + the file name (2026-10-21).
  path: "Z:\\01.기술개발센터\\04_그리미시스템\\Design\\도면",
  badge: badge ? <img src={monitor[badge]} alt="" width={37} height={32} style={{ transform: "translateY(-2px)" }} /> : undefined,
}))

/** The Figma menu with the optional 최근파일 sub panel attached to the 최근파일 tile. */
export function withRecentFiles(sections: readonly SWHomeMenuSectionData[], panel: ReactNode): SWHomeMenuSectionData[] {
  return sections.map(section => ({ ...section, items: section.items.map(item => item.id === "recent" ? { ...item, panel, panelLabel: "최근파일" } : item) }))
}