diff --git a/apps/dimentorin/public/logos/logo.svg b/apps/dimentorin/public/logos/logo.svg new file mode 100644 index 0000000..ca0f36e --- /dev/null +++ b/apps/dimentorin/public/logos/logo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/apps/dimentorin/public/logos/simple.svg b/apps/dimentorin/public/logos/simple.svg new file mode 100644 index 0000000..0fd70f3 --- /dev/null +++ b/apps/dimentorin/public/logos/simple.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/apps/dimentorin/src/app/(public)/(home)/_components/hero-section.tsx b/apps/dimentorin/src/app/(public)/(home)/_components/hero-section.tsx new file mode 100644 index 0000000..de8bd17 --- /dev/null +++ b/apps/dimentorin/src/app/(public)/(home)/_components/hero-section.tsx @@ -0,0 +1,7 @@ +export function HeroSection() { + return ( +
+
Hero Section
+
+ ) +} \ No newline at end of file diff --git a/apps/dimentorin/src/app/page.tsx b/apps/dimentorin/src/app/(public)/(home)/page.tsx similarity index 57% rename from apps/dimentorin/src/app/page.tsx rename to apps/dimentorin/src/app/(public)/(home)/page.tsx index f135208..97c1c5c 100644 --- a/apps/dimentorin/src/app/page.tsx +++ b/apps/dimentorin/src/app/(public)/(home)/page.tsx @@ -1,7 +1,10 @@ import { FC, ReactElement } from 'react'; +import { HeroSection } from './_components/hero-section'; export const Components: FC = (): ReactElement => { - return <>Hallo; + return ( + + ); }; export default Components; diff --git a/apps/dimentorin/src/app/(public)/_components/header.tsx b/apps/dimentorin/src/app/(public)/_components/header.tsx new file mode 100644 index 0000000..40e36e4 --- /dev/null +++ b/apps/dimentorin/src/app/(public)/_components/header.tsx @@ -0,0 +1,77 @@ +import { CloseOutlined, MenuOutlined } from "@ant-design/icons"; +import { Button } from "@imphnen-frontend-service/ui/atoms"; +import { cn } from "@imphnen-frontend-service/utils"; +import { FC, useState } from "react"; +import { Link, useLocation } from "react-router-dom"; +import { For } from "../../_components/logic/for"; +import { Show } from "../../_components/logic/show"; + +const MENUS: { label: string; href: string }[] = [ + { label: "Home", href: "/" }, + { label: 'Mentoring', href: '/mentoring' }, + { label: 'Resources', href: '/resources' }, + { label: 'Articles', href: '/articles' }, +] + +export const Header: FC = () => { + const location = useLocation(); + const [expandMenu, setExpandMenu] = useState(false); + + return ( +
+
+
+
+ IMPHNEN Logo +
+ + + +
+ + +
+
+
+
+ ); +} diff --git a/apps/dimentorin/src/app/(public)/layout.tsx b/apps/dimentorin/src/app/(public)/layout.tsx new file mode 100644 index 0000000..368e1e6 --- /dev/null +++ b/apps/dimentorin/src/app/(public)/layout.tsx @@ -0,0 +1,13 @@ +import { Outlet } from "react-router-dom"; +import { Header } from "./_components/header"; + +export default function Layout() { + return ( +
+
+
+ +
+
+ ); +} diff --git a/apps/dimentorin/src/app/_components/logic/for.tsx b/apps/dimentorin/src/app/_components/logic/for.tsx new file mode 100644 index 0000000..abdf388 --- /dev/null +++ b/apps/dimentorin/src/app/_components/logic/for.tsx @@ -0,0 +1,27 @@ +export interface ForProps { + data: readonly T[] + children: (item: T, index: number) => U | null + fallback?: React.ReactNode | null +} + +/** + * A functional component that renders a list of children components from a given + * array of data. + * + * @param data - The array of data to render + * @param children - A function that takes the current item and index and returns + * the child component to render + * @param fallback - An optional fallback component to render when the data is empty + * + * @returns An array of rendered child components if the data is not empty, otherwise + * the fallback component if it is provided, null otherwise + */ +export function For({ + data, + children, + fallback = null +}: ForProps): (U | null)[] | React.ReactNode | null { + if (!Array.isArray(data) || !data?.length) return fallback + + return data.map((item, idx) => children(item, idx)) +} diff --git a/apps/dimentorin/src/app/_components/logic/show.tsx b/apps/dimentorin/src/app/_components/logic/show.tsx new file mode 100644 index 0000000..c8305cc --- /dev/null +++ b/apps/dimentorin/src/app/_components/logic/show.tsx @@ -0,0 +1,19 @@ +export interface ShowProps { + condition: boolean + children: React.ReactNode + fallback?: React.ReactNode | null +} + +/** + * Conditionally renders the `children` component if `condition` is true. If + * `condition` is false, renders the `fallback` component instead. + * + * If `fallback` is `null`, renders nothing. + * + * @param condition - The condition to check + * @param children - The component to render if `condition` is true + * @param fallback - The component to render if `condition` is false + */ +export function Show({ condition, children, fallback = null }: ShowProps) { + return condition ? children : fallback +}