Refactor function components across multiple files

Function components have been refactored across the codebase. Single export-const arrow function components have been adapted into traditional function declarations. This change provides better stack trace in case of errors and better function and argument names on runtime debugging.

apps/web/components/app-logo.tsx

@@ -2,10 +2,13 @@ import Link from 'next/link';
 
 import { cn } from '@kit/ui/utils';
 
-const LogoImage: React.FC<{
+function LogoImage({
+  className,
+  width = 105,
+}: {
   className?: string;
   width?: number;
-}> = ({ className, width = 105 }) => {
+}) {
   return (
     <svg
       width={width}
@@ -21,16 +24,20 @@ const LogoImage: React.FC<{
       />
     </svg>
   );
-};
+}
 
-export const AppLogo: React.FC<{
+export function AppLogo({
+  href,
+  label,
+  className,
+}: {
   href?: string;
   className?: string;
   label?: string;
-}> = ({ href, label, className }) => {
+}) {
   return (
     <Link aria-label={label ?? 'Home Page'} href={href ?? '/'}>
       <LogoImage className={className} />
     </Link>
   );
-};
+}