feat: refactor components to use named exports for better tree-shaking

app/layouts/news/default.tsx

@@ -2,9 +2,9 @@ import { type PropsWithChildren } from 'react'
 
 import { PopupModal } from '~/components/popup/modal'
 import { SuccessModal } from '~/components/popup/success-modal'
-import Banner from '~/components/ui/banner'
+import { Banner } from '~/components/ui/banner'
 import { useNewsContext } from '~/contexts/news'
-import FormForgotPassword from '~/layouts/news/form-forgot-password'
+import { FormForgotPassword } from '~/layouts/news/form-forgot-password'
 import { FormLogin } from '~/layouts/news/form-login'
 import { FormRegister } from '~/layouts/news/form-register'
 

app/layouts/news/form-forgot-password.tsx

@@ -1,6 +1,6 @@
 import { Button } from '~/components/ui/button'
 
-export default function FormForgotPassword() {
+export const FormForgotPassword = () => {
   return (
     <div className="flex flex-col items-center justify-center">
       <div className="w-full max-w-md">