LG Shield

export type ExpandedRouteConfigEntry = Omit<RouteConfigEntry, "children" | "id"> & {
  id: ROUTE_IDS;
  label?: string;        // 메뉴와 브레드크럼에 쓰는 이름
  menu?: boolean;        // 사이드바에 표시할지
  description?: string;  // 화면 상단 설명
  children?: ExpandedRouteConfigEntry[];
};

export const ROUTES: ExpandedRouteConfigEntry[] = [
  {
    id: ROUTE_IDS.LAYOUT_DEFAULT, file: "../layouts/layout-default.tsx",
    children: [{
      id: ROUTE_IDS.LAYOUT_BREADCRUMB, file: "../layouts/layout-breadcrumb.tsx",
      children: [{
        id: ROUTE_IDS.NEWS_ROOM_MANAGE_LAYOUT, label: "뉴스룸 관리", path: "news-room-manage", menu: true,
        children: [
          { id: ROUTE_IDS.LATEST_NEWS_PAGE, label: "최신 소식", path: "latest-news", menu: true, description: "뉴스룸 > 최신 소식에 노출되는 게시물을 관리하실 수 있습니다." },
          { id: ROUTE_IDS.LATEST_NEWS_DETAIL_PAGE, label: "최신 소식 상세", path: "latest-news/:id" },
        ],
      }],
    }],
  },
];

// 경로 문자열 대신 id로 찾는다. 트리를 재귀로 내려가며 부모 경로를 합친다
export const getPathById = (pathId: ROUTE_IDS): string => {
  const search = (routes: ExpandedRouteConfigEntry[], basePath: string): string | undefined => {
    for (const route of routes) {
      const currentPath = route.path ? joinRoutePath(basePath, route.path, route.index) : basePath;
      if (route.id === pathId) return currentPath;
      const found = route.children && search(route.children, currentPath);
      if (found) return found;
    }
  };
  const result = search(ROUTES, "/");
  if (result === undefined) throw new Error(`Route with id "${pathId}" not found.`);
  return result;
};

// 쿼리스트링 - 필터
const [qsFilters, setQsFilters] = useQueryStates({
  visible: parseAsBoolean,
  categoryId: parseAsInteger,
  createdStartDate: parseAsString,
  createdEndDate: parseAsString,
  visibleStartDate: parseAsString,
  visibleEndDate: parseAsString,
  searchOption: parseAsStringEnum<SEARCH_OPTION>(_.values(SEARCH_OPTION)),
  searchKeyword: parseAsString,
});
// 쿼리스트링 - 페이지네이션
const [qsPagination, setQsPagination] = useQueryStates({
  page: parseAsInteger.withDefault(1),
  size: parseAsInteger.withDefault(10),
});
// 상세에서 돌아오면 history state에 실어 둔 조건을 URL로 되돌린다
useEffect(() => {
  if (location.state) {
    setQsFilters({ ..._.omit(location.state, ["page", "size"]) });
    setQsPagination({ ..._.pick(location.state, ["page", "size"]) });
  }
}, []);
// 같은 조건이 그대로 조회 키다
const { data } = useQuery({
  queryKey: apiNewsrooms.searchNewsrooms.key({ type: "NEWS", ...qsFilters, ...qsPagination }),
  queryFn: () => apiNewsrooms.searchNewsrooms.fetch({ type: "NEWS", ...qsFilters, ...qsPagination }),
});
// 상세로 갈 때 현재 조건을 같이 보낸다
navigate(generatePath(getPathById(ROUTE_IDS.LATEST_NEWS_DETAIL_PAGE), { id: data.key }), { state: { ...qsFilters, ...qsPagination } });

handlers: {
  image: async () => {
    const input = document.createElement("input");
    input.setAttribute("type", "file");
    input.setAttribute("accept", "image/*");
    input.click();
    input.addEventListener("change", async () => {
      const file = input.files?.[0];
      if (!file) return;
      // 영역별 presigned URL을 받아 S3에 직접 올리고 CDN 주소만 본문에 넣는다
      const presignedData = await mutationRequestPresignedUrl.mutateAsync({ type: presignedType, fileName: file.name });
      await mutationUploadFile.mutateAsync({ presignedUrl: presignedData.presignedUrl, file });
      const range = editorRef.current?.getSelection();
      if (!editorRef.current || !range) return;
      editorRef.current.insertEmbed(range.index, "image", presignedData.cdnUrl);
      editorRef.current.insertText(range.index + 1, "\n");
      editorRef.current.setSelection(range.index + 2, 0);
    });
  },
},

