diff --git a/src/App.js b/src/App.js
index 200f2de..826e3ce 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { BrowserRouter, Routes, Route } from "react-router-dom"
 import { Navbar, Sidebar } from "./components";
-import { AdSuggestion, Cryptocurrency, DailyTask, Home, Logout, Rewards, Settings, Wallet } from "./pages";
+import { AdSuggestion, Cryptocurrency, DailyTask, Home, Logout, AdStatus, SuggestedAds, BitcoinPage, Rewards, Settings, ProfileDetail, NotificationPage, Wallet, Vote, AddProject } from "./pages";
 import "./App.css"
 
 function App() {
@@ -46,10 +46,19 @@ function App() {
                 <Route path="/rewards" element={<Rewards />} />
                 <Route path="/daily-tasks" element={<DailyTask />} />
                 <Route path="/cryptocurrency" element={<Cryptocurrency />} />
+                <Route path="cryptocurrency/bitcoin" element={<BitcoinPage />} />
                 <Route path="/wallet" element={<Wallet />} />
                 <Route path="/ad-suggestion" element={<AdSuggestion />} />
+                <Route path="/suggest-ads" element={<SuggestedAds />} />
+                <Route path="/ad-status" element={< AdStatus />} />
                 <Route path="/settings" element={<Settings />} />
+                <Route path="/Vote/add-project" element={<AddProject />} />
+                <Route path="/settings/profile-detail" element={<ProfileDetail />} />
+                <Route path="/notifications" element={<NotificationPage />} />
+                <Route path="/vote" element={<Vote />} />
                 <Route path="/logout" element={<Logout />} />
+                
+                
               </Routes>
             </div>
           </div>
diff --git a/src/components/CryptoForm.jsx b/src/components/AdSuggestion/AdSuggestionForms/CryptoForm.jsx
similarity index 100%
rename from src/components/CryptoForm.jsx
rename to src/components/AdSuggestion/AdSuggestionForms/CryptoForm.jsx
diff --git a/src/components/IcoForm.jsx b/src/components/AdSuggestion/AdSuggestionForms/IcoForm.jsx
similarity index 100%
rename from src/components/IcoForm.jsx
rename to src/components/AdSuggestion/AdSuggestionForms/IcoForm.jsx
diff --git a/src/components/SuggestAds.css b/src/components/AdSuggestion/AdSuggestionForms/SuggestAds.css
similarity index 100%
rename from src/components/SuggestAds.css
rename to src/components/AdSuggestion/AdSuggestionForms/SuggestAds.css
diff --git a/src/components/AdSuggestion/AdSuggestionForms/SuggestAds.jsx b/src/components/AdSuggestion/AdSuggestionForms/SuggestAds.jsx
new file mode 100644
index 0000000..34c27e0
--- /dev/null
+++ b/src/components/AdSuggestion/AdSuggestionForms/SuggestAds.jsx
@@ -0,0 +1,73 @@
+import React, { useState } from "react";
+import "./SuggestAds.css";
+import arrowback from "../../../data/arrow-left.png";
+import CryptoForm from "./CryptoForm";
+import IcoForm from "./IcoForm";
+import { NavLink } from "react-router-dom";
+
+export default function SuggestAds() {
+  const [suggestionForm, setSuggestionForm] = useState("cryptoform");
+
+  return (
+    <div className="suggestAd-container">
+      <span className="suggestAd-span">
+        <NavLink to='/ad-suggestion'>
+          <img src={arrowback} alt="navigate back arrow" />
+        </NavLink>
+
+        <h3>Suggest Ads</h3>
+      </span>
+      <p className="projectType">Project types</p>
+      <div className="suggestAd-buttons">
+        <button
+          onClick={() => {
+            setSuggestionForm("cryptoform");
+          }}
+          style={{
+            backgroundColor:
+              suggestionForm === "cryptoform" ? "#2793ff" : "#4b5768",
+          }}
+        >
+          Crypto Project
+        </button>
+        <button
+          onClick={() => {
+            setSuggestionForm("nftform");
+          }}
+          style={{
+            backgroundColor:
+              suggestionForm === "nftform" ? "#2793ff" : "#4b5768",
+          }}
+        >
+          NFT Project
+        </button>
+        <button
+          onClick={() => {
+            setSuggestionForm("icoform");
+          }}
+          style={{
+            backgroundColor:
+              suggestionForm === "icoform" ? "#2793ff" : "#4b5768",
+          }}
+        >
+          ICO Drop
+        </button>
+        <button
+          onClick={() => {
+            setSuggestionForm("metaverseform");
+          }}
+          style={{
+            backgroundColor:
+              suggestionForm === "metaverseform" ? "#2793ff" : "#4b5768",
+          }}
+        >
+          Metaverse Project
+        </button>
+      </div>
+      {suggestionForm === "cryptoform" && <CryptoForm />}
+      {suggestionForm === "icoform" && <IcoForm />}
+      {suggestionForm === "nftform" && <CryptoForm />}
+      {suggestionForm === "metaverseform" && <CryptoForm />}
+    </div>
+  );
+}
diff --git a/src/components/AdSuggestion/AdSuggestionStat/AdSuggestionStatus.jsx b/src/components/AdSuggestion/AdSuggestionStat/AdSuggestionStatus.jsx
new file mode 100644
index 0000000..01ceea6
--- /dev/null
+++ b/src/components/AdSuggestion/AdSuggestionStat/AdSuggestionStatus.jsx
@@ -0,0 +1,39 @@
+import React from "react";
+import "./AddSuggestionStatus.css";
+import arrowback from "../../../data/arrow-left.png";
+import { suggestionStatus } from "../../../data/data";
+import { NavLink } from "react-router-dom";
+
+export default function AdSuggestionStatus() {
+  const statusItems = (props) => {
+    return (
+      <div className="statusItem">
+        <div className="status-details">
+          <img src={props.img} alt="ad suggestion" />
+          <div className="status-detail">
+            <p>{props.name}</p>
+            <p>Collections</p>
+          </div>
+        </div>
+        <span className="status">
+          <img src={props.statusImg} alt="Ad status" />
+          {props.status}
+        </span>
+      </div>
+    );
+  };
+  return (
+    <div className="SuggestionStatus-container">
+      <span className="suggestAd-span">
+        <NavLink to='/ad-suggestion'>
+        <img src={arrowback} alt="navigate back arrow" />
+        </NavLink>
+        
+        <h3>Ad Suggestion Status</h3>
+      </span>
+      <div className="suggestion-status">
+        {suggestionStatus.map(statusItems)}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/AddSuggestionStatus.css b/src/components/AdSuggestion/AdSuggestionStat/AddSuggestionStatus.css
similarity index 100%
rename from src/components/AddSuggestionStatus.css
rename to src/components/AdSuggestion/AdSuggestionStat/AddSuggestionStatus.css
diff --git a/src/components/AddSuggestions.css b/src/components/AdSuggestion/AddSuggestions.css
similarity index 100%
rename from src/components/AddSuggestions.css
rename to src/components/AdSuggestion/AddSuggestions.css
diff --git a/src/components/AdSuggestion/AddSuggestions.jsx b/src/components/AdSuggestion/AddSuggestions.jsx
new file mode 100644
index 0000000..8d8f29b
--- /dev/null
+++ b/src/components/AdSuggestion/AddSuggestions.jsx
@@ -0,0 +1,82 @@
+import React from "react";
+import "./AddSuggestions.css";
+import { Link, NavLink } from "react-router-dom";
+import watch from "../../data/watch.png";
+import plus from "../../data/plus.png";
+import bell from "../../data/bell.png";
+import desk from "../../data/desk.png";
+import NftProjectAd from "./NftProjectAd";
+import CryptoProjectAd from "./CryptoProjectAd";
+import MetaverseProjects from "./MetaverseProjects";
+import IcoProjectAds from "./IcoProjectAds";
+
+export default function AddSuggestions() {
+  return (
+    <div className="add-suggestion-container">
+      <div className="add-suggestion-inner">
+        <div className="featured-ads">
+          <h3 className="featured-ads-h3">Featured Ads</h3>
+          <div className="featured-ads-btns">
+            <NavLink to="/ad-status">
+              <button className="status-btn">
+                <img src={watch} alt="ad status" />
+                Ad Status
+              </button>
+            </NavLink>
+            <NavLink to="/suggest-ads">
+              <button className="suggest-btn">
+                <img src={plus} alt="plus sign" />
+                Suggest Ads
+              </button>
+            </NavLink>
+          </div>
+        </div>
+        <div className="ad-boxes">
+          <div
+            className="ad-box-big"
+            style={{
+              backgroundImage: `url(${bell})`,
+              backgroundSize: "contain",
+              backgroundPosition: "right",
+              backgroundRepeat: "no-repeat",
+            }}
+          >
+            <div className="big-box-content">
+              <h3>The Right NFT At the festival</h3>
+              <p>
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sodales
+                mollis quisque commodo facilisis adipiscing curabitur fringilla.
+                Elit netus sed sit fermentum vel ornare sit feugiat felis.
+              </p>
+              <Link to="/" className="ad-readmore-link">
+                Read More
+              </Link>
+            </div>
+          </div>
+          <div
+            className="ad-box-small"
+            style={{
+              backgroundImage: `url(${desk})`,
+              backgroundSize: "contain",
+              backgroundPosition: "bottom",
+              backgroundRepeat: "no-repeat",
+            }}
+          >
+            <h3>The Right NFT At the festival</h3>
+            <p>
+              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sodales
+              mollis quisque commodo facilisis adipiscing curabitur fringilla.
+              Elit netus sed sit fermentum vel ornare sit feugiat felis.
+            </p>
+          </div>
+        </div>
+      </div>
+      <NftProjectAd />
+      <CryptoProjectAd />
+      <MetaverseProjects />
+      <IcoProjectAds />
+
+      {/* <SuggestAds.jsx /> <AdSuggestionStatus /> Render this component */}
+    </div>
+  );
+}
diff --git a/src/components/CryptoProjectAd.css b/src/components/AdSuggestion/CryptoProjectAd.css
similarity index 100%
rename from src/components/CryptoProjectAd.css
rename to src/components/AdSuggestion/CryptoProjectAd.css
diff --git a/src/components/CryptoProjectAd.jsx b/src/components/AdSuggestion/CryptoProjectAd.jsx
similarity index 92%
rename from src/components/CryptoProjectAd.jsx
rename to src/components/AdSuggestion/CryptoProjectAd.jsx
index 2e6a920..d5877fe 100644
--- a/src/components/CryptoProjectAd.jsx
+++ b/src/components/AdSuggestion/CryptoProjectAd.jsx
@@ -1,9 +1,9 @@
 import React, { useState, useEffect, useRef } from 'react'
 import "./CryptoProjectAd.css"
-import leftarrow from "../data/leftarrow.png"
-import rightarrow from "../data/rightarrow.png"
+import leftarrow from "../../data/leftarrow.png"
+import rightarrow from "../../data/rightarrow.png"
 import { motion } from "framer-motion"
-import { CrytoAd } from '../data/data'
+import { CrytoAd } from '../../data/data'
 
 export default function CryptoProjectAd() {
 
diff --git a/src/components/IcoProjectAds.css b/src/components/AdSuggestion/IcoProjectAds.css
similarity index 100%
rename from src/components/IcoProjectAds.css
rename to src/components/AdSuggestion/IcoProjectAds.css
diff --git a/src/components/IcoProjectAds.jsx b/src/components/AdSuggestion/IcoProjectAds.jsx
similarity index 92%
rename from src/components/IcoProjectAds.jsx
rename to src/components/AdSuggestion/IcoProjectAds.jsx
index e30718c..edd6862 100644
--- a/src/components/IcoProjectAds.jsx
+++ b/src/components/AdSuggestion/IcoProjectAds.jsx
@@ -1,9 +1,9 @@
 import React, { useState, useEffect, useRef } from 'react'
 import "./IcoProjectAds.css"
-import leftarrow from "../data/leftarrow.png"
-import rightarrow from "../data/rightarrow.png"
+import leftarrow from "../../data/leftarrow.png"
+import rightarrow from "../../data/rightarrow.png"
 import { motion } from "framer-motion"
-import { IcoProjectAd } from '../data/data'
+import { IcoProjectAd } from '../../data/data'
 
 export default function IcoProjectAds() {
 
diff --git a/src/components/MetaverseProjects.css b/src/components/AdSuggestion/MetaverseProjects.css
similarity index 100%
rename from src/components/MetaverseProjects.css
rename to src/components/AdSuggestion/MetaverseProjects.css
diff --git a/src/components/MetaverseProjects.jsx b/src/components/AdSuggestion/MetaverseProjects.jsx
similarity index 89%
rename from src/components/MetaverseProjects.jsx
rename to src/components/AdSuggestion/MetaverseProjects.jsx
index 5215577..40f48bc 100644
--- a/src/components/MetaverseProjects.jsx
+++ b/src/components/AdSuggestion/MetaverseProjects.jsx
@@ -1,9 +1,9 @@
 import React, { useState, useEffect, useRef } from 'react'
 import "./MetaverseProjects.css"
-import leftarrow from "../data/leftarrow.png"
-import rightarrow from "../data/rightarrow.png"
+import leftarrow from "../../data/leftarrow.png"
+import rightarrow from "../../data/rightarrow.png"
 import { motion } from "framer-motion"
-import { MetaverseAd } from '../data/data'
+import { MetaverseAd } from '../../data/data'
 
 export default function MetaverseProjects() {
 
diff --git a/src/components/NftProjectAd.css b/src/components/AdSuggestion/NftProjectAd.css
similarity index 100%
rename from src/components/NftProjectAd.css
rename to src/components/AdSuggestion/NftProjectAd.css
diff --git a/src/components/NftProjectAd.jsx b/src/components/AdSuggestion/NftProjectAd.jsx
similarity index 92%
rename from src/components/NftProjectAd.jsx
rename to src/components/AdSuggestion/NftProjectAd.jsx
index cd21c9c..0737c08 100644
--- a/src/components/NftProjectAd.jsx
+++ b/src/components/AdSuggestion/NftProjectAd.jsx
@@ -1,12 +1,10 @@
 import React, { useState, useEffect, useRef } from 'react'
 import "./NftProjectAd.css"
 import { motion } from "framer-motion"
-import heart from "../data/heart.png"
-import leftarrow from "../data/leftarrow.png"
-import rightarrow from "../data/rightarrow.png"
-import { NftAd } from '../data/data'
-
-
+import heart from "../../data/heart.png"
+import leftarrow from "../../data/leftarrow.png"
+import rightarrow from "../../data/rightarrow.png"
+import { NftAd } from '../../data/data'
 
 export default function NftProjectAd() {
     const [width, setWidth] = useState(0)
diff --git a/src/components/AdSuggestionStatus.jsx b/src/components/AdSuggestionStatus.jsx
deleted file mode 100644
index f190352..0000000
--- a/src/components/AdSuggestionStatus.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react'
-import "./AddSuggestionStatus.css"
-import arrowback from "../data/arrow-left.png"
-import { suggestionStatus } from '../data/data'
-
-export default function AdSuggestionStatus() {
-
-    
-
-    const statusItems = (props) => {
-
-
-        return(
-            <div className="statusItem">
-                <div className="status-details">
-                    <img src={props.img} alt="ad suggestion" />
-                    <div className='status-detail'>
-                        <p>{props.name}</p>
-                        <p>Collections</p>
-                    </div>
-                </div>
-                <span className="status"><img src={props.statusImg} alt="Ad status" />{props.status}</span>
-            </div>
-        )
-    }
-  return (
-    <div className='SuggestionStatus-container'>
-        <span className='suggestAd-span'><img src={arrowback} alt="navigate back arrow" /> <h3>Ad Suggestion Status</h3></span>
-        <div className='suggestion-status'>
-            {suggestionStatus.map(statusItems)}
-        </div>
-    </div>
-  )
-}
diff --git a/src/components/AddSuggestions.jsx b/src/components/AddSuggestions.jsx
deleted file mode 100644
index 984efee..0000000
--- a/src/components/AddSuggestions.jsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from 'react'
-import "./AddSuggestions.css"
-import { Link } from 'react-router-dom'
-import watch from '../data/watch.png'
-import plus from '../data/plus.png'
-import bell from '../data/bell.png'
-import desk from '../data/desk.png'
-import NftProjectAd from './NftProjectAd'
-import CryptoProjectAd from './CryptoProjectAd'
-import MetaverseProjects from './MetaverseProjects'
-import IcoProjectAds from './IcoProjectAds'
-
-export default function AddSuggestions() {
-    return (
-        <div className='add-suggestion-container'>
-            <div className="add-suggestion-inner">
-                <div className="featured-ads">
-                    <h3 className="featured-ads-h3">Featured Ads</h3>
-                    <div className="featured-ads-btns">
-                        <button className='status-btn'><img src={watch} alt="ad status" />Ad Status</button>
-                        <button className='suggest-btn'><img src={plus} alt="plus sign" />Suggest Ads</button>
-                    </div>
-                </div>
-                <div className="ad-boxes">
-                    <div className="ad-box-big" style={{ backgroundImage: `url(${bell})`, backgroundSize: "contain", backgroundPosition: "right", backgroundRepeat: "no-repeat"}}>
-                        <div className="big-box-content" >
-                            <h3>The Right NFT At the festival</h3>
-                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sodales mollis quisque commodo facilisis adipiscing curabitur fringilla. Elit netus sed sit fermentum vel ornare sit feugiat felis.</p>
-                            <Link to='/'className='ad-readmore-link' >Read More</Link>
-                        </div>
-                    </div>
-                    <div className="ad-box-small" style={{ backgroundImage: `url(${desk})`, backgroundSize: "contain", backgroundPosition: "bottom", backgroundRepeat: "no-repeat"}}>
-                        <h3>The Right NFT At the festival</h3>
-                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sodales mollis quisque commodo facilisis adipiscing curabitur fringilla. Elit netus sed sit fermentum vel ornare sit feugiat felis.</p>
-                    </div>
-                </div>
-            </div>
-            <NftProjectAd />
-            <CryptoProjectAd />
-            <MetaverseProjects />
-            <IcoProjectAds />
-
-            {/* <SuggestAds.jsx /> <AdSuggestionStatus /> Render this component */}
-        </div>
-    )
-}
diff --git a/src/components/CryptoAll.jsx b/src/components/CryptoAll.jsx
deleted file mode 100644
index e32bcc8..0000000
--- a/src/components/CryptoAll.jsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react'
-import "./Crypto.css"
-import { Cryptocurrency } from '../data/data'
-
-export default function CryptoAll() {
-
-    const crypoItem = (props) => {
-        return(
-            <div className="crypo-item" key={props.id}>
-                <span className='crypto-id'>{props.id}</span>
-                <div className='crypto-detail'>
-                    <img className='crypto-img' src={props.img} alt="crypto image" />
-                    <div className="cryto-detail">
-                        <p className='crypto-name'>{props.name}</p>
-                        <p className='crypto-short'>{props.short}</p>
-                    </div>
-                </div>
-                <span className='crypto-price'>{props.price}</span>
-                <span className='crypto-change' style={{color: props.loss ? "#EF4444" : "#10B981"}}>{props.change}</span>
-                <span className='market-price'>{props.marketPrice}</span>
-                <img className='crypto-chart' src={props.chart} alt="chart" />
-                <img src={props.star} alt="chart" />
-            </div>
-
-        )
-    }
-
-  return (
-    <div className='cryptoItems'>
-        {Cryptocurrency.map(crypoItem)}
-    </div>
-  )
-}
-
-{/* <Bitcoin /> stay here for now mate. I think it should be rendered when bitcoin is clicked... */}
\ No newline at end of file
diff --git a/src/components/Bitcoin.css b/src/components/Cryptocurrency/Bitcoin/Bitcoin.css
similarity index 100%
rename from src/components/Bitcoin.css
rename to src/components/Cryptocurrency/Bitcoin/Bitcoin.css
diff --git a/src/components/Bitcoin.jsx b/src/components/Cryptocurrency/Bitcoin/Bitcoin.jsx
similarity index 94%
rename from src/components/Bitcoin.jsx
rename to src/components/Cryptocurrency/Bitcoin/Bitcoin.jsx
index 50033cd..58e8b5f 100644
--- a/src/components/Bitcoin.jsx
+++ b/src/components/Cryptocurrency/Bitcoin/Bitcoin.jsx
@@ -1,18 +1,17 @@
 import React, { useState } from 'react'
 import { Link } from 'react-router-dom'
-import btc from "../data/btcbig.png"
-import share from "../data/share.png"
-import greenangle from "../data/greenangle.png"
-import arrowdown from "../data/arrow-down.png"
-import yellow from "../data/yellow.png"
-import thumb from "../data/thumb.png"
-import redangle from "../data/redangle.png"
-import white from "../data/white.png"
-import map from "../data/map.png"
-import { btcLinks } from '../data/data'
+import btc from "../../../data/btcbig.png"
+import share from "../../../data/share.png"
+import greenangle from "../../../data/greenangle.png"
+import arrowdown from "../../../data/arrow-down.png"
+import yellow from "../../../data/yellow.png"
+import thumb from "../../../data/thumb.png"
+import redangle from "../../../data/redangle.png"
+import white from "../../../data/white.png"
+import map from "../../../data/map.png"
+import { btcLinks } from '../../../data/data'
 import Chart from "./Chart"
 import Roadmap from "./Roadmap"
-import BtcStats from "./BtcStats"
 import Review from "./Review"
 import "./Bitcoin.css"
 import ReviewIpad from './ReviewIpad'
diff --git a/src/components/BtcStats.css b/src/components/Cryptocurrency/Bitcoin/BtcStats.css
similarity index 100%
rename from src/components/BtcStats.css
rename to src/components/Cryptocurrency/Bitcoin/BtcStats.css
diff --git a/src/components/BtcStats.jsx b/src/components/Cryptocurrency/Bitcoin/BtcStats.jsx
similarity index 96%
rename from src/components/BtcStats.jsx
rename to src/components/Cryptocurrency/Bitcoin/BtcStats.jsx
index 691a196..fd3fc01 100644
--- a/src/components/BtcStats.jsx
+++ b/src/components/Cryptocurrency/Bitcoin/BtcStats.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
-import redangle from "../data/redangle.png"
-import greenangle from "../data/greenangle.png"
+import redangle from "../../../data/redangle.png"
+import greenangle from "../../../data/greenangle.png"
 import "./BtcStats.css"
 
 export default function BtcStats() {
diff --git a/src/components/Chart.css b/src/components/Cryptocurrency/Bitcoin/Chart.css
similarity index 100%
rename from src/components/Chart.css
rename to src/components/Cryptocurrency/Bitcoin/Chart.css
diff --git a/src/components/Chart.jsx b/src/components/Cryptocurrency/Bitcoin/Chart.jsx
similarity index 97%
rename from src/components/Chart.jsx
rename to src/components/Cryptocurrency/Bitcoin/Chart.jsx
index 3879d27..81976e5 100644
--- a/src/components/Chart.jsx
+++ b/src/components/Cryptocurrency/Bitcoin/Chart.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import chart from "../data/chart.png"
+import chart from "../../../data/chart.png"
 import BtcStats from './BtcStats'
 import "./Chart.css"
 
diff --git a/src/components/Review.css b/src/components/Cryptocurrency/Bitcoin/Review.css
similarity index 100%
rename from src/components/Review.css
rename to src/components/Cryptocurrency/Bitcoin/Review.css
diff --git a/src/components/Review.jsx b/src/components/Cryptocurrency/Bitcoin/Review.jsx
similarity index 89%
rename from src/components/Review.jsx
rename to src/components/Cryptocurrency/Bitcoin/Review.jsx
index 128cc63..321753d 100644
--- a/src/components/Review.jsx
+++ b/src/components/Cryptocurrency/Bitcoin/Review.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import "./Review.css"
-import { reviews } from '../data/data'
+import { reviews } from '../../../data/data'
 
 export default function Review() {
     
@@ -9,7 +9,7 @@ export default function Review() {
             <div className="review-item">
                 <div className="review-top">
                     <div className="profile">
-                        <img src={props.img} alt="display picture" />
+                        <img src={props.img} alt="display symbol" />
                         <div className="profile-detail">
                             <p className='review-name'>{props.name}</p>
                             <p className='review-username'>{props.username}</p>
diff --git a/src/components/ReviewIpad.jsx b/src/components/Cryptocurrency/Bitcoin/ReviewIpad.jsx
similarity index 91%
rename from src/components/ReviewIpad.jsx
rename to src/components/Cryptocurrency/Bitcoin/ReviewIpad.jsx
index b7eee48..2f43f78 100644
--- a/src/components/ReviewIpad.jsx
+++ b/src/components/Cryptocurrency/Bitcoin/ReviewIpad.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import "./Review.css"
-import { reviews } from '../data/data'
+import { reviews } from '../../../data/data'
     
    
 
@@ -11,7 +11,7 @@ export default function ReviewIpad() {
             <div className="review-item">
                 <div className="review-top">
                     <div className="profile">
-                        <img src={props.img} alt="display picture" />
+                        <img src={props.img} alt="display symbol" />
                         <div className="profile-detail">
                             <p className='review-name'>{props.name}</p>
                             <p className='review-username'>{props.username}</p>
diff --git a/src/components/Roadmap.css b/src/components/Cryptocurrency/Bitcoin/Roadmap.css
similarity index 100%
rename from src/components/Roadmap.css
rename to src/components/Cryptocurrency/Bitcoin/Roadmap.css
diff --git a/src/components/Roadmap.jsx b/src/components/Cryptocurrency/Bitcoin/Roadmap.jsx
similarity index 100%
rename from src/components/Roadmap.jsx
rename to src/components/Cryptocurrency/Bitcoin/Roadmap.jsx
diff --git a/src/components/Crypto.css b/src/components/Cryptocurrency/Crypto.css
similarity index 100%
rename from src/components/Crypto.css
rename to src/components/Cryptocurrency/Crypto.css
diff --git a/src/components/Crypto.jsx b/src/components/Cryptocurrency/Crypto.jsx
similarity index 100%
rename from src/components/Crypto.jsx
rename to src/components/Cryptocurrency/Crypto.jsx
diff --git a/src/components/Cryptocurrency/CryptoAll.jsx b/src/components/Cryptocurrency/CryptoAll.jsx
new file mode 100644
index 0000000..abef7a5
--- /dev/null
+++ b/src/components/Cryptocurrency/CryptoAll.jsx
@@ -0,0 +1,37 @@
+import React from "react";
+import "./Crypto.css";
+import { Cryptocurrency } from "../../data/data";
+import { NavLink } from "react-router-dom";
+
+export default function CryptoAll() {
+  const crypoItem = (props) => {
+    return (
+      <NavLink to={`${props.name}`} className="crypo-item" key={props.id}>
+        <span className="crypto-id">{props.id}</span>
+        <div className="crypto-detail">
+          <img className="crypto-img" src={props.img} alt="crypto symbol" />
+          <div className="cryto-detail">
+            <p className="crypto-name">{props.name}</p>
+            <p className="crypto-short">{props.short}</p>
+          </div>
+        </div>
+        <span className="crypto-price">{props.price}</span>
+        <span
+          className="crypto-change"
+          style={{ color: props.loss ? "#EF4444" : "#10B981" }}
+        >
+          {props.change}
+        </span>
+        <span className="market-price">{props.marketPrice}</span>
+        <img className="crypto-chart" src={props.chart} alt="chart" />
+        <img src={props.star} alt="chart" />
+      </NavLink>
+    );
+  };
+
+  return <div className="cryptoItems">{Cryptocurrency.map(crypoItem)}</div>;
+}
+
+
+  /* <Bitcoin /> stay here for now mate. I think it should be rendered when bitcoin is clicked... */
+
diff --git a/src/components/WatchList.jsx b/src/components/Cryptocurrency/WatchList.jsx
similarity index 93%
rename from src/components/WatchList.jsx
rename to src/components/Cryptocurrency/WatchList.jsx
index 988ce17..c4f20a4 100644
--- a/src/components/WatchList.jsx
+++ b/src/components/Cryptocurrency/WatchList.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { cryptoWatchList } from '../data/data'
+import { cryptoWatchList } from '../../data/data'
 
 export default function WatchList() {
  
@@ -8,7 +8,7 @@ export default function WatchList() {
             <div className="crypo-item" key={props.id}>
                 <span className='crypto-id'>{props.id}</span>
                 <div className='crypto-detail'>
-                    <img className='crypto-img' src={props.img} alt="crypto image" />
+                    <img className='crypto-img' src={props.img} alt="crypto symbol" />
                     <div className="cryto-detail">
                         <p className='crypto-name'>{props.name}</p>
                         <p className='crypto-short'>{props.short}</p>
diff --git a/src/components/GemContainer.jsx b/src/components/Home/GemContainer.jsx
similarity index 92%
rename from src/components/GemContainer.jsx
rename to src/components/Home/GemContainer.jsx
index f85b6c0..6f32035 100644
--- a/src/components/GemContainer.jsx
+++ b/src/components/Home/GemContainer.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import "./Reward.css"
-import { gems } from '../data/data'
+import { gems } from '../../data/data'
 
 export default function GemContainer() {
 
diff --git a/src/components/Landing.css b/src/components/Home/Landing.css
similarity index 100%
rename from src/components/Landing.css
rename to src/components/Home/Landing.css
diff --git a/src/components/LandingHero.jsx b/src/components/Home/LandingHero.jsx
similarity index 87%
rename from src/components/LandingHero.jsx
rename to src/components/Home/LandingHero.jsx
index 26265d8..e1a3af4 100644
--- a/src/components/LandingHero.jsx
+++ b/src/components/Home/LandingHero.jsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import "./Landing.css"
-import diamond from "../data/DiamondBig.png"
-import check from "../data/check.png"
-import nftgrid from "../data/nftgrid.png"
-import pink from "../data/pink.png"
+import diamond from "../../data/DiamondBig.png"
+import check from "../../data/check.png"
+import nftgrid from "../../data/nftgrid.png"
+import pink from "../../data/pink.png"
 import Reward from './Reward'
 
 export default function LandingHero() {
diff --git a/src/components/NftReward.jsx b/src/components/Home/NftReward.jsx
similarity index 88%
rename from src/components/NftReward.jsx
rename to src/components/Home/NftReward.jsx
index 9399871..71dde60 100644
--- a/src/components/NftReward.jsx
+++ b/src/components/Home/NftReward.jsx
@@ -1,8 +1,8 @@
-import React, { useState } from 'react'
+import React from 'react'
 import './Reward.css'
-import diamond from "../data/diamond.png"
-import arrow from "../data/arrow-right.png"
-import { nftReward } from '../data/data'
+import diamond from "../../data/diamond.png"
+import arrow from "../../data/arrow-right.png"
+import { nftReward } from '../../data/data'
 
 export default function NftReward() {
 
diff --git a/src/components/Referral.jsx b/src/components/Home/Referral.jsx
similarity index 82%
rename from src/components/Referral.jsx
rename to src/components/Home/Referral.jsx
index 49a8b75..7ea2bd0 100644
--- a/src/components/Referral.jsx
+++ b/src/components/Home/Referral.jsx
@@ -1,8 +1,8 @@
 import React from 'react'
-import copy from "../data/copy.png"
-import twitter from "../data/twitter.png"
-import facebook from "../data/facebook.png"
-import instagram from "../data/instagram.png"
+import copy from "../../data/copy.png"
+import twitter from "../../data/twitter.png"
+import facebook from "../../data/facebook.png"
+import instagram from "../../data/instagram.png"
 import "./Reward.css"
 
 export default function Referral() {
diff --git a/src/components/Reward.css b/src/components/Home/Reward.css
similarity index 100%
rename from src/components/Reward.css
rename to src/components/Home/Reward.css
diff --git a/src/components/Reward.jsx b/src/components/Home/Reward.jsx
similarity index 93%
rename from src/components/Reward.jsx
rename to src/components/Home/Reward.jsx
index 6b0015a..d6d1422 100644
--- a/src/components/Reward.jsx
+++ b/src/components/Home/Reward.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
-import GemContainer from './GemContainer'
+// import GemContainer from './GemContainer'
 import NftReward from './NftReward'
 import Referral from './Referral'
 import "./Reward.css"
diff --git a/src/components/Modal.css b/src/components/Modal/Modal.css
similarity index 100%
rename from src/components/Modal.css
rename to src/components/Modal/Modal.css
diff --git a/src/components/Modal.jsx b/src/components/Modal/Modal.jsx
similarity index 100%
rename from src/components/Modal.jsx
rename to src/components/Modal/Modal.jsx
diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx
deleted file mode 100644
index 42b07a6..0000000
--- a/src/components/Navbar.jsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from 'react'
-import search from "../data/search.png"
-import verified from "../data/verify.png"
-import diamond from "../data/diamond.png"
-import notification from "../data/notification.png"
-import US from "../data/US.png"
-import profile from "../data/profile.png"
-import "./Navbar.css"
-
-export default function Navbar() {
-  return (
-    <div className='nav-container'>
-      <div className="nav-search">
-        <img src={search} alt='search-icon'/>
-        <input className="nav-input" placeholder="Search Here" />
-      </div>
-      <div className="nav-items">
-        <div className="verify">
-          <img src={verified} alt="verified logo" />
-          <p>Go Business</p>
-        </div>
-        <div className="diamond">
-          <img src={diamond} alt='diamond logo' />
-          <p>100</p>
-        </div>
-        <div className="notification">
-          <img src={notification} alt='notification icon'/>
-          <div className="red"></div>
-        </div>
-        <div className="eng">
-          <img src={US} alt="USA flag" />
-          <p>USD</p>
-        </div>
-        <div className="profile">
-          <img src={profile} alt='profile'/>
-          <div className="profile-detail">
-            <p className='username'>John Doe</p>
-            <p className='user-mail'>johndoe@email.com</p>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
diff --git a/src/components/Notification.css b/src/components/Notification/Notification.css
similarity index 100%
rename from src/components/Notification.css
rename to src/components/Notification/Notification.css
diff --git a/src/components/Notification.jsx b/src/components/Notification/Notification.jsx
similarity index 92%
rename from src/components/Notification.jsx
rename to src/components/Notification/Notification.jsx
index 3577dab..62656c1 100644
--- a/src/components/Notification.jsx
+++ b/src/components/Notification/Notification.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
-import { notificationData } from '../data/data'
-import bell from "../data/bellbig.png"
+import { notificationData } from '../../data/data'
+import bell from "../../data/bellbig.png"
 import "./Notification.css"
 
 export default function Notification() {
diff --git a/src/components/ProfileParameters.jsx b/src/components/ProfileParameters.jsx
deleted file mode 100644
index 1b89a23..0000000
--- a/src/components/ProfileParameters.jsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from 'react'
-import "./ProfileParameters.css"
-import profile from "../data/profile.png"
-import edit from "../data/edit.png"
-import arrow from "../data/arrow.png"
-import setting from "../data/refix.png"
-import people from "../data/people.png"
-
-export default function ProfileParameters() {
-    return (
-        <div className='ProfileParameters'>
-            <div className="profileinfo-container">
-                <div className='profileinfo-container-inner'>
-                    <div className="profile">
-                        <img src={profile} alt="A display" />
-                        <div className="profile-detail">
-                            <p className='review-name'>John Doe</p>
-                            <p className='review-username'>Johndeo@email.com</p>
-                        </div>
-                    </div>
-                    <img src={edit} alt="edit profile icon" />
-                </div>
-                <p className='ProfileParameters-username'>Username</p>
-                <h3 className='ProfileParameters-h3'>John Doe</h3>
-            </div>
-
-
-            <div className="ProfileParameter-setting">
-                <span><img src={setting} alt="screw icon" /> Change Password</span>
-                <img src={arrow} alt="arrow right" />
-            </div>
-            <div className="ProfileParameter-setting">
-                <span><img src={people} alt="update icon" /> Update Social Media</span>
-                <img src={arrow} alt="arrow right" />
-            </div>
-        </div>
-    )
-}
diff --git a/src/components/MainReward.css b/src/components/Rewards/MainReward.css
similarity index 100%
rename from src/components/MainReward.css
rename to src/components/Rewards/MainReward.css
diff --git a/src/components/MainReward.jsx b/src/components/Rewards/MainReward.jsx
similarity index 90%
rename from src/components/MainReward.jsx
rename to src/components/Rewards/MainReward.jsx
index 8a5feb6..38a5c05 100644
--- a/src/components/MainReward.jsx
+++ b/src/components/Rewards/MainReward.jsx
@@ -1,8 +1,8 @@
 import React from 'react'
 import './MainReward.css'
-import diamond from "../data/diamond.png"
-import arrow from "../data/arrow-right.png"
-import { mainReward } from '../data/data'
+import diamond from "../../data/diamond.png"
+// import arrow from "../data/arrow-right.png"
+import { mainReward } from '../../data/data'
 
 export default function MainReward() {
 
diff --git a/src/components/Referrals.css b/src/components/Setting/Referrals.css
similarity index 100%
rename from src/components/Referrals.css
rename to src/components/Setting/Referrals.css
diff --git a/src/components/Referrals.jsx b/src/components/Setting/Referrals.jsx
similarity index 92%
rename from src/components/Referrals.jsx
rename to src/components/Setting/Referrals.jsx
index 092545b..f365615 100644
--- a/src/components/Referrals.jsx
+++ b/src/components/Setting/Referrals.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import './Referrals.css'
-import diamond from '../data/diamond.png'
-import { referralList } from '../data/data'
+import diamond from '../../data/diamond.png'
+import { referralList } from '../../data/data'
 
 export default function Referrals() {
     const referralItems = (props) => {
diff --git a/src/components/Setting.css b/src/components/Setting/Setting.css
similarity index 100%
rename from src/components/Setting.css
rename to src/components/Setting/Setting.css
diff --git a/src/components/Setting.jsx b/src/components/Setting/Setting.jsx
similarity index 82%
rename from src/components/Setting.jsx
rename to src/components/Setting/Setting.jsx
index bd50e99..d3af145 100644
--- a/src/components/Setting.jsx
+++ b/src/components/Setting/Setting.jsx
@@ -1,12 +1,12 @@
 import React, { useState } from 'react'
-import ChangePassword from './ChangePassword'
-import EditProfile from './EditProfile'
-import PasswordSuccessful from './PasswordSuccessful'
-import ProfileParameters from './ProfileParameters'
+import ChangePassword from './SettingProper/ChangePassword'
+import EditProfile from './SettingProper/EditProfile'
+import PasswordSuccessful from './SettingProper/PasswordSuccessful'
+import ProfileParameters from './SettingProper/ProfileParameters'
 import Referrals from './Referrals'
 import "./Setting.css"
 import TransactionHistory from './TransactionHistory'
-import UpdateSocial from './UpdateSocial'
+import UpdateSocial from './SettingProper/UpdateSocial'
 import UserLog from './UserLog'
 
 export default function Setting() {
@@ -36,11 +36,11 @@ export default function Setting() {
                 </div>
             </span>
 
-            {setting === "personalInfo" && <ProfileParameters />}
-            {setting === "personalInfo" && <EditProfile />}
+            {setting === "personalInfo" && <ProfileParameters />} 
+            {/* {setting === "personalInfo" && <EditProfile />}
             {setting === "personalInfo" && <ChangePassword />}
             {setting === "personalInfo" && <PasswordSuccessful />}
-            {setting === "personalInfo" && <UpdateSocial />}
+            {setting === "personalInfo" && <UpdateSocial />} */}
             
             {/* these are with profileParameters
             <EditProfile />
diff --git a/src/components/ChangePassword.css b/src/components/Setting/SettingProper/ChangePassword.css
similarity index 100%
rename from src/components/ChangePassword.css
rename to src/components/Setting/SettingProper/ChangePassword.css
diff --git a/src/components/ChangePassword.jsx b/src/components/Setting/SettingProper/ChangePassword.jsx
similarity index 95%
rename from src/components/ChangePassword.jsx
rename to src/components/Setting/SettingProper/ChangePassword.jsx
index b9eca44..94f4c99 100644
--- a/src/components/ChangePassword.jsx
+++ b/src/components/Setting/SettingProper/ChangePassword.jsx
@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 import './ChangePassword.css'
-import arrow from "../data/arrow-left.png"
-import eye from "../data/eye.png"
+import arrow from "../../../data/arrow-left.png"
+import eye from "../../../data/eye.png"
 
 export default function ChangePassword() {
 
diff --git a/src/components/EditProfile.css b/src/components/Setting/SettingProper/EditProfile.css
similarity index 100%
rename from src/components/EditProfile.css
rename to src/components/Setting/SettingProper/EditProfile.css
diff --git a/src/components/EditProfile.jsx b/src/components/Setting/SettingProper/EditProfile.jsx
similarity index 88%
rename from src/components/EditProfile.jsx
rename to src/components/Setting/SettingProper/EditProfile.jsx
index f8a8d19..db55359 100644
--- a/src/components/EditProfile.jsx
+++ b/src/components/Setting/SettingProper/EditProfile.jsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import "./EditProfile.css"
-import user from "../data/user.png"
-import upload from "../data/export.png"
-import profile from "../data/Profilebig.png"
-import arrow from "../data/arrow-left.png"
+import user from "../../../data/user.png"
+import upload from "../../../data/export.png"
+import profile from "../../../data/Profilebig.png"
+import arrow from "../../../data/arrow-left.png"
 
 export default function EditProfile() {
 
diff --git a/src/components/PasswordSuccessful.css b/src/components/Setting/SettingProper/PasswordSuccessful.css
similarity index 100%
rename from src/components/PasswordSuccessful.css
rename to src/components/Setting/SettingProper/PasswordSuccessful.css
diff --git a/src/components/PasswordSuccessful.jsx b/src/components/Setting/SettingProper/PasswordSuccessful.jsx
similarity index 91%
rename from src/components/PasswordSuccessful.jsx
rename to src/components/Setting/SettingProper/PasswordSuccessful.jsx
index 72f704f..f298323 100644
--- a/src/components/PasswordSuccessful.jsx
+++ b/src/components/Setting/SettingProper/PasswordSuccessful.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import "./PasswordSuccessful.css"
-import check from "../data/bigcheck.png"
+import check from "../../../data/bigcheck.png"
 import { Link } from 'react-router-dom'
 
 export default function PasswordSuccessful() {
diff --git a/src/components/ProfileParameters.css b/src/components/Setting/SettingProper/ProfileParameters.css
similarity index 100%
rename from src/components/ProfileParameters.css
rename to src/components/Setting/SettingProper/ProfileParameters.css
diff --git a/src/components/Setting/SettingProper/ProfileParameters.jsx b/src/components/Setting/SettingProper/ProfileParameters.jsx
new file mode 100644
index 0000000..785ccdb
--- /dev/null
+++ b/src/components/Setting/SettingProper/ProfileParameters.jsx
@@ -0,0 +1,44 @@
+import React from "react";
+import "./ProfileParameters.css";
+import profile from "../../../data/profile.png";
+import edit from "../../../data/edit.png";
+import arrow from "../../../data/arrow.png";
+import setting from "../../../data/refix.png";
+import people from "../../../data/people.png";
+import { NavLink } from "react-router-dom";
+
+export default function ProfileParameters() {
+  return (
+    <div className="ProfileParameters">
+      <div className="profileinfo-container">
+        <div className="profileinfo-container-inner">
+          <div className="profile">
+            <img src={profile} alt="A display" />
+            <div className="profile-detail">
+              <p className="review-name">John Doe</p>
+              <p className="review-username">Johndeo@email.com</p>
+            </div>
+          </div>
+          <NavLink to="/profile-detail">
+            <img src={edit} alt="edit profile icon" />
+          </NavLink>
+        </div>
+        <p className="ProfileParameters-username">Username</p>
+        <h3 className="ProfileParameters-h3">John Doe</h3>
+      </div>
+
+      <div className="ProfileParameter-setting">
+        <span>
+          <img src={setting} alt="screw icon" /> Change Password
+        </span>
+        <img src={arrow} alt="arrow right" />
+      </div>
+      <div className="ProfileParameter-setting">
+        <span>
+          <img src={people} alt="update icon" /> Update Social Media
+        </span>
+        <img src={arrow} alt="arrow right" />
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/UpdateSocial.css b/src/components/Setting/SettingProper/UpdateSocial.css
similarity index 100%
rename from src/components/UpdateSocial.css
rename to src/components/Setting/SettingProper/UpdateSocial.css
diff --git a/src/components/UpdateSocial.jsx b/src/components/Setting/SettingProper/UpdateSocial.jsx
similarity index 86%
rename from src/components/UpdateSocial.jsx
rename to src/components/Setting/SettingProper/UpdateSocial.jsx
index d0356b6..9a0450f 100644
--- a/src/components/UpdateSocial.jsx
+++ b/src/components/Setting/SettingProper/UpdateSocial.jsx
@@ -1,10 +1,10 @@
 import React from 'react'
 import "./UpdateSocial.css"
-import arrow from "../data/arrow-left.png"
-import check from '../data/bigcheck.png'
-import cancel from '../data/cancelbig.png'
-import telegram from '../data/telegram-logo.png'
-import twitter from '../data/twitter-logo.png'
+import arrow from "../../../data/arrow-left.png"
+import check from '../../../data/bigcheck.png'
+import cancel from '../../../data/cancelbig.png'
+import telegram from '../../../data/telegram-logo.png'
+import twitter from '../../../data/twitter-logo.png'
 
 export default function UpdateSocial() {
   return (
diff --git a/src/components/TransactionHistory.css b/src/components/Setting/TransactionHistory.css
similarity index 100%
rename from src/components/TransactionHistory.css
rename to src/components/Setting/TransactionHistory.css
diff --git a/src/components/TransactionHistory.jsx b/src/components/Setting/TransactionHistory.jsx
similarity index 96%
rename from src/components/TransactionHistory.jsx
rename to src/components/Setting/TransactionHistory.jsx
index 262d671..96c50d3 100644
--- a/src/components/TransactionHistory.jsx
+++ b/src/components/Setting/TransactionHistory.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import './TransactionHistory.css'
-import { receivedItems, withdrawItems } from '../data/data'
+import { receivedItems, withdrawItems } from '../../data/data'
 
 export default function TransactionHistory() {
 
diff --git a/src/components/UserLog.css b/src/components/Setting/UserLog.css
similarity index 100%
rename from src/components/UserLog.css
rename to src/components/Setting/UserLog.css
diff --git a/src/components/UserLog.jsx b/src/components/Setting/UserLog.jsx
similarity index 94%
rename from src/components/UserLog.jsx
rename to src/components/Setting/UserLog.jsx
index 1d5e40f..ee19634 100644
--- a/src/components/UserLog.jsx
+++ b/src/components/Setting/UserLog.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import './UserLog.css'
-import { userlogItems } from '../data/data'
+import { userlogItems } from '../../data/data'
 
 export default function UserLog() {
 
diff --git a/src/components/SuggestAds.jsx b/src/components/SuggestAds.jsx
deleted file mode 100644
index a4513dd..0000000
--- a/src/components/SuggestAds.jsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React, { useState } from 'react'
-import "./SuggestAds.css"
-import arrowback from "../data/arrow-left.png"
-import CryptoForm from './CryptoForm'
-import IcoForm from './IcoForm'
-
-export default function SuggestAds() {
-
-    const [suggestionForm, setSuggestionForm] = useState("cryptoform")
-
-  return (
-    <div className='suggestAd-container'>
-        <span className='suggestAd-span'><img src={arrowback} alt="navigate back arrow" /> <h3>Suggest Ads</h3></span>
-        <p className='projectType'>Project types</p>
-        <div className="suggestAd-buttons">
-            <button onClick={()=>{setSuggestionForm("cryptoform")}}
-            style={{backgroundColor: suggestionForm==="cryptoform" ? "#2793ff" : "#4b5768"}}
-            >Crypto Project</button>
-            <button onClick={()=>{setSuggestionForm("nftform")}}
-             style={{backgroundColor: suggestionForm==="nftform" ? "#2793ff" : "#4b5768"}}
-            >NFT Project</button>
-            <button onClick={()=>{setSuggestionForm("icoform")}}
-            style={{backgroundColor: suggestionForm==="icoform" ? "#2793ff" : "#4b5768"}}
-            >ICO Drop</button>
-            <button onClick={()=>{setSuggestionForm("metaverseform")}}
-            style={{backgroundColor: suggestionForm==="metaverseform" ? "#2793ff" : "#4b5768"}}
-            >Metaverse Project</button>
-        </div>
-        {suggestionForm === "cryptoform" && <CryptoForm />}
-        {suggestionForm === "icoform" && <IcoForm />}
-        {suggestionForm === "nftform" && <CryptoForm />}
-        {suggestionForm === "metaverseform" && <CryptoForm />}
-    </div>
-  )
-}
diff --git a/src/components/DailyTask.css b/src/components/Tasks/DailyTask.css
similarity index 100%
rename from src/components/DailyTask.css
rename to src/components/Tasks/DailyTask.css
diff --git a/src/components/DailyTask1.jsx b/src/components/Tasks/DailyTask1.jsx
similarity index 91%
rename from src/components/DailyTask1.jsx
rename to src/components/Tasks/DailyTask1.jsx
index 323f0f4..6df277a 100644
--- a/src/components/DailyTask1.jsx
+++ b/src/components/Tasks/DailyTask1.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import arrow from "../data/arrow-right.png"
+import arrow from "../../data/arrow-right.png"
 import "./DailyTask.css"
-import { DailyTask } from '../data/data'
+import { DailyTask } from '../../data/data'
 
 export default function DailyTask1() {
 
diff --git a/src/components/MoreTask.jsx b/src/components/Tasks/MoreTask.jsx
similarity index 91%
rename from src/components/MoreTask.jsx
rename to src/components/Tasks/MoreTask.jsx
index ace5a8a..981125e 100644
--- a/src/components/MoreTask.jsx
+++ b/src/components/Tasks/MoreTask.jsx
@@ -1,7 +1,7 @@
 import React from 'react'
-import arrow from "../data/arrow-right.png"
+import arrow from "../../data/arrow-right.png"
 import "./DailyTask.css"
-import { MoreTask } from '../data/data'
+import { MoreTask } from '../../data/data'
 
 export default function MoreTask1() {
 
diff --git a/src/components/Navbar.css b/src/components/UI/Navbar.css
similarity index 100%
rename from src/components/Navbar.css
rename to src/components/UI/Navbar.css
diff --git a/src/components/UI/Navbar.jsx b/src/components/UI/Navbar.jsx
new file mode 100644
index 0000000..cbc0200
--- /dev/null
+++ b/src/components/UI/Navbar.jsx
@@ -0,0 +1,47 @@
+import React from "react";
+import search from "../../data/search.png";
+import verified from "../../data/verify.png";
+import diamond from "../../data/diamond.png";
+import notification from "../../data/notification.png";
+import US from "../../data/US.png";
+import profile from "../../data/profile.png";
+import "./Navbar.css";
+import { NavLink } from "react-router-dom";
+
+export default function Navbar() {
+  return (
+    <div className="nav-container">
+      <div className="nav-search">
+        <img src={search} alt="search-icon" />
+        <input className="nav-input" placeholder="Search Here" />
+      </div>
+      <div className="nav-items">
+        <div className="verify">
+          <img src={verified} alt="verified logo" />
+          <p>Go Business</p>
+        </div>
+        <div className="diamond">
+          <img src={diamond} alt="diamond logo" />
+          <p>100</p>
+        </div>
+        <div className="notification">
+          <NavLink to="/notifications">
+            <img src={notification} alt="notification icon" />
+            <div className="red"></div>
+          </NavLink>
+        </div>
+        <div className="eng">
+          <img src={US} alt="USA flag" />
+          <p>USD</p>
+        </div>
+        <div className="profile">
+          <img src={profile} alt="profile" />
+          <div className="profile-detail">
+            <p className="username">John Doe</p>
+            <p className="user-mail">johndoe@email.com</p>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/Sidebar.css b/src/components/UI/Sidebar.css
similarity index 100%
rename from src/components/Sidebar.css
rename to src/components/UI/Sidebar.css
diff --git a/src/components/Sidebar.jsx b/src/components/UI/Sidebar.jsx
similarity index 86%
rename from src/components/Sidebar.jsx
rename to src/components/UI/Sidebar.jsx
index df328ec..14c5662 100644
--- a/src/components/Sidebar.jsx
+++ b/src/components/UI/Sidebar.jsx
@@ -1,13 +1,13 @@
 import React, { useState } from 'react'
 import { Link, NavLink } from "react-router-dom"
 import "./Sidebar.css"
-import moon from "../data/moon.png"
-import sun from "../data/sun.png"
-import logo from "../data/logo.png"
-import trading from "../data/trading.png"
-import menu from "../data/menu.png"
-import cancel from "../data/close-circle.png"
-import { links } from '../data/data'
+import moon from "../../data/moon.png"
+import sun from "../../data/sun.png"
+import logo from "../../data/logo.png"
+import trading from "../../data/trading.png"
+import menu from "../../data/menu.png"
+import cancel from "../../data/close-circle.png"
+import { links } from '../../data/data'
 
 export default function Sidebar(props) {
 
diff --git a/src/components/VoteAddProject.css b/src/components/Vote/VoteAddProject.css
similarity index 100%
rename from src/components/VoteAddProject.css
rename to src/components/Vote/VoteAddProject.css
diff --git a/src/components/Vote/VoteAddProject.jsx b/src/components/Vote/VoteAddProject.jsx
new file mode 100644
index 0000000..e8985ad
--- /dev/null
+++ b/src/components/Vote/VoteAddProject.jsx
@@ -0,0 +1,80 @@
+import React from "react";
+import { NavLink } from 'react-router-dom'
+import "./VoteAddProject.css";
+import arrow from "../../data/arrow-left.png";
+import upload from "../../data/upload.png";
+import photo from "../../data/uploadimg.png";
+import cancel from "../../data/imgcancel.png";
+
+export default function VoteAddProject() {
+  const handleSubmit = (e) => {
+    e.preventDefault();
+  };
+
+  return (
+    <div className="VoteAddProject">
+      <span className="suggestAd-span">
+        <NavLink to="/vote">
+          <img src={arrow} alt="navigate back arrow" />
+        </NavLink>{" "}
+        <h3>Add Project</h3>
+      </span>
+
+      <form onSubmit={handleSubmit}>
+        <div className="formInput">
+          <label>Project Name</label>
+          <input className="cryptoinput" type="text" />
+        </div>
+        <div className="formInput">
+          <label>About Project</label>
+          <textarea className="aboutproject-text" id="textarea" rows="9" />
+        </div>
+        <div className="formInput">
+          <label>Smart Contract Address </label>
+          <input className="cryptoinput" type="text" />
+        </div>
+        <div className="formInput">
+          <label>
+            <p>Project Url</p>
+            <p className="label-url">
+              URL e.g <span>https://aliens.com/nft/create</span>
+            </p>
+          </label>
+          <input className="cryptoinput" type="text" />
+        </div>
+        <p className="photoUpload-p">Project Photo Upload</p>
+        <p className="photosize">Photo must not be greater than 5mb</p>
+
+        <div className="upload-photo">
+          <div className="upload">
+            <img src={upload} alt="upload logo" />
+          </div>
+          <div className="photo">
+            <img src={photo} alt="uploaded item" />
+            <img className="photo-cancel" src={cancel} alt="a cancel icon" />
+          </div>
+        </div>
+
+        <div className="formInput">
+          <label>
+            <p>Project Twitter Url</p>
+            <p className="label-url">
+              URL e.g <span>https://aliens.com/nft/create</span>
+            </p>
+          </label>
+          <input className="cryptoinput" type="text" />
+        </div>
+        <div className="formInput">
+          <label>
+            <p>Project Telegram Url</p>
+            <p className="label-url">
+              URL e.g <span>https://aliens.com/nft/create</span>
+            </p>
+          </label>
+          <input className="cryptoinput" type="text" />
+        </div>
+        <button className="suggestForm-btn">Suggest Ads</button>
+      </form>
+    </div>
+  );
+}
diff --git a/src/components/VotePage.css b/src/components/Vote/VotePage.css
similarity index 100%
rename from src/components/VotePage.css
rename to src/components/Vote/VotePage.css
diff --git a/src/components/VotePage.jsx b/src/components/Vote/VotePage.jsx
similarity index 81%
rename from src/components/VotePage.jsx
rename to src/components/Vote/VotePage.jsx
index 8342b26..c591476 100644
--- a/src/components/VotePage.jsx
+++ b/src/components/Vote/VotePage.jsx
@@ -1,8 +1,9 @@
 import React from 'react'
 import "./VotePage.css"
-import like from "../data/thumbsup.png"
-import plus from "../data/add-circle.png"
-import more from "../data/more.png"
+import { NavLink } from 'react-router-dom'
+import like from "../../data/thumbsup.png"
+import plus from "../../data/add-circle.png"
+import more from "../../data/more.png"
 import VotedProject from './VotedProject'
 
 export default function VotePage() {
@@ -12,8 +13,10 @@ export default function VotePage() {
             <div className="voteProject-title">
                 <h3 className='voteProject-h3'>Projects</h3>
                 <span className="addProjects">
+                <NavLink to='add-project' className="addProjects">
                     <img src={plus} alt="plus sign" />
                     Add Project
+                </NavLink>
                 </span>
             </div>
 
@@ -35,10 +38,10 @@ export default function VotePage() {
         </div>
         <div className="voteContent-page">
             {/* if there are no projects listed, render this */}
-            {/* <div className="voteContent-zero">
+            <div className="voteContent-zero">
                 <img src={like} alt="thumbs up" />
                 <p>You Currently don’t have any projects Listed at the moment</p>
-            </div> */}
+            </div>
             {/* if there are listed projects, render this */}
 
             <VotedProject />
diff --git a/src/components/VotedProject.css b/src/components/Vote/VotedProject.css
similarity index 100%
rename from src/components/VotedProject.css
rename to src/components/Vote/VotedProject.css
diff --git a/src/components/VotedProject.jsx b/src/components/Vote/VotedProject.jsx
similarity index 87%
rename from src/components/VotedProject.jsx
rename to src/components/Vote/VotedProject.jsx
index b05a774..e755457 100644
--- a/src/components/VotedProject.jsx
+++ b/src/components/Vote/VotedProject.jsx
@@ -1,16 +1,16 @@
 import React from 'react'
 import "./VotedProject.css"
-import star from "../data/yellow.png"
-import thumb from "../data/biglike.png"
-import twitter from "../data/twitter.png"
-import telegram from "../data/tg-img.png"
-import NFT from "../data/votenft.png"
-import lightStar from "../data/lightstar.png"
-import copy from "../data/bigcopy.png"
-import discord from "../data/discord-img.png"
-import check from "../data/successful-check.png"
-import { reviews } from '../data/data'
-import bg from "../data/votead-bg.png"
+import star from "../../data/yellow.png"
+import thumb from "../../data/biglike.png"
+import twitter from "../../data/twitter.png"
+import telegram from "../../data/tg-img.png"
+import NFT from "../../data/votenft.png"
+import lightStar from "../../data/lightstar.png"
+import copy from "../../data/bigcopy.png"
+import discord from "../../data/discord-img.png"
+import check from "../../data/successful-check.png"
+import { reviews } from '../../data/data'
+import bg from "../../data/votead-bg.png"
 
 export default function VotedProject() {
 
@@ -20,7 +20,7 @@ export default function VotedProject() {
             <div className="votereview-item" key={props.img}>
                 <div className="votereview-top">
                     <div className="profile">
-                        <img src={props.img} alt="display picture" />
+                        <img src={props.img} alt="display symbol" />
                         <div className="profile-detail">
                             <p className='votereview-name'>{props.name}</p>
                             <p className='votereview-username'>{props.username}</p>
diff --git a/src/components/VoteAddProject.jsx b/src/components/VoteAddProject.jsx
deleted file mode 100644
index adb5f6c..0000000
--- a/src/components/VoteAddProject.jsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React from 'react'
-import "./VoteAddProject.css"
-import arrow from "../data/arrow-left.png"
-import upload from "../data/upload.png"
-import photo from "../data/uploadimg.png"
-import cancel from "../data/imgcancel.png"
-
-export default function VoteAddProject() {
-
-    const handleSubmit =(e)=> {
-        e.preventDefault()
-    }
-
-  return (
-    <div className='VoteAddProject'>
-        <span className='suggestAd-span'><img src={arrow} alt="navigate back arrow" /> <h3>Add Project</h3></span>
-
-        <form onSubmit={handleSubmit}>
-            <div className="formInput">
-                <label>Project Name</label>
-                <input className='cryptoinput' type="text"/>
-            </div>
-            <div className="formInput">
-                <label>About Project</label>
-                <textarea className='aboutproject-text' id='textarea' rows="9" />
-            </div>
-            <div className="formInput">
-                <label>Smart Contract Address </label>
-                <input className='cryptoinput' type="text"/>
-            </div>
-            <div className="formInput">
-                <label>
-                    <p>Project Url</p>
-                    <p className='label-url'>URL e.g <span>https://aliens.com/nft/create</span></p>
-                </label>
-                <input className='cryptoinput' type="text"/>
-            </div>
-            <p className='photoUpload-p'>Project Photo Upload</p>
-            <p className='photosize'>Photo must not be greater than 5mb</p>
-
-            <div className="upload-photo">
-                <div className="upload">
-                    <img src={upload} alt="upload logo" />
-                </div>
-                <div className="photo">
-                    <img src={photo} alt="uploaded item" />
-                    <img className='photo-cancel' src={cancel} alt="a cancel icon" />
-                </div>
-            </div>
-
-            <div className="formInput">
-                <label>
-                    <p>Project Twitter Url</p>
-                    <p className='label-url'>URL e.g <span>https://aliens.com/nft/create</span></p>
-                </label>
-                <input className='cryptoinput' type="text"/>
-            </div>
-            <div className="formInput">
-                <label>
-                    <p>Project Telegram Url</p>
-                    <p className='label-url'>URL e.g <span>https://aliens.com/nft/create</span></p>
-                </label>
-                <input className='cryptoinput' type="text"/>
-            </div>
-            <button className='suggestForm-btn'>Suggest Ads</button>
-        </form>
-    </div>
-  )
-}
diff --git a/src/components/NoTransaction.jsx b/src/components/Wallet/NoTransaction.jsx
similarity index 87%
rename from src/components/NoTransaction.jsx
rename to src/components/Wallet/NoTransaction.jsx
index 19db77a..5cf5296 100644
--- a/src/components/NoTransaction.jsx
+++ b/src/components/Wallet/NoTransaction.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import coin from '../data/stacked-coin.png'
+import coin from '../../data/stacked-coin.png'
 import { Link } from 'react-router-dom'
 
 export default function NoTransaction() {
diff --git a/src/components/Transactions.jsx b/src/components/Wallet/Transactions.jsx
similarity index 94%
rename from src/components/Transactions.jsx
rename to src/components/Wallet/Transactions.jsx
index 9143237..65aa482 100644
--- a/src/components/Transactions.jsx
+++ b/src/components/Wallet/Transactions.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
-import { transactionItems } from '../data/data'
+import { transactionItems } from '../../data/data'
 
 export default function Transactions() {
 
diff --git a/src/components/Wallet.css b/src/components/Wallet/Wallet.css
similarity index 100%
rename from src/components/Wallet.css
rename to src/components/Wallet/Wallet.css
diff --git a/src/components/WalletAssets.jsx b/src/components/Wallet/WalletAssets.jsx
similarity index 84%
rename from src/components/WalletAssets.jsx
rename to src/components/Wallet/WalletAssets.jsx
index 93e51b7..f0b81ea 100644
--- a/src/components/WalletAssets.jsx
+++ b/src/components/Wallet/WalletAssets.jsx
@@ -1,9 +1,9 @@
 import React, { useState } from 'react'
-import more from "../data/more.png"
-import withdraw from "../data/send-sqaure-2.png"
-import deposit from "../data/receive-square-2.png"
-import cancel from "../data/cancel.png"
-import { assets } from '../data/data'
+import more from "../../data/more.png"
+import withdraw from "../../data/send-sqaure-2.png"
+import deposit from "../../data/receive-square-2.png"
+import cancel from "../../data/cancel.png"
+import { assets } from '../../data/data'
 
 export default function WalletAssets() {
 
@@ -12,7 +12,7 @@ export default function WalletAssets() {
   const assetItem = (props) => {
     return (
       <div className='asset-item'>
-          <img className='asset-img' src={props.img} alt="asset image" />
+          <img className='asset-img' src={props.img} alt="asset symbol" />
           <div className="asset-detail">
             <p className='asset-name'>{props.name}</p>
             <p className='asset-short'>{props.short}</p>
diff --git a/src/components/Wallets.jsx b/src/components/Wallet/Wallets.jsx
similarity index 91%
rename from src/components/Wallets.jsx
rename to src/components/Wallet/Wallets.jsx
index a96d256..6f507de 100644
--- a/src/components/Wallets.jsx
+++ b/src/components/Wallet/Wallets.jsx
@@ -1,8 +1,8 @@
 import React from 'react'
-import withdraw from '../data/withdraw.png'
-import deposit from '../data/deposit-logo.png'
-import btc from '../data/btc.png'
-import info from '../data/info.png'
+import withdraw from '../../data/withdraw.png'
+import deposit from '../../data/deposit-logo.png'
+import btc from '../../data/btc.png'
+import info from '../../data/info.png'
 import "./Wallet.css"
 import WalletAssets from './WalletAssets'
 import NoTransaction from './NoTransaction'
diff --git a/src/components/index.jsx b/src/components/index.jsx
index 03f645d..ea36f23 100644
--- a/src/components/index.jsx
+++ b/src/components/index.jsx
@@ -1,2 +1,2 @@
-export { default as Navbar } from './Navbar';
-export { default as Sidebar } from './Sidebar';
\ No newline at end of file
+export { default as Navbar } from './UI/Navbar';
+export { default as Sidebar } from './UI/Sidebar';
\ No newline at end of file
diff --git a/src/data/data.js b/src/data/data.js
index 43f3086..ff1047e 100644
--- a/src/data/data.js
+++ b/src/data/data.js
@@ -64,6 +64,7 @@ import ethereum from "./ethereum.png"
 import binance from "./binance.png"
 import arc from "./arc.png"
 import bat from "./bat.png"
+import like from "./like.png"
 import cram from "./cram.png"
 import cred from "./cred.png"
 import apex from './apex.png'
@@ -103,6 +104,11 @@ export const links = [
         name: "Cryptocurrency"
     },
 
+    {
+        logo: like,
+        name: "Vote"
+    },
+
     {
         logo: wallet,
         name: "Wallet"
diff --git a/src/data/like.png b/src/data/like.png
new file mode 100644
index 0000000..a775693
Binary files /dev/null and b/src/data/like.png differ
diff --git a/src/pages/AdStatus.jsx b/src/pages/AdStatus.jsx
new file mode 100644
index 0000000..f23ce5f
--- /dev/null
+++ b/src/pages/AdStatus.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import AdSuggestionStatus from '../components/AdSuggestion/AdSuggestionStat/AdSuggestionStatus'
+
+export default function AdStatus() {
+  return (
+    <AdSuggestionStatus />
+  )
+}
diff --git a/src/pages/AdSuggestion.jsx b/src/pages/AdSuggestion.jsx
index dcc1e5a..ec8b854 100644
--- a/src/pages/AdSuggestion.jsx
+++ b/src/pages/AdSuggestion.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import AddSuggestions from '../components/AddSuggestions'
+import AddSuggestions from '../components/AdSuggestion/AddSuggestions'
 
 export default function AdSuggestion() {
   return (
diff --git a/src/pages/AddProject.jsx b/src/pages/AddProject.jsx
new file mode 100644
index 0000000..0aa1bfd
--- /dev/null
+++ b/src/pages/AddProject.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import VoteAddProject from '../components/Vote/VoteAddProject'
+
+export default function AddProject() {
+  return (
+    <VoteAddProject /> 
+  )
+}
diff --git a/src/pages/BitcoinPage.jsx b/src/pages/BitcoinPage.jsx
new file mode 100644
index 0000000..75ee8cf
--- /dev/null
+++ b/src/pages/BitcoinPage.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import Bitcoin from '../components/Cryptocurrency/Bitcoin/Bitcoin'
+
+export default function BitcoinPage() {
+  return (
+    <Bitcoin />
+  )
+}
diff --git a/src/pages/Cryptocurrency.jsx b/src/pages/Cryptocurrency.jsx
index a03101d..b6610f1 100644
--- a/src/pages/Cryptocurrency.jsx
+++ b/src/pages/Cryptocurrency.jsx
@@ -1,12 +1,8 @@
 import React from 'react'
-import Bitcoin from '../components/Bitcoin'
-import Crypto from '../components/Crypto'
+import Crypto from '../components/Cryptocurrency/Crypto'
 
 export default function Cryptocurrency() {
   return (
-   
-    // <Bitcoin />
      <Crypto />
-    
   )
 }
diff --git a/src/pages/DailyTask.jsx b/src/pages/DailyTask.jsx
index e89355b..28905c8 100644
--- a/src/pages/DailyTask.jsx
+++ b/src/pages/DailyTask.jsx
@@ -1,6 +1,6 @@
 import React from 'react'
-import DailyTask1 from '../components/DailyTask1'
-import MoreTask1 from '../components/MoreTask'
+import DailyTask1 from '../components/Tasks/DailyTask1'
+import MoreTask1 from '../components/Tasks/MoreTask'
 
 export default function DailyTask() {
   return (
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
index 6c1a77a..bc44f0f 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -1,12 +1,12 @@
 import React from 'react'
-import LandingHero from '../components/LandingHero'
-import Modal from '../components/Modal'
-import Notification from '../components/Notification'
+import LandingHero from '../components/Home/LandingHero'
+// import Modal from '../components/Modal'
+// import Notification from '../components/Notification'
 
 export default function Home() {
   return (
     <div>
-      <LandingHero/>
+      <LandingHero />
       
       {/* <Modal /> <Notification /> */}
     </div>
diff --git a/src/pages/Logout.jsx b/src/pages/Logout.jsx
index 82d6c82..24b36df 100644
--- a/src/pages/Logout.jsx
+++ b/src/pages/Logout.jsx
@@ -1,14 +1,9 @@
 import React from 'react'
-import Notification from '../components/Notification'
-import VoteAddProject from '../components/VoteAddProject'
-import VotePage from '../components/VotePage'
 
 export default function Logout() {
   return (
     <div>
-       <VotePage />
-     
-      {/* <SuggestAds />  <VoteAddProject /> stay here for now */}
+       Who goes you?
     </div>
   )
 }
diff --git a/src/pages/NotificationPage.jsx b/src/pages/NotificationPage.jsx
new file mode 100644
index 0000000..9673df9
--- /dev/null
+++ b/src/pages/NotificationPage.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import Notification from '../components/Notification/Notification'
+
+export default function NotificationPage() {
+  return (
+    <Notification />
+  )
+}
diff --git a/src/pages/ProfileDetail.jsx b/src/pages/ProfileDetail.jsx
new file mode 100644
index 0000000..ff9a654
--- /dev/null
+++ b/src/pages/ProfileDetail.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import EditProfile from '../components/Setting/SettingProper/EditProfile';
+
+export default function ProfileDetail() {
+  return (
+    <EditProfile />
+  )
+}
diff --git a/src/pages/Rewards.jsx b/src/pages/Rewards.jsx
index ab54d80..200e051 100644
--- a/src/pages/Rewards.jsx
+++ b/src/pages/Rewards.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import MainReward from '../components/MainReward'
+import MainReward from '../components/Rewards/MainReward'
 
 export default function Rewards() {
   return (
diff --git a/src/pages/Settings.jsx b/src/pages/Settings.jsx
index aacac29..ca38451 100644
--- a/src/pages/Settings.jsx
+++ b/src/pages/Settings.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Setting from '../components/Setting'
+import Setting from '../components/Setting/Setting'
 
 export default function Settings() {
   return (
diff --git a/src/pages/SuggestedAds.jsx b/src/pages/SuggestedAds.jsx
new file mode 100644
index 0000000..cc6c597
--- /dev/null
+++ b/src/pages/SuggestedAds.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import SuggestAds from '../components/AdSuggestion/AdSuggestionForms/SuggestAds'
+
+export default function SuggestedAds() {
+  return (
+    <SuggestAds />
+  )
+}
diff --git a/src/pages/Vote.jsx b/src/pages/Vote.jsx
new file mode 100644
index 0000000..c3f2d5c
--- /dev/null
+++ b/src/pages/Vote.jsx
@@ -0,0 +1,8 @@
+import React from 'react'
+import VotePage from '../components/Vote/VotePage'
+
+export default function Vote() {
+  return (
+    <VotePage />
+  )
+}
diff --git a/src/pages/Wallet.jsx b/src/pages/Wallet.jsx
index 148a846..833208c 100644
--- a/src/pages/Wallet.jsx
+++ b/src/pages/Wallet.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import Wallets from '../components/Wallets'
+import Wallets from '../components/Wallet/Wallets'
 
 export default function Wallet() {
   return (
diff --git a/src/pages/index.jsx b/src/pages/index.jsx
index be2e947..4d6ab78 100644
--- a/src/pages/index.jsx
+++ b/src/pages/index.jsx
@@ -1,8 +1,16 @@
 export { default as AdSuggestion } from './AdSuggestion';
+export { default as BitcoinPage } from './BitcoinPage';
 export { default as Cryptocurrency } from './Cryptocurrency';
 export { default as DailyTask } from './DailyTask';
 export { default as Home } from './Home';
 export { default as Logout } from './Logout';
 export { default as Rewards } from './Rewards';
 export { default as Settings } from './Settings';
-export { default as Wallet } from './Wallet';
\ No newline at end of file
+export { default as Wallet } from './Wallet';
+export { default as SuggestedAds } from './SuggestedAds';
+export { default as AdStatus } from './AdStatus';
+export { default as AddProject } from './AddProject';
+export { default as Vote } from './Vote';
+export { default as NotificationPage } from './NotificationPage';
+export { default as ProfileDetail } from './ProfileDetail';
+