diff --git a/src/apps/experimental/routes/asyncRoutes/admin.ts b/src/apps/experimental/routes/asyncRoutes/admin.ts index 0f2ec6b9cf..6212330f96 100644 --- a/src/apps/experimental/routes/asyncRoutes/admin.ts +++ b/src/apps/experimental/routes/asyncRoutes/admin.ts @@ -1,10 +1,10 @@ -import { AsyncRoute } from '../../../../components/router/AsyncRoute'; +import { AsyncRoute, AsyncRouteType } from '../../../../components/router/AsyncRoute'; export const ASYNC_ADMIN_ROUTES: AsyncRoute[] = [ - { path: 'usernew.html', page: 'user/usernew' }, - { path: 'userprofiles.html', page: 'user/userprofiles' }, - { path: 'useredit.html', page: 'user/useredit' }, - { path: 'userlibraryaccess.html', page: 'user/userlibraryaccess' }, - { path: 'userparentalcontrol.html', page: 'user/userparentalcontrol' }, - { path: 'userpassword.html', page: 'user/userpassword' } + { path: 'usernew.html', page: 'user/usernew', type: AsyncRouteType.Experimental }, + { path: 'userprofiles.html', page: 'user/userprofiles', type: AsyncRouteType.Experimental }, + { path: 'useredit.html', page: 'user/useredit', type: AsyncRouteType.Experimental }, + { path: 'userlibraryaccess.html', page: 'user/userlibraryaccess', type: AsyncRouteType.Experimental }, + { path: 'userparentalcontrol.html', page: 'user/userparentalcontrol', type: AsyncRouteType.Experimental }, + { path: 'userpassword.html', page: 'user/userpassword', type: AsyncRouteType.Experimental } ]; diff --git a/src/apps/experimental/routes/asyncRoutes/user.ts b/src/apps/experimental/routes/asyncRoutes/user.ts index 44674e888c..311b691b54 100644 --- a/src/apps/experimental/routes/asyncRoutes/user.ts +++ b/src/apps/experimental/routes/asyncRoutes/user.ts @@ -1,8 +1,8 @@ -import { AsyncRoute } from '../../../../components/router/AsyncRoute'; +import { AsyncRoute, AsyncRouteType } from '../../../../components/router/AsyncRoute'; export const ASYNC_USER_ROUTES: AsyncRoute[] = [ { path: 'search.html', page: 'search' }, - { path: 'userprofile.html', page: 'user/userprofile' }, - { path: 'home.html', page: 'home' }, - { path: 'movies.html', page: 'movies' } + { path: 'userprofile.html', page: 'user/userprofile', type: AsyncRouteType.Experimental }, + { path: 'home.html', page: 'home', type: AsyncRouteType.Experimental }, + { path: 'movies.html', page: 'movies', type: AsyncRouteType.Experimental } ]; diff --git a/src/routes/home.tsx b/src/apps/experimental/routes/home.tsx similarity index 88% rename from src/routes/home.tsx rename to src/apps/experimental/routes/home.tsx index 4346106eaf..0b0e38f3b2 100644 --- a/src/routes/home.tsx +++ b/src/apps/experimental/routes/home.tsx @@ -1,15 +1,15 @@ import React, { FunctionComponent, useCallback, useEffect, useMemo, useRef } from 'react'; import { useSearchParams } from 'react-router-dom'; -import globalize from '../scripts/globalize'; -import LibraryMenu from '../scripts/libraryMenu'; -import { clearBackdrop } from '../components/backdrop/backdrop'; -import layoutManager from '../components/layoutManager'; -import * as mainTabsManager from '../components/maintabsmanager'; -import '../elements/emby-tabs/emby-tabs'; -import '../elements/emby-button/emby-button'; -import '../elements/emby-scroller/emby-scroller'; -import Page from '../components/Page'; +import globalize from '../../../scripts/globalize'; +import LibraryMenu from '../../../scripts/libraryMenu'; +import { clearBackdrop } from '../../../components/backdrop/backdrop'; +import layoutManager from '../../../components/layoutManager'; +import * as mainTabsManager from '../../../components/maintabsmanager'; +import '../../../elements/emby-tabs/emby-tabs'; +import '../../../elements/emby-button/emby-button'; +import '../../../elements/emby-scroller/emby-scroller'; +import Page from '../../../components/Page'; type OnResumeOptions = { autoFocus?: boolean; @@ -65,7 +65,7 @@ const Home: FunctionComponent = () => { depends = 'favorites'; } - return import(/* webpackChunkName: "[request]" */ `../controllers/${depends}`).then(({ default: controllerFactory }) => { + return import(/* webpackChunkName: "[request]" */ `../../../controllers/${depends}`).then(({ default: controllerFactory }) => { let controller = tabControllers[index]; if (!controller) { diff --git a/src/routes/movies/CollectionsView.tsx b/src/apps/experimental/routes/movies/CollectionsView.tsx similarity index 84% rename from src/routes/movies/CollectionsView.tsx rename to src/apps/experimental/routes/movies/CollectionsView.tsx index 6e94ad2b96..b58cc957e5 100644 --- a/src/routes/movies/CollectionsView.tsx +++ b/src/apps/experimental/routes/movies/CollectionsView.tsx @@ -1,7 +1,7 @@ import React, { FC, useCallback } from 'react'; -import ViewItemsContainer from '../../components/common/ViewItemsContainer'; -import { LibraryViewProps } from '../../types/interface'; +import ViewItemsContainer from '../../../../components/common/ViewItemsContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const CollectionsView: FC = ({ topParentId }) => { const getBasekey = useCallback(() => { diff --git a/src/routes/movies/FavoritesView.tsx b/src/apps/experimental/routes/movies/FavoritesView.tsx similarity index 81% rename from src/routes/movies/FavoritesView.tsx rename to src/apps/experimental/routes/movies/FavoritesView.tsx index cf6969bbb2..bca4227df4 100644 --- a/src/routes/movies/FavoritesView.tsx +++ b/src/apps/experimental/routes/movies/FavoritesView.tsx @@ -1,7 +1,7 @@ import React, { FC, useCallback } from 'react'; -import ViewItemsContainer from '../../components/common/ViewItemsContainer'; -import { LibraryViewProps } from '../../types/interface'; +import ViewItemsContainer from '../../../../components/common/ViewItemsContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const FavoritesView: FC = ({ topParentId }) => { const getBasekey = useCallback(() => { diff --git a/src/routes/movies/GenresView.tsx b/src/apps/experimental/routes/movies/GenresView.tsx similarity index 83% rename from src/routes/movies/GenresView.tsx rename to src/apps/experimental/routes/movies/GenresView.tsx index 24ae5f79c0..a2c1d7a476 100644 --- a/src/routes/movies/GenresView.tsx +++ b/src/apps/experimental/routes/movies/GenresView.tsx @@ -1,9 +1,9 @@ import type { BaseItemDtoQueryResult } from '@jellyfin/sdk/lib/generated-client'; import React, { FC, useCallback, useEffect, useState } from 'react'; -import loading from '../../components/loading/loading'; -import GenresItemsContainer from '../../components/common/GenresItemsContainer'; -import { LibraryViewProps } from '../../types/interface'; +import loading from '../../../../components/loading/loading'; +import GenresItemsContainer from '../../../../components/common/GenresItemsContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const GenresView: FC = ({ topParentId }) => { const [ itemsResult, setItemsResult ] = useState({}); diff --git a/src/routes/movies/MoviesView.tsx b/src/apps/experimental/routes/movies/MoviesView.tsx similarity index 82% rename from src/routes/movies/MoviesView.tsx rename to src/apps/experimental/routes/movies/MoviesView.tsx index 4103eb908c..510ed9e2b2 100644 --- a/src/routes/movies/MoviesView.tsx +++ b/src/apps/experimental/routes/movies/MoviesView.tsx @@ -1,7 +1,7 @@ import React, { FC, useCallback } from 'react'; -import ViewItemsContainer from '../../components/common/ViewItemsContainer'; -import { LibraryViewProps } from '../../types/interface'; +import ViewItemsContainer from '../../../../components/common/ViewItemsContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const MoviesView: FC = ({ topParentId }) => { const getBasekey = useCallback(() => { diff --git a/src/routes/movies/SuggestionsView.tsx b/src/apps/experimental/routes/movies/SuggestionsView.tsx similarity index 90% rename from src/routes/movies/SuggestionsView.tsx rename to src/apps/experimental/routes/movies/SuggestionsView.tsx index 0d4b944be9..48b402efbc 100644 --- a/src/routes/movies/SuggestionsView.tsx +++ b/src/apps/experimental/routes/movies/SuggestionsView.tsx @@ -1,13 +1,13 @@ import type { BaseItemDto, BaseItemDtoQueryResult, RecommendationDto } from '@jellyfin/sdk/lib/generated-client'; import React, { FC, useCallback, useEffect, useRef, useState } from 'react'; -import layoutManager from '../../components/layoutManager'; -import loading from '../../components/loading/loading'; -import dom from '../../scripts/dom'; -import globalize from '../../scripts/globalize'; -import RecommendationContainer from '../../components/common/RecommendationContainer'; -import SectionContainer from '../../components/common/SectionContainer'; -import { LibraryViewProps } from '../../types/interface'; +import layoutManager from '../../../../components/layoutManager'; +import loading from '../../../../components/loading/loading'; +import dom from '../../../../scripts/dom'; +import globalize from '../../../../scripts/globalize'; +import RecommendationContainer from '../../../../components/common/RecommendationContainer'; +import SectionContainer from '../../../../components/common/SectionContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const SuggestionsView: FC = ({ topParentId }) => { const [ latestItems, setLatestItems ] = useState([]); @@ -28,7 +28,7 @@ const SuggestionsView: FC = ({ topParentId }) => { }, [enableScrollX]); const autoFocus = useCallback((page) => { - import('../../components/autoFocuser').then(({ default: autoFocuser }) => { + import('../../../../components/autoFocuser').then(({ default: autoFocuser }) => { autoFocuser.autoFocus(page); }); }, []); diff --git a/src/routes/movies/TrailersView.tsx b/src/apps/experimental/routes/movies/TrailersView.tsx similarity index 81% rename from src/routes/movies/TrailersView.tsx rename to src/apps/experimental/routes/movies/TrailersView.tsx index 9e11d41b94..55f6189cfc 100644 --- a/src/routes/movies/TrailersView.tsx +++ b/src/apps/experimental/routes/movies/TrailersView.tsx @@ -1,8 +1,8 @@ import React, { FC, useCallback } from 'react'; -import ViewItemsContainer from '../../components/common/ViewItemsContainer'; -import { LibraryViewProps } from '../../types/interface'; +import ViewItemsContainer from '../../../../components/common/ViewItemsContainer'; +import { LibraryViewProps } from '../../../../types/interface'; const TrailersView: FC = ({ topParentId }) => { const getBasekey = useCallback(() => { diff --git a/src/routes/movies/index.tsx b/src/apps/experimental/routes/movies/index.tsx similarity index 87% rename from src/routes/movies/index.tsx rename to src/apps/experimental/routes/movies/index.tsx index 9b1405c9e5..e2e7bfa4de 100644 --- a/src/routes/movies/index.tsx +++ b/src/apps/experimental/routes/movies/index.tsx @@ -1,16 +1,16 @@ -import '../../elements/emby-scroller/emby-scroller'; -import '../../elements/emby-itemscontainer/emby-itemscontainer'; -import '../../elements/emby-tabs/emby-tabs'; -import '../../elements/emby-button/emby-button'; +import '../../../../elements/emby-scroller/emby-scroller'; +import '../../../../elements/emby-itemscontainer/emby-itemscontainer'; +import '../../../../elements/emby-tabs/emby-tabs'; +import '../../../../elements/emby-button/emby-button'; import React, { FC, useCallback, useEffect, useRef, useState } from 'react'; import { useSearchParams } from 'react-router-dom'; -import * as mainTabsManager from '../../components/maintabsmanager'; -import Page from '../../components/Page'; -import globalize from '../../scripts/globalize'; -import libraryMenu from '../../scripts/libraryMenu'; -import * as userSettings from '../../scripts/settings/userSettings'; +import * as mainTabsManager from '../../../../components/maintabsmanager'; +import Page from '../../../../components/Page'; +import globalize from '../../../../scripts/globalize'; +import libraryMenu from '../../../../scripts/libraryMenu'; +import * as userSettings from '../../../../scripts/settings/userSettings'; import CollectionsView from './CollectionsView'; import FavoritesView from './FavoritesView'; import GenresView from './GenresView'; diff --git a/src/routes/user/useredit.tsx b/src/apps/experimental/routes/user/useredit.tsx similarity index 96% rename from src/routes/user/useredit.tsx rename to src/apps/experimental/routes/user/useredit.tsx index ca013d6ca6..f099ee6407 100644 --- a/src/routes/user/useredit.tsx +++ b/src/apps/experimental/routes/user/useredit.tsx @@ -1,20 +1,21 @@ import type { SyncPlayUserAccessType, UserDto } from '@jellyfin/sdk/lib/generated-client'; import React, { FunctionComponent, useCallback, useEffect, useState, useRef } from 'react'; -import Dashboard from '../../utils/dashboard'; -import globalize from '../../scripts/globalize'; -import LibraryMenu from '../../scripts/libraryMenu'; -import ButtonElement from '../../elements/ButtonElement'; -import CheckBoxElement from '../../elements/CheckBoxElement'; -import InputElement from '../../elements/InputElement'; -import LinkEditUserPreferences from '../../components/dashboard/users/LinkEditUserPreferences'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import SectionTabs from '../../components/dashboard/users/SectionTabs'; -import loading from '../../components/loading/loading'; -import toast from '../../components/toast/toast'; -import { getParameterByName } from '../../utils/url'; import escapeHTML from 'escape-html'; -import SelectElement from '../../elements/SelectElement'; -import Page from '../../components/Page'; + +import Dashboard from '../../../../utils/dashboard'; +import globalize from '../../../../scripts/globalize'; +import LibraryMenu from '../../../../scripts/libraryMenu'; +import ButtonElement from '../../../../elements/ButtonElement'; +import CheckBoxElement from '../../../../elements/CheckBoxElement'; +import InputElement from '../../../../elements/InputElement'; +import LinkEditUserPreferences from '../../../../components/dashboard/users/LinkEditUserPreferences'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import SectionTabs from '../../../../components/dashboard/users/SectionTabs'; +import loading from '../../../../components/loading/loading'; +import toast from '../../../../components/toast/toast'; +import { getParameterByName } from '../../../../utils/url'; +import SelectElement from '../../../../elements/SelectElement'; +import Page from '../../../../components/Page'; type ResetProvider = AuthProvider & { checkedAttribute: string diff --git a/src/routes/user/userlibraryaccess.tsx b/src/apps/experimental/routes/user/userlibraryaccess.tsx similarity index 94% rename from src/routes/user/userlibraryaccess.tsx rename to src/apps/experimental/routes/user/userlibraryaccess.tsx index 657a8ec417..e255376104 100644 --- a/src/routes/user/userlibraryaccess.tsx +++ b/src/apps/experimental/routes/user/userlibraryaccess.tsx @@ -1,17 +1,17 @@ import type { UserDto } from '@jellyfin/sdk/lib/generated-client'; import React, { FunctionComponent, useCallback, useEffect, useState, useRef } from 'react'; -import loading from '../../components/loading/loading'; -import libraryMenu from '../../scripts/libraryMenu'; -import globalize from '../../scripts/globalize'; -import toast from '../../components/toast/toast'; -import SectionTabs from '../../components/dashboard/users/SectionTabs'; -import ButtonElement from '../../elements/ButtonElement'; -import { getParameterByName } from '../../utils/url'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import AccessContainer from '../../components/dashboard/users/AccessContainer'; -import CheckBoxElement from '../../elements/CheckBoxElement'; -import Page from '../../components/Page'; +import loading from '../../../../components/loading/loading'; +import libraryMenu from '../../../../scripts/libraryMenu'; +import globalize from '../../../../scripts/globalize'; +import toast from '../../../../components/toast/toast'; +import SectionTabs from '../../../../components/dashboard/users/SectionTabs'; +import ButtonElement from '../../../../elements/ButtonElement'; +import { getParameterByName } from '../../../../utils/url'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import AccessContainer from '../../../../components/dashboard/users/AccessContainer'; +import CheckBoxElement from '../../../../elements/CheckBoxElement'; +import Page from '../../../../components/Page'; type ItemsArr = { Name?: string; diff --git a/src/routes/user/usernew.tsx b/src/apps/experimental/routes/user/usernew.tsx similarity index 93% rename from src/routes/user/usernew.tsx rename to src/apps/experimental/routes/user/usernew.tsx index cc2a454744..051bbce9b7 100644 --- a/src/routes/user/usernew.tsx +++ b/src/apps/experimental/routes/user/usernew.tsx @@ -1,15 +1,15 @@ import React, { FunctionComponent, useCallback, useEffect, useState, useRef } from 'react'; -import Dashboard from '../../utils/dashboard'; -import globalize from '../../scripts/globalize'; -import loading from '../../components/loading/loading'; -import toast from '../../components/toast/toast'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import InputElement from '../../elements/InputElement'; -import ButtonElement from '../../elements/ButtonElement'; -import AccessContainer from '../../components/dashboard/users/AccessContainer'; -import CheckBoxElement from '../../elements/CheckBoxElement'; -import Page from '../../components/Page'; +import Dashboard from '../../../../utils/dashboard'; +import globalize from '../../../../scripts/globalize'; +import loading from '../../../../components/loading/loading'; +import toast from '../../../../components/toast/toast'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import InputElement from '../../../../elements/InputElement'; +import ButtonElement from '../../../../elements/ButtonElement'; +import AccessContainer from '../../../../components/dashboard/users/AccessContainer'; +import CheckBoxElement from '../../../../elements/CheckBoxElement'; +import Page from '../../../../components/Page'; type userInput = { Name?: string; diff --git a/src/routes/user/userparentalcontrol.tsx b/src/apps/experimental/routes/user/userparentalcontrol.tsx similarity index 93% rename from src/routes/user/userparentalcontrol.tsx rename to src/apps/experimental/routes/user/userparentalcontrol.tsx index fabbcacd1d..ce02ba0f33 100644 --- a/src/routes/user/userparentalcontrol.tsx +++ b/src/apps/experimental/routes/user/userparentalcontrol.tsx @@ -1,20 +1,21 @@ import type { AccessSchedule, ParentalRating, UserDto } from '@jellyfin/sdk/lib/generated-client'; import { DynamicDayOfWeek } from '@jellyfin/sdk/lib/generated-client/models/dynamic-day-of-week'; import React, { FunctionComponent, useCallback, useEffect, useState, useRef } from 'react'; -import globalize from '../../scripts/globalize'; -import LibraryMenu from '../../scripts/libraryMenu'; -import AccessScheduleList from '../../components/dashboard/users/AccessScheduleList'; -import BlockedTagList from '../../components/dashboard/users/BlockedTagList'; -import ButtonElement from '../../elements/ButtonElement'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import SectionTabs from '../../components/dashboard/users/SectionTabs'; -import loading from '../../components/loading/loading'; -import toast from '../../components/toast/toast'; -import { getParameterByName } from '../../utils/url'; -import CheckBoxElement from '../../elements/CheckBoxElement'; import escapeHTML from 'escape-html'; -import SelectElement from '../../elements/SelectElement'; -import Page from '../../components/Page'; + +import globalize from '../../../../scripts/globalize'; +import LibraryMenu from '../../../../scripts/libraryMenu'; +import AccessScheduleList from '../../../../components/dashboard/users/AccessScheduleList'; +import BlockedTagList from '../../../../components/dashboard/users/BlockedTagList'; +import ButtonElement from '../../../../elements/ButtonElement'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import SectionTabs from '../../../../components/dashboard/users/SectionTabs'; +import loading from '../../../../components/loading/loading'; +import toast from '../../../../components/toast/toast'; +import { getParameterByName } from '../../../../utils/url'; +import CheckBoxElement from '../../../../elements/CheckBoxElement'; +import SelectElement from '../../../../elements/SelectElement'; +import Page from '../../../../components/Page'; type UnratedItem = { name: string; @@ -235,7 +236,7 @@ const UserParentalControl: FunctionComponent = () => { const showSchedulePopup = (schedule: AccessSchedule, index: number) => { schedule = schedule || {}; - import('../../components/accessSchedule/accessSchedule').then(({ default: accessschedule }) => { + import('../../../../components/accessSchedule/accessSchedule').then(({ default: accessschedule }) => { accessschedule.show({ schedule: schedule }).then(function (updatedSchedule) { @@ -268,7 +269,7 @@ const UserParentalControl: FunctionComponent = () => { }; const showBlockedTagPopup = () => { - import('../../components/prompt/prompt').then(({ default: prompt }) => { + import('../../../../components/prompt/prompt').then(({ default: prompt }) => { prompt({ label: globalize.translate('LabelTag') }).then(function (value) { diff --git a/src/routes/user/userpassword.tsx b/src/apps/experimental/routes/user/userpassword.tsx similarity index 76% rename from src/routes/user/userpassword.tsx rename to src/apps/experimental/routes/user/userpassword.tsx index 5da2a2b5ef..3a518d6379 100644 --- a/src/routes/user/userpassword.tsx +++ b/src/apps/experimental/routes/user/userpassword.tsx @@ -1,10 +1,11 @@ import React, { FunctionComponent, useCallback, useEffect, useState } from 'react'; -import SectionTabs from '../../components/dashboard/users/SectionTabs'; -import UserPasswordForm from '../../components/dashboard/users/UserPasswordForm'; -import { getParameterByName } from '../../utils/url'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import Page from '../../components/Page'; -import loading from '../../components/loading/loading'; + +import SectionTabs from '../../../../components/dashboard/users/SectionTabs'; +import UserPasswordForm from '../../../../components/dashboard/users/UserPasswordForm'; +import { getParameterByName } from '../../../../utils/url'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import Page from '../../../../components/Page'; +import loading from '../../../../components/loading/loading'; const UserPassword: FunctionComponent = () => { const userId = getParameterByName('userId'); diff --git a/src/routes/user/userprofile.tsx b/src/apps/experimental/routes/user/userprofile.tsx similarity index 91% rename from src/routes/user/userprofile.tsx rename to src/apps/experimental/routes/user/userprofile.tsx index 0b35d50943..7b1575d2c1 100644 --- a/src/routes/user/userprofile.tsx +++ b/src/apps/experimental/routes/user/userprofile.tsx @@ -2,17 +2,17 @@ import type { UserDto } from '@jellyfin/sdk/lib/generated-client'; import { ImageType } from '@jellyfin/sdk/lib/generated-client/models/image-type'; import React, { FunctionComponent, useEffect, useState, useRef, useCallback } from 'react'; -import Dashboard from '../../utils/dashboard'; -import globalize from '../../scripts/globalize'; -import LibraryMenu from '../../scripts/libraryMenu'; -import { appHost } from '../../components/apphost'; -import confirm from '../../components/confirm/confirm'; -import ButtonElement from '../../elements/ButtonElement'; -import UserPasswordForm from '../../components/dashboard/users/UserPasswordForm'; -import loading from '../../components/loading/loading'; -import toast from '../../components/toast/toast'; -import { getParameterByName } from '../../utils/url'; -import Page from '../../components/Page'; +import Dashboard from '../../../../utils/dashboard'; +import globalize from '../../../../scripts/globalize'; +import LibraryMenu from '../../../../scripts/libraryMenu'; +import { appHost } from '../../../../components/apphost'; +import confirm from '../../../../components/confirm/confirm'; +import ButtonElement from '../../../../elements/ButtonElement'; +import UserPasswordForm from '../../../../components/dashboard/users/UserPasswordForm'; +import loading from '../../../../components/loading/loading'; +import toast from '../../../../components/toast/toast'; +import { getParameterByName } from '../../../../utils/url'; +import Page from '../../../../components/Page'; const UserProfile: FunctionComponent = () => { const userId = getParameterByName('userId'); diff --git a/src/routes/user/userprofiles.tsx b/src/apps/experimental/routes/user/userprofiles.tsx similarity index 84% rename from src/routes/user/userprofiles.tsx rename to src/apps/experimental/routes/user/userprofiles.tsx index 0f11fced60..1eb2c9ee2e 100644 --- a/src/routes/user/userprofiles.tsx +++ b/src/apps/experimental/routes/user/userprofiles.tsx @@ -1,18 +1,19 @@ import type { UserDto } from '@jellyfin/sdk/lib/generated-client'; import React, { FunctionComponent, useEffect, useState, useRef } from 'react'; -import Dashboard from '../../utils/dashboard'; -import globalize from '../../scripts/globalize'; -import loading from '../../components/loading/loading'; -import dom from '../../scripts/dom'; -import confirm from '../../components/confirm/confirm'; -import UserCardBox from '../../components/dashboard/users/UserCardBox'; -import SectionTitleContainer from '../../elements/SectionTitleContainer'; -import '../../elements/emby-button/emby-button'; -import '../../elements/emby-button/paper-icon-button-light'; -import '../../components/cardbuilder/card.scss'; -import '../../components/indicators/indicators.scss'; -import '../../styles/flexstyles.scss'; -import Page from '../../components/Page'; + +import Dashboard from '../../../../utils/dashboard'; +import globalize from '../../../../scripts/globalize'; +import loading from '../../../../components/loading/loading'; +import dom from '../../../../scripts/dom'; +import confirm from '../../../../components/confirm/confirm'; +import UserCardBox from '../../../../components/dashboard/users/UserCardBox'; +import SectionTitleContainer from '../../../../elements/SectionTitleContainer'; +import '../../../../elements/emby-button/emby-button'; +import '../../../../elements/emby-button/paper-icon-button-light'; +import '../../../../components/cardbuilder/card.scss'; +import '../../../../components/indicators/indicators.scss'; +import '../../../../styles/flexstyles.scss'; +import Page from '../../../../components/Page'; type MenuEntry = { name?: string; @@ -75,7 +76,7 @@ const UserProfiles: FunctionComponent = () => { icon: 'delete' }); - import('../../components/actionSheet/actionSheet').then(({ default: actionsheet }) => { + import('../../../../components/actionSheet/actionSheet').then(({ default: actionsheet }) => { actionsheet.show({ items: menuItems, positionTo: card, diff --git a/src/routes/search.tsx b/src/apps/stable/routes/search.tsx similarity index 76% rename from src/routes/search.tsx rename to src/apps/stable/routes/search.tsx index 192f90bb67..c9285f6075 100644 --- a/src/routes/search.tsx +++ b/src/apps/stable/routes/search.tsx @@ -1,12 +1,12 @@ import React, { FunctionComponent, useState } from 'react'; import { useSearchParams } from 'react-router-dom'; -import Page from '../components/Page'; -import SearchFields from '../components/search/SearchFields'; -import SearchResults from '../components/search/SearchResults'; -import SearchSuggestions from '../components/search/SearchSuggestions'; -import LiveTVSearchResults from '../components/search/LiveTVSearchResults'; -import globalize from '../scripts/globalize'; +import Page from '../../../components/Page'; +import SearchFields from '../../../components/search/SearchFields'; +import SearchResults from '../../../components/search/SearchResults'; +import SearchSuggestions from '../../../components/search/SearchSuggestions'; +import LiveTVSearchResults from '../../../components/search/LiveTVSearchResults'; +import globalize from '../../../scripts/globalize'; const Search: FunctionComponent = () => { const [ query, setQuery ] = useState(); diff --git a/src/components/AsyncPage.tsx b/src/components/AsyncPage.tsx deleted file mode 100644 index 4c1e6fa7a2..0000000000 --- a/src/components/AsyncPage.tsx +++ /dev/null @@ -1,17 +0,0 @@ -import loadable from '@loadable/component'; - -interface AsyncPageProps { - /** The relative path to the page component in the routes directory. */ - page: string -} - -/** - * Page component that uses the loadable component library to load pages defined in the routes directory asynchronously - * with code splitting. - */ -const AsyncPage = loadable( - (props: AsyncPageProps) => import(/* webpackChunkName: "[request]" */ `../routes/${props.page}`), - { cacheKey: (props: AsyncPageProps) => props.page } -); - -export default AsyncPage; diff --git a/src/components/router/AsyncRoute.tsx b/src/components/router/AsyncRoute.tsx index 6fb189e8bf..9ed49544fb 100644 --- a/src/components/router/AsyncRoute.tsx +++ b/src/components/router/AsyncRoute.tsx @@ -1,19 +1,44 @@ +import loadable from '@loadable/component'; import React from 'react'; import { Route } from 'react-router-dom'; -import AsyncPage from '../AsyncPage'; +export enum AsyncRouteType { + Stable, + Experimental +} export interface AsyncRoute { /** The URL path for this route. */ path: string /** The relative path to the page component in the routes directory. */ page: string + /** The route should use the page component from the experimental app. */ + type?: AsyncRouteType } -export const toAsyncPageRoute = (route: AsyncRoute) => ( +interface AsyncPageProps { + /** The relative path to the page component in the routes directory. */ + page: string +} + +const ExperimentalAsyncPage = loadable( + (props: { page: string }) => import(/* webpackChunkName: "[request]" */ `../../apps/experimental/routes/${props.page}`), + { cacheKey: (props: AsyncPageProps) => props.page } +); + +const StableAsyncPage = loadable( + (props: { page: string }) => import(/* webpackChunkName: "[request]" */ `../../apps/stable/routes/${props.page}`), + { cacheKey: (props: AsyncPageProps) => props.page } +); + +export const toAsyncPageRoute = ({ path, page, type = AsyncRouteType.Stable }: AsyncRoute) => ( } + key={path} + path={path} + element={( + type === AsyncRouteType.Experimental ? + : + + )} /> );