export default function middleware(request: NextRequest) {
  const pathname = request.nextUrl.pathname;
  // 크롤러 파일은 locale 리다이렉트에서 뺀다. 오픈 뒤 robots.txt가 리다이렉트되던 문제의 수정
  if (pathname === "/robots.txt" || pathname === "/sitemap.xml" || pathname === "/sitemap-0.xml") return NextResponse.next();
  const staticPaths = ["/_next/static", "/favicon.ico", "/images", "/js", "/lib"];
  if (staticPaths.some((path) => pathname.startsWith(path))) return NextResponse.next();

  const locale = pathname.split("/").filter(Boolean)[0];
  if (!locale || !supportedLocales.includes(locale)) {
    const acceptLanguage = request.headers.get("accept-language");
    const detectedLocale = acceptLanguage ? detectLocale(acceptLanguage, supportedLocales, defaultLocale) : defaultLocale;
    return NextResponse.redirect(new URL(`/${detectedLocale}${pathname}`, request.url));
  }
  return intlMiddleware(request);
}

// Accept-Language의 q 값 순서대로 지원 언어를 고른다
function detectLocale(acceptLanguage: string, supportedLocales: string[], defaultLocale: string) {
  const languages = acceptLanguage.split(",")
    .map((lang) => { const [locale, quality] = lang.split(";q="); return { locale: locale.trim(), quality: Number.parseFloat(quality) || 1.0 }; })
    .sort((a, b) => b.quality - a.quality);
  return languages.find((lang) => supportedLocales.includes(lang.locale))?.locale ?? defaultLocale;
}

set -e
profile=$(echo "$1" | tr '[:upper:]' '[:lower:]')   # dev | prod
case "$profile" in
  dev)  COMPOSE_FILE="dev.compose.yml";  IMAGE_SUFFIX="-dev";  DOCKERFILE="docker/dev.dockerfile" ;;
  prod) COMPOSE_FILE="prod.compose.yml"; IMAGE_SUFFIX="-prod"; DOCKERFILE="docker/prod.dockerfile" ;;
  *) echo "유효하지 않은 프로파일입니다. [ dev | prod ]를 사용해주세요."; exit 1 ;;
esac
VERSION=$(cat version.txt)
LOCAL_IMAGE_NAME="front${IMAGE_SUFFIX}:${VERSION}"

docker build --build-arg VERSION="${VERSION}" --platform linux/amd64 -t "$LOCAL_IMAGE_NAME" -f "$DOCKERFILE" .
docker save -o "front${IMAGE_SUFFIX}.tar" "$LOCAL_IMAGE_NAME"
scp -i "$KEY_FILE" "front${IMAGE_SUFFIX}.tar" "$DEPLOY_USER@$HOST:$REMOTE_IMAGE_PATH"
scp -i "$KEY_FILE" "docker/${COMPOSE_FILE}" "$DEPLOY_USER@$HOST:$DOCKER_COMPOSE_PATH"
[ "$profile" = "prod" ] && scp -i "$KEY_FILE" nginx.conf "$DEPLOY_USER@$HOST:$NGINX_CONFIG_PATH"

ssh -i "$KEY_FILE" "$DEPLOY_USER@$HOST" <<REMOTE
  set -e
  docker-compose -f ${DOCKER_COMPOSE_PATH} down || true
  docker images --filter=reference="front${IMAGE_SUFFIX}:*" --format "{{.ID}}" | xargs -r docker rmi -f
  docker load -i ${REMOTE_IMAGE_PATH}
  docker-compose -f ${DOCKER_COMPOSE_PATH} up -d
  docker system prune -f || true
REMOTE

# CMS
server {
    listen 5173;
    server_tokens off;
    root /usr/share/nginx/html;
    location / { try_files $uri $uri/ /index.html; }   # 404는 React Router가 그린다
}

# 사이트
server {
    listen 80;
    server_tokens off;
    location / {
        proxy_pass http://front:3000;                     # 오류는 Next.js가 그린다
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}