loader image apart

src/component/home/Home.jsx

@@ -3,18 +3,13 @@ import UserMenu from "../../parts/UserMenu";
 import UserHeader from "../../parts/UserHeader";
 import HomeSections from "../../parts/HomeSections";
 import UserFooter from "../../parts/UserFooter";
+import LoaderImage from "../../parts/LoaderImage";
 
 export default function Home() {
   return (
       <div className="app">
         <div className="app-wrap">
-          <div className="loader">
+         {/*<LoaderImage />*/}
-            <div className="h-100 d-flex justify-content-center">
-              <div className="align-self-center">
-                <img src="assets/img/loader/loader.svg" alt="loader" />
-              </div>
-            </div>
-          </div>
           <UserHeader />
           <div className="app-container">
             <aside className="app-navbar">

src/parts/LoaderImage.jsx

@@ -0,0 +1,14 @@
+import React from "react";
+
+export default function LoaderImage(){
+
+    return <>
+        <div className="loader">
+            <div className="h-100 d-flex justify-content-center">
+                <div className="align-self-center">
+                    <img src="assets/img/loader/loader.svg" alt="loader" />
+                </div>
+            </div>
+        </div>
+    </>;
+}