diff --git a/apps/as/.env.example b/apps/as/.env.example index f5cfcfb89..b2d706024 100644 --- a/apps/as/.env.example +++ b/apps/as/.env.example @@ -1,5 +1,5 @@ # apps/as/shared/config/env.ts 참고 -NEXT_PUBLIC_PORT=3000 -NEXT_PUBLIC_PROXY_HOST=http://localhost:3000 -NEXT_PUBLIC_SITE_ID=AS -NEXT_PUBLIC_SERVER_API_URL=http://192.168.0.102:8000 +NEXT_PUBLIC_PORT= +NEXT_PUBLIC_PROXY_HOST= +NEXT_PUBLIC_SITE_ID= +NEXT_PUBLIC_SERVER_API_URL= diff --git a/apps/as/app/(with-base-layout)/layout.tsx b/apps/as/app/(with-base-layout)/layout.tsx new file mode 100644 index 000000000..fd8cee5bd --- /dev/null +++ b/apps/as/app/(with-base-layout)/layout.tsx @@ -0,0 +1,35 @@ +"use client"; + +import { useCallback } from "react"; +import { usePathname, useRouter } from "next/navigation"; +import { useQueryClient } from "@tanstack/react-query"; +import { BaseLayout } from "@common/components"; +import type { MenuItem } from "@/entities/menu"; +import { PageLayout } from "@/shared/ui/page-layout"; + +export default function WithBaseLayout({ + children, +}: { + children: React.ReactNode; +}) { + const router = useRouter(); + const pathname = usePathname(); + const queryClient = useQueryClient(); + + const handleMenuClick = useCallback( + (item: MenuItem) => { + router.push(item.urlPath); + }, + [router], + ); + + return ( + + {children} + + ); +} diff --git a/apps/as/app/(with-base-layout)/page.tsx b/apps/as/app/(with-base-layout)/page.tsx new file mode 100644 index 000000000..e118e732e --- /dev/null +++ b/apps/as/app/(with-base-layout)/page.tsx @@ -0,0 +1,9 @@ +"use client"; + +export default function MainPage() { + return ( +
+

Home

