diff --git a/client/src/components/Layout/LayoutHeader.tsx b/client/src/components/Layout/LayoutHeader.tsx
index 20fa9c9..3a56a97 100644
--- a/client/src/components/Layout/LayoutHeader.tsx
+++ b/client/src/components/Layout/LayoutHeader.tsx
@@ -1,11 +1,10 @@
-import { Button, Input, Sheet, SheetContent, SheetTrigger } from "@/ui";
+import { Button, Sheet, SheetContent, SheetTrigger } from "@/ui";
 
-import { t } from "i18next";
-import { MenuIcon, Package2Icon, SearchIcon } from "lucide-react";
+import { MenuIcon, Package2Icon } from "lucide-react";
 import { Trans } from "react-i18next";
 import { Link } from "react-router-dom";
 import { UeckoLogo } from "../UeckoLogo";
-import { UserButton } from "./components/UserButton";
+import { UserButton } from "./components";
 
 export const LayoutHeader = () => {
   return (
@@ -71,17 +70,7 @@ export const LayoutHeader = () => {
           </nav>
         </SheetContent>
       </Sheet>
-      <div className='flex items-center w-full gap-4 md:ml-auto md:gap-2 lg:gap-4'>
-        <form className='flex-1 ml-auto'>
-          <div className='relative'>
-            <SearchIcon className='absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground' />
-            <Input
-              type='search'
-              placeholder={t("main_menu.search_placeholder")}
-              className='pl-8 sm:w-[300px] md:w-[200px] lg:w-[300px] xl:w-[550px] 2xl:w-[750px]'
-            />
-          </div>
-        </form>
+      <div className='flex items-center justify-end w-full gap-4 md:ml-auto md:gap-2 lg:gap-4'>
         <UserButton />
       </div>
     </header>
diff --git a/client/src/components/Layout/components/GlobalSearchForm.tsx b/client/src/components/Layout/components/GlobalSearchForm.tsx
new file mode 100644
index 0000000..ab30c60
--- /dev/null
+++ b/client/src/components/Layout/components/GlobalSearchForm.tsx
@@ -0,0 +1,17 @@
+import { Input } from "@/ui";
+
+import { t } from "i18next";
+import { SearchIcon } from "lucide-react";
+
+export const GlobalSearchForm = () => (
+  <form className='flex-1 ml-auto'>
+    <div className='relative'>
+      <SearchIcon className='absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground' />
+      <Input
+        type='search'
+        placeholder={t("main_menu.search_placeholder")}
+        className='pl-8 sm:w-[300px] md:w-[200px] lg:w-[300px] xl:w-[550px] 2xl:w-[750px]'
+      />
+    </div>
+  </form>
+);
diff --git a/client/src/components/Layout/components/index.tsx b/client/src/components/Layout/components/index.tsx
new file mode 100644
index 0000000..38a8dfc
--- /dev/null
+++ b/client/src/components/Layout/components/index.tsx
@@ -0,0 +1,2 @@
+export * from "./GlobalSearchForm";
+export * from "./UserButton";