diff --git a/src/controllers/user/menu/index.html b/src/controllers/user/menu/index.html
index 185dad7c7d..2741f89282 100644
--- a/src/controllers/user/menu/index.html
+++ b/src/controllers/user/menu/index.html
@@ -3,7 +3,7 @@
         <div class="readOnlyContent" style="margin: 0 auto;">
             <div class="verticalSection verticalSection-extrabottompadding">
                 <h2 class="sectionTitle headerUsername" style="padding-left:.25em;"></h2>
-                <a is="emby-linkbutton" data-ripple="false" href="#" style="display:block;padding:0;margin:0;" class="lnkMyProfile listItem-border">
+                <a is="emby-linkbutton" data-ripple="false" href="#" style="display:block;padding:0;margin:0;" class="lnkUserProfile listItem-border">
                     <div class="listItem">
                         <span class="material-icons listItemIcon listItemIcon-transparent person" aria-hidden="true"></span>
                         <div class="listItemBody">
diff --git a/src/controllers/user/menu/index.js b/src/controllers/user/menu/index.js
index 0dce218036..69606f1d05 100644
--- a/src/controllers/user/menu/index.js
+++ b/src/controllers/user/menu/index.js
@@ -26,7 +26,7 @@ export default function (view, params) {
         const userId = params.userId || Dashboard.getCurrentUserId();
         const page = this;
 
-        page.querySelector('.lnkMyProfile').setAttribute('href', '#/myprofile.html?userId=' + userId);
+        page.querySelector('.lnkUserProfile').setAttribute('href', '#/userprofile.html?userId=' + userId);
         page.querySelector('.lnkDisplayPreferences').setAttribute('href', '#/mypreferencesdisplay.html?userId=' + userId);
         page.querySelector('.lnkHomePreferences').setAttribute('href', '#/mypreferenceshome.html?userId=' + userId);
         page.querySelector('.lnkPlaybackPreferences').setAttribute('href', '#/mypreferencesplayback.html?userId=' + userId);
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index abddc81170..6d23886c57 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -2,32 +2,32 @@ import React from 'react';
 import { Route, Routes } from 'react-router-dom';
 
 import ConnectionRequired from '../components/ConnectionRequired';
-import NewUserPage from './NewUserPage';
-import SearchPage from './search';
-import UserEditPage from './UserEditPage';
-import UserLibraryAccessPage from './UserLibraryAccessPage';
-import UserParentalControl from './UserParentalControl';
-import UserPasswordPage from './UserPasswordPage';
-import UserProfilePage from './UserProfilePage';
-import UserProfilesPage from './UserProfilesPage';
+import UserNew from './user/usernew';
+import Search from './search';
+import UserEdit from './user/useredit';
+import UserLibraryAccess from './user/userlibraryaccess';
+import UserParentalControl from './user/userparentalcontrol';
+import UserPassword from './user/userpassword';
+import UserProfile from './user/userprofile';
+import UserProfiles from './user/userprofiles';
 
 const AppRoutes = () => (
     <Routes>
         <Route path='/'>
             {/* User routes */}
             <Route path='/' element={<ConnectionRequired />}>
-                <Route path='search.html' element={<SearchPage />} />
-                <Route path='myprofile.html' element={<UserProfilePage />} />
+                <Route path='search.html' element={<Search />} />
+                <Route path='userprofile.html' element={<UserProfile />} />
             </Route>
 
             {/* Admin routes */}
             <Route path='/' element={<ConnectionRequired isAdminRequired={true} />}>
-                <Route path='usernew.html' element={<NewUserPage />} />
-                <Route path='userprofiles.html' element={<UserProfilesPage />} />
-                <Route path='useredit.html' element={<UserEditPage />} />
-                <Route path='userlibraryaccess.html' element={<UserLibraryAccessPage />} />
+                <Route path='usernew.html' element={<UserNew />} />
+                <Route path='userprofiles.html' element={<UserProfiles />} />
+                <Route path='useredit.html' element={<UserEdit />} />
+                <Route path='userlibraryaccess.html' element={<UserLibraryAccess />} />
                 <Route path='userparentalcontrol.html' element={<UserParentalControl />} />
-                <Route path='userpassword.html' element={<UserPasswordPage />} />
+                <Route path='userpassword.html' element={<UserPassword />} />
             </Route>
 
             {/* Suppress warnings for unhandled routes */}
diff --git a/src/routes/search.tsx b/src/routes/search.tsx
index 121f93143b..059a81783f 100644
--- a/src/routes/search.tsx
+++ b/src/routes/search.tsx
@@ -8,7 +8,7 @@ import SearchSuggestions from '../components/search/SearchSuggestions';
 import LiveTVSearchResults from '../components/search/LiveTVSearchResults';
 import globalize from '../scripts/globalize';
 
-const SearchPage: FunctionComponent = () => {
+const Search: FunctionComponent = () => {
     const [ query, setQuery ] = useState<string>();
     const [ searchParams ] = useSearchParams();
 
@@ -41,4 +41,4 @@ const SearchPage: FunctionComponent = () => {
     );
 };
 
-export default SearchPage;
+export default Search;
diff --git a/src/routes/UserEditPage.tsx b/src/routes/user/useredit.tsx
similarity index 96%
rename from src/routes/UserEditPage.tsx
rename to src/routes/user/useredit.tsx
index 618a74b42f..95b9bef8ac 100644
--- a/src/routes/UserEditPage.tsx
+++ b/src/routes/user/useredit.tsx
@@ -1,20 +1,20 @@
 import { SyncPlayUserAccessType, UserDto } from '@thornbill/jellyfin-sdk/dist/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 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 SelectElement from '../../elements/SelectElement';
+import Page from '../../components/Page';
 
 type ItemsArr = {
     Name?: string;
@@ -27,7 +27,7 @@ type ProvidersArr = {
     Id?: string;
 }
 
-const UserEditPage: FunctionComponent = () => {
+const UserEdit: FunctionComponent = () => {
     const [ userName, setUserName ] = useState('');
     const [ deleteFoldersAccess, setDeleteFoldersAccess ] = useState<ItemsArr[]>([]);
     const [ authProviders, setAuthProviders ] = useState<ProvidersArr[]>([]);
@@ -578,4 +578,4 @@ const UserEditPage: FunctionComponent = () => {
     );
 };
 
-export default UserEditPage;
+export default UserEdit;
diff --git a/src/routes/UserLibraryAccessPage.tsx b/src/routes/user/userlibraryaccess.tsx
similarity index 94%
rename from src/routes/UserLibraryAccessPage.tsx
rename to src/routes/user/userlibraryaccess.tsx
index 80fdedbd7d..9ebeadd1ad 100644
--- a/src/routes/UserLibraryAccessPage.tsx
+++ b/src/routes/user/userlibraryaccess.tsx
@@ -1,17 +1,17 @@
 import { UserDto } from '@thornbill/jellyfin-sdk/dist/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;
@@ -20,7 +20,7 @@ type ItemsArr = {
     checkedAttribute?: string
 }
 
-const UserLibraryAccessPage: FunctionComponent = () => {
+const UserLibraryAccess: FunctionComponent = () => {
     const [ userName, setUserName ] = useState('');
     const [channelsItems, setChannelsItems] = useState<ItemsArr[]>([]);
     const [mediaFoldersItems, setMediaFoldersItems] = useState<ItemsArr[]>([]);
@@ -318,4 +318,4 @@ const UserLibraryAccessPage: FunctionComponent = () => {
     );
 };
 
-export default UserLibraryAccessPage;
+export default UserLibraryAccess;
diff --git a/src/routes/NewUserPage.tsx b/src/routes/user/usernew.tsx
similarity index 93%
rename from src/routes/NewUserPage.tsx
rename to src/routes/user/usernew.tsx
index 95cba0b4c5..acb5e5f038 100644
--- a/src/routes/NewUserPage.tsx
+++ b/src/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;
@@ -21,7 +21,7 @@ type ItemsArr = {
     Id?: string;
 }
 
-const NewUserPage: FunctionComponent = () => {
+const UserNew: FunctionComponent = () => {
     const [ channelsItems, setChannelsItems ] = useState<ItemsArr[]>([]);
     const [ mediaFoldersItems, setMediaFoldersItems ] = useState<ItemsArr[]>([]);
     const element = useRef<HTMLDivElement>(null);
@@ -263,4 +263,4 @@ const NewUserPage: FunctionComponent = () => {
     );
 };
 
-export default NewUserPage;
+export default UserNew;
diff --git a/src/routes/UserParentalControl.tsx b/src/routes/user/userparentalcontrol.tsx
similarity index 94%
rename from src/routes/UserParentalControl.tsx
rename to src/routes/user/userparentalcontrol.tsx
index a4bc24e28f..0277d158a3 100644
--- a/src/routes/UserParentalControl.tsx
+++ b/src/routes/user/userparentalcontrol.tsx
@@ -1,19 +1,19 @@
 import { AccessSchedule, DynamicDayOfWeek, UserDto } from '@thornbill/jellyfin-sdk/dist/generated-client';
 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 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 SelectElement from '../../elements/SelectElement';
+import Page from '../../components/Page';
 
 type RatingsArr = {
     Name: string;
@@ -242,7 +242,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) {
@@ -275,7 +275,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/UserPasswordPage.tsx b/src/routes/user/userpassword.tsx
similarity index 74%
rename from src/routes/UserPasswordPage.tsx
rename to src/routes/user/userpassword.tsx
index 576f28ffdd..e1a66dab1f 100644
--- a/src/routes/UserPasswordPage.tsx
+++ b/src/routes/user/userpassword.tsx
@@ -1,12 +1,12 @@
 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 UserPasswordPage: FunctionComponent = () => {
+const UserPassword: FunctionComponent = () => {
     const userId = getParameterByName('userId');
     const [ userName, setUserName ] = useState('');
 
@@ -48,4 +48,4 @@ const UserPasswordPage: FunctionComponent = () => {
     );
 };
 
-export default UserPasswordPage;
+export default UserPassword;
diff --git a/src/routes/UserProfilePage.tsx b/src/routes/user/userprofile.tsx
similarity index 91%
rename from src/routes/UserProfilePage.tsx
rename to src/routes/user/userprofile.tsx
index 14dfec22a5..137749bda5 100644
--- a/src/routes/UserProfilePage.tsx
+++ b/src/routes/user/userprofile.tsx
@@ -1,19 +1,19 @@
 import { ImageType, UserDto } from '@thornbill/jellyfin-sdk/dist/generated-client';
 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 UserProfilePage: FunctionComponent = () => {
+const UserProfile: FunctionComponent = () => {
     const userId = getParameterByName('userId');
     const [ userName, setUserName ] = useState('');
 
@@ -197,4 +197,4 @@ const UserProfilePage: FunctionComponent = () => {
     );
 };
 
-export default UserProfilePage;
+export default UserProfile;
diff --git a/src/routes/UserProfilesPage.tsx b/src/routes/user/userprofiles.tsx
similarity index 87%
rename from src/routes/UserProfilesPage.tsx
rename to src/routes/user/userprofiles.tsx
index 5f293f526d..0f59f6fefc 100644
--- a/src/routes/UserProfilesPage.tsx
+++ b/src/routes/user/userprofiles.tsx
@@ -1,18 +1,18 @@
 import { UserDto } from '@thornbill/jellyfin-sdk/dist/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 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 '../assets/css/flexstyles.scss';
-import Page from '../components/Page';
+import Page from '../../components/Page';
 
 type MenuEntry = {
     name?: string;
@@ -20,7 +20,7 @@ type MenuEntry = {
     icon?: string;
 }
 
-const UserProfilesPage: FunctionComponent = () => {
+const UserProfiles: FunctionComponent = () => {
     const [ users, setUsers ] = useState<UserDto[]>([]);
 
     const element = useRef<HTMLDivElement>(null);
@@ -75,7 +75,7 @@ const UserProfilesPage: FunctionComponent = () => {
                 icon: 'delete'
             });
 
-            import('../components/actionSheet/actionSheet').then(({default: actionsheet}) => {
+            import('../../components/actionSheet/actionSheet').then(({default: actionsheet}) => {
                 actionsheet.show({
                     items: menuItems,
                     positionTo: card,
@@ -159,4 +159,4 @@ const UserProfilesPage: FunctionComponent = () => {
     );
 };
 
-export default UserProfilesPage;
+export default UserProfiles;