+
+ ); +} diff --git a/apps/as/app/globals.css b/apps/as/app/globals.css index 13d40b892..60bc92fb6 100644 --- a/apps/as/app/globals.css +++ b/apps/as/app/globals.css @@ -1,27 +1,15 @@ +@import "@common/assets/styles/base.css"; +@import "@common/assets/styles/diveicon.css"; +@import "@common/components/index.css"; + @tailwind base; @tailwind components; @tailwind utilities; -:root { - --background: #ffffff; - --foreground: #171717; -} - -@media (prefers-color-scheme: dark) { - :root { - --background: #0a0a0a; - --foreground: #ededed; - } -} - +html, body { color: var(--foreground); background: var(--background); - font-family: Arial, Helvetica, sans-serif; -} - -@layer utilities { - .text-balance { - text-wrap: balance; - } + font-family: var(--font-noto-sans-kr), sans-serif; + font-size: 10px; } diff --git a/apps/as/app/layout.tsx b/apps/as/app/layout.tsx index 719c143d3..d152e0da3 100644 --- a/apps/as/app/layout.tsx +++ b/apps/as/app/layout.tsx @@ -1,10 +1,18 @@ import type { Metadata } from "next"; +import { Noto_Sans_KR } from "next/font/google"; import { Providers } from "./providers"; import "./globals.css"; +const notoSansKR = Noto_Sans_KR({ + subsets: ["latin"], + weight: ["100", "300", "400", "500", "700", "900"], + display: "swap", + variable: "--font-noto-sans-kr", +}); + export const metadata: Metadata = { - title: "AS Application", - description: "Next.js application with FSD architecture", + title: "행정지원시스템", + description: "행정지원시스템", }; interface RootLayoutProps { @@ -13,8 +21,8 @@ interface RootLayoutProps { export default function RootLayout({ children }: RootLayoutProps) { return ( - - + + {children} diff --git a/apps/as/app/page.tsx b/apps/as/app/page.tsx deleted file mode 100644 index 7e739afaa..000000000 --- a/apps/as/app/page.tsx +++ /dev/null @@ -1,10 +0,0 @@ -export default function HomePage() { - return ( -
-
-

AS Application

-

Feature Sliced Design Architecture with Next.js

-
-
- ); -} diff --git a/apps/as/entities/menu/index.ts b/apps/as/entities/menu/index.ts new file mode 100644 index 000000000..03aed8131 --- /dev/null +++ b/apps/as/entities/menu/index.ts @@ -0,0 +1 @@ +export { type MenuItem } from "./model"; diff --git a/apps/as/entities/menu/model/index.ts b/apps/as/entities/menu/model/index.ts new file mode 100644 index 000000000..89ebe7381 --- /dev/null +++ b/apps/as/entities/menu/model/index.ts @@ -0,0 +1 @@ +export { type MenuItem } from "./types"; diff --git a/apps/as/entities/menu/model/types.ts b/apps/as/entities/menu/model/types.ts new file mode 100644 index 000000000..9692821e3 --- /dev/null +++ b/apps/as/entities/menu/model/types.ts @@ -0,0 +1,19 @@ +export interface MenuItem { + menuCd: number; + menuKornNm: string; + menuEngNm: string; + parentId: number | null; + sortSeq: number; + iconNm?: string; + children: MenuItem[] | null; + levelNo: number; + urlPath: string; + menuLnkgTypeCd: string; + menuLnkgSn: number; + menuPath: string; + qrcd: string; + useYn: string; + otptYn: string; + newWndwYn: string; + requiredUrlPath: boolean; +} diff --git a/apps/as/package.json b/apps/as/package.json index a39004940..fb27f8af7 100644 --- a/apps/as/package.json +++ b/apps/as/package.json @@ -33,4 +33,4 @@ "tailwindcss": "^3.4.14", "typescript": "^5.7.2" } -} +} \ No newline at end of file diff --git a/apps/as/shared/ui/button.tsx b/apps/as/shared/ui/button.tsx deleted file mode 100644 index 3d9fb0bf5..000000000 --- a/apps/as/shared/ui/button.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { ButtonHTMLAttributes, forwardRef } from "react"; - -interface ButtonProps extends ButtonHTMLAttributes { - variant?: "primary" | "secondary" | "outline"; - size?: "sm" | "md" | "lg"; -} - -export const Button = forwardRef( - ({ className = "", variant = "primary", size = "md", children, ...props }, ref) => { - const baseStyles = "rounded-md font-medium transition-colors focus:outline-none focus:ring-2"; - - const variantStyles = { - primary: "bg-blue-600 text-white hover:bg-blue-700 focus:ring-blue-500", - secondary: "bg-gray-600 text-white hover:bg-gray-700 focus:ring-gray-500", - outline: "border border-gray-300 bg-transparent hover:bg-gray-50 focus:ring-gray-500", - }; - - const sizeStyles = { - sm: "px-3 py-1.5 text-sm", - md: "px-4 py-2 text-base", - lg: "px-6 py-3 text-lg", - }; - - return ( - - ); - }, -); - -Button.displayName = "Button"; diff --git a/apps/as/shared/ui/index.ts b/apps/as/shared/ui/index.ts index 812a8ab55..460542995 100644 --- a/apps/as/shared/ui/index.ts +++ b/apps/as/shared/ui/index.ts @@ -1 +1 @@ -export { Button } from "./button"; +export { PageLayout } from "./page-layout"; diff --git a/apps/as/shared/ui/page-layout.tsx b/apps/as/shared/ui/page-layout.tsx new file mode 100644 index 000000000..ecefc36bd --- /dev/null +++ b/apps/as/shared/ui/page-layout.tsx @@ -0,0 +1,35 @@ +"use client"; + +import { PageTitle } from "@common/components"; + +const mockCurrentMenuInfo = { + menuCd: 0, + menuKornNm: "메인", + menuEngNm: "Main", + parentId: null, + sortSeq: 0, + children: null, + levelNo: 0, + urlPath: "/", + menuLnkgTypeCd: "", + menuLnkgSn: 0, + menuPath: "메인", + qrcd: "", + useYn: "Y", + otptYn: "Y", + newWndwYn: "N", + requiredUrlPath: false, +}; + +function PageLayout({ children }: { children: React.ReactNode }) { + const menuPaths = mockCurrentMenuInfo.menuPath.split(">").map((path) => path.trim()); + + return ( +
+ + {children} +
+ ); +} + +export { PageLayout }; diff --git a/apps/as/tailwind.config.ts b/apps/as/tailwind.config.ts index 24811c1a4..ff6042e10 100644 --- a/apps/as/tailwind.config.ts +++ b/apps/as/tailwind.config.ts @@ -8,6 +8,7 @@ const config: Config = { "./features/**/*.{js,ts,jsx,tsx,mdx}", "./widgets/**/*.{js,ts,jsx,tsx,mdx}", "./app/**/*.{js,ts,jsx,tsx,mdx}", + "../../packages/common/components/dist/**/*.{js,ts,jsx,tsx,mdx}", ], theme: { extend: { @@ -15,6 +16,9 @@ const config: Config = { background: "var(--background)", foreground: "var(--foreground)", }, + fontFamily: { + sans: ["var(--font-noto-sans-kr)", "Noto Sans KR", "sans-serif"], + }, }, }, plugins: [], diff --git a/packages/common/components/package.json b/packages/common/components/package.json index 3cef3b0f0..bd06e3402 100644 --- a/packages/common/components/package.json +++ b/packages/common/components/package.json @@ -5,7 +5,7 @@ "sideEffects": false, "type": "module", "main": "./dist/index.js", - "module": "./dist/index.mjs", + "module": "./dist/index.js", "types": "./dist/index.d.ts", "files": [ "dist/**" @@ -13,7 +13,7 @@ "exports": { ".": { "types": "./dist/index.d.ts", - "import": "./dist/index.mjs", + "import": "./dist/index.js", "require": "./dist/index.js" }, "./index.css": "./dist/index.css"