import React from "react" ; import { Routes , Route } from "react-router-dom" ; import { AppContainer } from "./App.styles" ; import Header from "./Header/Header" ; import Menu from "./Menu/Menu" ; import Player from "./Player/Player" ; import Dashboard from "./Dashboard/Dashboard" ; import Browse from "src/modules/App/Browse/Browse" ; import SignIn from "src/modules/App/SignIn/SignIn" ; import SignUp from "src/modules/App/SignUp/SignUp" ; import ForgotPassword from "src/modules/App/ForgotPassword/ForgotPassword" ; import ResetPassword from "src/modules/App/ResetPassword/ResetPassword" ; import Podcast from "src/modules/App/Podcast/Podcast" ; import Episode from "src/modules/App/Episode/Episode" ; import Search from "src/modules/App/Search/Search" ; import Subscriptions from "src/modules/App/Subscriptions/Subscriptions" ; import Favorites from "src/modules/App/Favorites/Favorites" ; import Filters from "src/modules/App/Filters/Filters" ; import Settings from "src/modules/App/Settings/Settings" ; import Password from "src/modules/App/Password/Password" ; import About from "src/modules/App/About/About" ; import FAQ from "src/modules/App/FAQ/FAQ" ; import Feedback from "src/modules/App/Feedback/Feedback" ; import PrivacyPolicy from "src/modules/App/PrivacyPolicy/PrivacyPolicy" ; import Terms from "src/modules/App/Terms/Terms" ; import Advertise from "src/modules/App/Advertise/Advertise" ; import usePlayer from "src/hooks/usePlayer/usePlayer" ; const App = ( ) => { const { state , send , service , seek , onToggle , onPlay , onPause , onVolume , onRate , onMute , onLoop , onSeek , onForward , onBackward , } = usePlayer ( ) ; return ( < AppContainer > < Dashboard > < Routes > < Route path = "/" element = { < Browse / > } /> < Route path = "/sign-in" element = { < SignIn / > } /> < Route path = "/sign-up" element = { < SignUp / > } /> < Route path = "/forgot-password" element = { < ForgotPassword / > } /> < Route path = "/reset-password" element = { < ResetPassword / > } /> < Route path = "/podcast/:id" element = { < Podcast state = { state } send = { send } service = { service } onToggle = { onToggle } onPlay = { onPlay } onPause = { onPause } / > } /> < Route path = "/episode/:id" element = { < Episode / > } /> < Route path = "/search" element = { < Search / > } /> < Route path = "/subscriptions" element = { < Subscriptions / > } /> < Route path = "/favorites" element = { < Favorites / > } /> < Route path = "/filters" element = { < Filters / > } /> < Route path = "/settings" element = { < Settings / > } /> < Route path = "/settings/password" element = { < Password / > } /> < Route path = "/settings/about" element = { < About / > } /> < Route path = "/settings/faq" element = { < FAQ / > } /> < Route path = "/settings/feedback" element = { < Feedback / > } /> < Route path = "/settings/privacy" element = { < PrivacyPolicy / > } /> < Route path = "/settings/terms" element = { < Terms / > } /> < Route path = "/advertise" element = { < Advertise / > } /> < /Routes> < /Dashboard> < Header / > < Player state = { state } send = { send } service = { service } seek = { seek } onToggle = { onToggle } onPlay = { onPlay } onPause = { onPause } onVolume = { onVolume } onRate = { onRate } onMute = { onMute } onLoop = { onLoop } onSeek = { onSeek } onForward = { onForward } onBackward = { onBackward } / > < Menu /> < /AppContainer>); } ; export default App ;