diff --git a/src/features/App/AuthenticatedApp.tsx b/src/features/App/AuthenticatedApp.tsx index 092e6834..27788ef0 100644 --- a/src/features/App/AuthenticatedApp.tsx +++ b/src/features/App/AuthenticatedApp.tsx @@ -1,3 +1,5 @@ +import { lazy } from 'react' + import { Route, Redirect, @@ -9,19 +11,19 @@ import { PAGES } from 'config' import { useLexicsConfig } from 'features/LexicsStore' -import { HomePage } from 'features/HomePage' -import { TeamPage } from 'features/TeamPage' -import { MatchPage } from 'features/MatchPage' -import { PlayerPage } from 'features/PlayerPage' -import { TournamentPage } from 'features/TournamentPage' import { ExtendedSearchStore, ExtendedSearchPage } from 'features/ExtendedSearchPage' -import { UserAccount } from 'features/UserAccount' - import { MatchSwitchesStore } from 'features/MatchSwitches' import { UserFavoritesStore } from 'features/UserFavorites/store' -import { MatchPopupStore } from 'features/MatchPopup' +import { MatchPopup, MatchPopupStore } from 'features/MatchPopup' import { BuyMatchPopup, BuyMatchPopupStore } from 'features/BuyMatchPopup' +const HomePage = lazy(() => import('features/HomePage')) +const TeamPage = lazy(() => import('features/TeamPage')) +const MatchPage = lazy(() => import('features/MatchPage')) +const PlayerPage = lazy(() => import('features/PlayerPage')) +const TournamentPage = lazy(() => import('features/TournamentPage')) +const UserAccount = lazy(() => import('features/UserAccount')) + export const AuthenticatedApp = () => { useLexicsConfig(indexLexics) @@ -31,6 +33,7 @@ export const AuthenticatedApp = () => { + {/* в Switch как прямой children можно рендерить только Route или Redirect */} diff --git a/src/features/App/UnauthenticatedApp.tsx b/src/features/App/UnauthenticatedApp.tsx index ee37ef5f..e8d30f04 100644 --- a/src/features/App/UnauthenticatedApp.tsx +++ b/src/features/App/UnauthenticatedApp.tsx @@ -1,3 +1,5 @@ +import { lazy } from 'react' + import { Route, Redirect, @@ -10,11 +12,12 @@ import { PAGES } from 'config' import { publicLexics } from 'config/lexics/public' import { useLexicsConfig } from 'features/LexicsStore' -import { Login } from 'features/Login' -import { Register } from 'features/Register' import { LanguageSelect } from 'features/LanguageSelect' import { HeaderStyled, HeaderGroup } from 'features/ProfileHeader/styled' +const Login = lazy(() => import('features/Login')) +const Register = lazy(() => import('features/Register')) + const Main = styled.main` width: 100%; ` diff --git a/src/features/App/index.tsx b/src/features/App/index.tsx index 2ca52d2a..7cbf2d91 100644 --- a/src/features/App/index.tsx +++ b/src/features/App/index.tsx @@ -1,3 +1,4 @@ +import { Suspense } from 'react' import { Router } from 'react-router-dom' import { history } from 'config' @@ -14,15 +15,9 @@ import { UnauthenticatedApp } from './UnauthenticatedApp' const Main = () => { const { token } = useAuthStore() - return ( - - { - token - ? - : - } - - ) + return token + ? + : } export const App = () => ( @@ -30,7 +25,11 @@ export const App = () => ( -
+ + +
+ + diff --git a/src/features/Combobox/index.tsx b/src/features/Combobox/index.tsx index 38c30fde..4912dbf4 100644 --- a/src/features/Combobox/index.tsx +++ b/src/features/Combobox/index.tsx @@ -35,7 +35,6 @@ export const Combobox = (props: Props) => { labelWidth, maxLength, title, - withArrow, withError, } = props @@ -81,12 +80,10 @@ export const Combobox = (props: Props) => { isUserAccountPage={isUserAccountPage} /> - {withArrow && ( - - )} + {isOpen && !isEmpty(options) && ( = Pick, ( onSelect?: (option: T | null) => void, options: Array, value?: string, - withArrow?: boolean, withError?: boolean, } diff --git a/src/features/HomePage/index.tsx b/src/features/HomePage/index.tsx index 415bc96a..de80dc74 100644 --- a/src/features/HomePage/index.tsx +++ b/src/features/HomePage/index.tsx @@ -15,7 +15,6 @@ import { import { SportFilterWrapper } from 'features/ProfileHeader/styled' import { MainWrapper } from 'features/MainWrapper' import { UserFavorites } from 'features/UserFavorites' -import { MatchPopup } from 'features/MatchPopup' import { useHomePage } from './hooks' import { Header } from './components/Header' @@ -25,7 +24,6 @@ const Home = () => { const { fetchMatches } = useHomePage() return ( - @@ -55,8 +53,10 @@ const Home = () => { ) } -export const HomePage = () => ( +const HomePage = () => ( ) + +export default HomePage diff --git a/src/features/Login/index.tsx b/src/features/Login/index.tsx index a7360026..e1ddcb0b 100644 --- a/src/features/Login/index.tsx +++ b/src/features/Login/index.tsx @@ -67,8 +67,10 @@ const LoginForm = () => { ) } -export const Login = () => ( +const Login = () => ( ) + +export default Login diff --git a/src/features/MatchPage/index.tsx b/src/features/MatchPage/index.tsx index 46cb5974..2118f25a 100644 --- a/src/features/MatchPage/index.tsx +++ b/src/features/MatchPage/index.tsx @@ -18,7 +18,7 @@ import { import { useMatchPage } from './hooks/useMatchPage' import { usePlayerProgressReporter } from './hooks/usePlayerProgressReporter' -export const MatchPage = () => { +const MatchPage = () => { const profile = useMatchProfile() const { chapters, @@ -74,3 +74,5 @@ export const MatchPage = () => { ) } + +export default MatchPage diff --git a/src/features/PlayerPage/index.tsx b/src/features/PlayerPage/index.tsx index 4efb0cb0..60d7d912 100644 --- a/src/features/PlayerPage/index.tsx +++ b/src/features/PlayerPage/index.tsx @@ -6,12 +6,11 @@ import { Matches } from 'features/Matches' import { UserFavorites } from 'features/UserFavorites' import { MainWrapper } from 'features/MainWrapper' import { MediaQuery } from 'features/MediaQuery' -import { MatchPopup } from 'features/MatchPopup' import { usePlayerPage } from './hooks' import { Content } from './styled' -export const PlayerPage = () => { +const PlayerPage = () => { const { fetchMatches, infoItems, @@ -20,7 +19,6 @@ export const PlayerPage = () => { return ( - @@ -36,3 +34,5 @@ export const PlayerPage = () => { ) } + +export default PlayerPage diff --git a/src/features/Register/index.tsx b/src/features/Register/index.tsx index 58adbec0..ab600bda 100644 --- a/src/features/Register/index.tsx +++ b/src/features/Register/index.tsx @@ -11,7 +11,7 @@ import { CardStep } from './components/CardStep' import { SubscriptionStep } from './components/SubscriptionsStep' import { RegistrationSuccessful } from './components/RegistrationSuccessful' -export const Register = () => { +const Register = () => { const isCardStep = useRouteMatch(`${PAGES.register}/card`)?.isExact || false const isSubsStep = useRouteMatch(`${PAGES.register}/subscriptions`)?.isExact || false return ( @@ -32,3 +32,5 @@ export const Register = () => { ) } + +export default Register diff --git a/src/features/TeamPage/index.tsx b/src/features/TeamPage/index.tsx index cb75fa3d..e2c088cf 100644 --- a/src/features/TeamPage/index.tsx +++ b/src/features/TeamPage/index.tsx @@ -6,12 +6,11 @@ import { Matches } from 'features/Matches' import { UserFavorites } from 'features/UserFavorites' import { MainWrapper } from 'features/MainWrapper' import { MediaQuery } from 'features/MediaQuery' -import { MatchPopup } from 'features/MatchPopup' import { useTeamPage } from './hooks' import { Content } from './styled' -export const TeamPage = () => { +const TeamPage = () => { const { fetchMatches, infoItems, @@ -20,7 +19,6 @@ export const TeamPage = () => { return ( - @@ -36,3 +34,5 @@ export const TeamPage = () => { ) } + +export default TeamPage diff --git a/src/features/TournamentPage/index.tsx b/src/features/TournamentPage/index.tsx index 01279294..d1d601de 100644 --- a/src/features/TournamentPage/index.tsx +++ b/src/features/TournamentPage/index.tsx @@ -6,12 +6,11 @@ import { Matches } from 'features/Matches' import { MainWrapper } from 'features/MainWrapper' import { UserFavorites } from 'features/UserFavorites' import { MediaQuery } from 'features/MediaQuery' -import { MatchPopup } from 'features/MatchPopup' import { useTournamentPage } from './hooks' import { Content } from './styled' -export const TournamentPage = () => { +const TournamentPage = () => { const { fetchMatches, infoItems, @@ -20,7 +19,6 @@ export const TournamentPage = () => { return ( - @@ -36,3 +34,5 @@ export const TournamentPage = () => { ) } + +export default TournamentPage diff --git a/src/features/UserAccount/components/PagePersonalInfo/index.tsx b/src/features/UserAccount/components/PagePersonalInfo/index.tsx index 753dc2b0..1f4fcaed 100644 --- a/src/features/UserAccount/components/PagePersonalInfo/index.tsx +++ b/src/features/UserAccount/components/PagePersonalInfo/index.tsx @@ -93,7 +93,6 @@ export const PagePersonalInfo = () => { onChange={updateFormValue(country)} options={countries} onSelect={onCountrySelect} - withArrow withError={false} /> { options={cities} onSelect={onCitySelect} maxLength={500} - withArrow withError={false} /> { +const UserAccount = () => { useLexicsConfig(userAccountLexics) return ( @@ -65,3 +65,5 @@ export const UserAccount = () => { ) } + +export default UserAccount diff --git a/src/features/UserFavorites/hooks/index.tsx b/src/features/UserFavorites/hooks/index.tsx index 4a7f74ee..683999b4 100644 --- a/src/features/UserFavorites/hooks/index.tsx +++ b/src/features/UserFavorites/hooks/index.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react' +import { useCallback, useState } from 'react' import type { UserFavorites } from 'requests' import { modifyUserFavorites, getUserFavorites } from 'requests' @@ -16,7 +16,7 @@ export const useUserFavorites = () => { open, } = useToggle() - useEffect(() => { + const fetchFavorites = useCallback(() => { getUserFavorites().then(setUserFavorites) }, []) @@ -27,6 +27,7 @@ export const useUserFavorites = () => { return { addRemoveFavorite, close, + fetchFavorites, isOpen, open, userFavorites, diff --git a/src/features/UserFavorites/index.tsx b/src/features/UserFavorites/index.tsx index 0d8b40fd..413cb3a6 100644 --- a/src/features/UserFavorites/index.tsx +++ b/src/features/UserFavorites/index.tsx @@ -1,5 +1,6 @@ import type { MouseEvent, FocusEvent } from 'react' -import { useState } from 'react' +import { useEffect, useState } from 'react' + import { Link } from 'react-router-dom' import map from 'lodash/map' @@ -30,12 +31,15 @@ export const UserFavorites = () => { const { addRemoveFavorite, close, + fetchFavorites, isOpen, userFavorites, } = useUserFavoritesStore() const [position, setPosition] = useState(null) + useEffect(fetchFavorites, [fetchFavorites]) + const getPosition = (event: MouseEvent | FocusEvent) => { if (event.currentTarget) { setPosition(event.currentTarget.getBoundingClientRect().top)