feat: replace Image component with LogoSimple in Header and update Logo component to accept props

apps/landing/src/app/(public)/_components/header.tsx

@@ -1,9 +1,9 @@
 'use client';
 
+import { LogoSimple } from '@/app/_components/logo';
 import navigations from '@/data/navigations.json';
 import { Button } from '@components';
 import { cn } from '@utils';
-import Image from 'next/image';
 import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
@@ -36,13 +36,7 @@ export function Header() {
         <div className="flex items-center gap-2">
           <div className="relative overflow-hidden rounded">
             <Link href="/">
-              <Image
+              <LogoSimple className="w-[80px]" />
-                src="/logo.webp"
-                alt="IMPHNEN"
-                width={64}
-                height={64}
-                className="object-cover"
-              />
             </Link>
           </div>
         </div>

apps/landing/src/app/_components/logo.tsx

@@ -1,6 +1,7 @@
-export function Logo() {
+export function Logo(props: React.SVGProps<SVGSVGElement>) {
   return (
     <svg
+      {...props}
       xmlns="http://www.w3.org/2000/svg"
       xmlnsXlink="http://www.w3.org/1999/xlink"
       width="317"
@@ -33,9 +34,10 @@ export function Logo() {
   );
 }
 
-export function LogoSimple() {
+export function LogoSimple(props: React.SVGProps<SVGSVGElement>) {
   return (
     <svg
+      {...props}
       xmlns="http://www.w3.org/2000/svg"
       xmlnsXlink="http://www.w3.org/1999/xlink"
       width="138"