mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

move SectionTitleContainer into its own Components

Browse source
This commit is contained in:
grafixeyehero 2022-01-05 21:53:15 +03:00 • committed by grafixeyehero
parent ed6ca6b097
commit 01d29bcf11
6 changed files with 36 additions and 67 deletions
Download patch file Download diff file Expand all files Collapse all files

25
src/components/dashboard/users/SectionTitleContainer.tsx Normal file
View file

@ -0,0 +1,25 @@
import React, { FunctionComponent } from 'react';
import SectionTitleLinkElement from './SectionTitleLinkElement';
type IProps = {
title: string;
}
const SectionTitleContainer: FunctionComponent<IProps> = ({title}: IProps) => {
return (
<div className='verticalSection'>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle'>
{title}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
);
};
export default SectionTitleContainer;

16
src/components/pages/NewUserPage.tsx
View file

@ -4,8 +4,7 @@ import Dashboard from '../../utils/dashboard';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import loading from '../loading/loading'; import loading from '../loading/loading';
import toast from '../toast/toast'; import toast from '../toast/toast';
import SectionTitleContainer from '../dashboard/users/SectionTitleContainer';
import SectionTitleLinkElement from '../dashboard/users/SectionTitleLinkElement';
import InputElement from '../dashboard/users/InputElement'; import InputElement from '../dashboard/users/InputElement';
import CheckBoxElement from '../dashboard/users/CheckBoxElement'; import CheckBoxElement from '../dashboard/users/CheckBoxElement';
import CheckBoxListItem from '../dashboard/users/CheckBoxListItem'; import CheckBoxListItem from '../dashboard/users/CheckBoxListItem';
@ -178,18 +177,7 @@ const NewUserPage: FunctionComponent = () => {
return ( return (
<div ref={element}> <div ref={element}>
<div className='content-primary'> <div className='content-primary'>
<div className='verticalSection'> <SectionTitleContainer title={globalize.translate('ButtonAddUser')}/>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle'>
{globalize.translate('ButtonAddUser')}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
<form className='newUserProfileForm'> <form className='newUserProfileForm'>
<div className='inputContainer'> <div className='inputContainer'>
<InputElement <InputElement

15
src/components/pages/UserEditPage.tsx
View file

@ -8,7 +8,7 @@ import CheckBoxElement from '../dashboard/users/CheckBoxElement';
import CheckBoxListItem from '../dashboard/users/CheckBoxListItem'; import CheckBoxListItem from '../dashboard/users/CheckBoxListItem';
import InputElement from '../dashboard/users/InputElement'; import InputElement from '../dashboard/users/InputElement';
import LinkEditUserPreferences from '../dashboard/users/LinkEditUserPreferences'; import LinkEditUserPreferences from '../dashboard/users/LinkEditUserPreferences';
import SectionTitleLinkElement from '../dashboard/users/SectionTitleLinkElement'; import SectionTitleContainer from '../dashboard/users/SectionTitleContainer';
import SelectElement from '../dashboard/users/SelectElement'; import SelectElement from '../dashboard/users/SelectElement';
import SelectSyncPlayAccessElement from '../dashboard/users/SelectSyncPlayAccessElement'; import SelectSyncPlayAccessElement from '../dashboard/users/SelectSyncPlayAccessElement';
import SectionTabs from '../dashboard/users/SectionTabs'; import SectionTabs from '../dashboard/users/SectionTabs';
@ -278,18 +278,7 @@ const UserEditPage: FunctionComponent = () => {
return ( return (
<div ref={element}> <div ref={element}>
<div className='content-primary'> <div className='content-primary'>
<div className='verticalSection'> <SectionTitleContainer title={userName}/>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle username'>
{userName}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
<SectionTabs activeTab='useredit'/> <SectionTabs activeTab='useredit'/>
<div <div
className='lnkEditUserPreferencesContainer' className='lnkEditUserPreferencesContainer'

15
src/components/pages/UserLibraryAccessPage.tsx
View file

@ -5,12 +5,12 @@ import loading from '../loading/loading';
import libraryMenu from '../../scripts/libraryMenu'; import libraryMenu from '../../scripts/libraryMenu';
import globalize from '../../scripts/globalize'; import globalize from '../../scripts/globalize';
import toast from '../toast/toast'; import toast from '../toast/toast';
import SectionTitleLinkElement from '../dashboard/users/SectionTitleLinkElement';
import SectionTabs from '../dashboard/users/SectionTabs'; import SectionTabs from '../dashboard/users/SectionTabs';
import CheckBoxElement from '../dashboard/users/CheckBoxElement'; import CheckBoxElement from '../dashboard/users/CheckBoxElement';
import CheckBoxListItem from '../dashboard/users/CheckBoxListItem'; import CheckBoxListItem from '../dashboard/users/CheckBoxListItem';
import ButtonElement from '../dashboard/users/ButtonElement'; import ButtonElement from '../dashboard/users/ButtonElement';
import { getParameterByName } from '../../utils/url'; import { getParameterByName } from '../../utils/url';
import SectionTitleContainer from '../dashboard/users/SectionTitleContainer';
type ItemsArr = { type ItemsArr = {
Name?: string; Name?: string;
@ -228,18 +228,7 @@ const UserLibraryAccessPage: FunctionComponent = () => {
return ( return (
<div ref={element}> <div ref={element}>
<div className='content-primary'> <div className='content-primary'>
<div className='verticalSection'> <SectionTitleContainer title={userName}/>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle username'>
{userName}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
<SectionTabs activeTab='userlibraryaccess'/> <SectionTabs activeTab='userlibraryaccess'/>
<form className='userLibraryAccessForm'> <form className='userLibraryAccessForm'>
<div className='folderAccessContainer'> <div className='folderAccessContainer'>

15
src/components/pages/UserParentalControl.tsx
View file

@ -7,7 +7,7 @@ import BlockedTagList from '../dashboard/users/BlockedTagList';
import ButtonElement from '../dashboard/users/ButtonElement'; import ButtonElement from '../dashboard/users/ButtonElement';
import CheckBoxListItem from '../dashboard/users/CheckBoxListItem'; import CheckBoxListItem from '../dashboard/users/CheckBoxListItem';
import SectionTitleButtonElement from '../dashboard/users/SectionTitleButtonElement'; import SectionTitleButtonElement from '../dashboard/users/SectionTitleButtonElement';
import SectionTitleLinkElement from '../dashboard/users/SectionTitleLinkElement'; import SectionTitleContainer from '../dashboard/users/SectionTitleContainer';
import SelectMaxParentalRating from '../dashboard/users/SelectMaxParentalRating'; import SelectMaxParentalRating from '../dashboard/users/SelectMaxParentalRating';
import SectionTabs from '../dashboard/users/SectionTabs'; import SectionTabs from '../dashboard/users/SectionTabs';
import loading from '../loading/loading'; import loading from '../loading/loading';
@ -319,18 +319,7 @@ const UserParentalControl: FunctionComponent = () => {
return ( return (
<div ref={element}> <div ref={element}>
<div className='content-primary'> <div className='content-primary'>
<div className='verticalSection'> <SectionTitleContainer title={userName}/>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle username'>
{userName}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
<SectionTabs activeTab='userparentalcontrol'/> <SectionTabs activeTab='userparentalcontrol'/>
<form className='userParentalControlForm'> <form className='userParentalControlForm'>
<div className='selectContainer'> <div className='selectContainer'>

15
src/components/pages/UserPasswordPage.tsx
View file

@ -1,8 +1,8 @@
import React, { FunctionComponent, useCallback, useEffect, useState } from 'react'; import React, { FunctionComponent, useCallback, useEffect, useState } from 'react';
import SectionTitleLinkElement from '../dashboard/users/SectionTitleLinkElement';
import SectionTabs from '../dashboard/users/SectionTabs'; import SectionTabs from '../dashboard/users/SectionTabs';
import UserPasswordForm from '../dashboard/users/UserPasswordForm'; import UserPasswordForm from '../dashboard/users/UserPasswordForm';
import { getParameterByName } from '../../utils/url'; import { getParameterByName } from '../../utils/url';
import SectionTitleContainer from '../dashboard/users/SectionTitleContainer';
const UserPasswordPage: FunctionComponent = () => { const UserPasswordPage: FunctionComponent = () => {
const userId = getParameterByName('userId'); const userId = getParameterByName('userId');
@ -23,18 +23,7 @@ const UserPasswordPage: FunctionComponent = () => {
return ( return (
<div> <div>
<div className='content-primary'> <div className='content-primary'>
<div className='verticalSection'> <SectionTitleContainer title={userName}/>
<div className='sectionTitleContainer flex align-items-center'>
<h2 className='sectionTitle username'>
{userName}
</h2>
<SectionTitleLinkElement
className='raised button-alt headerHelpButton'
title='Help'
url='https://docs.jellyfin.org/general/server/users/'
/>
</div>
</div>
<SectionTabs activeTab='userpassword'/> <SectionTabs activeTab='userpassword'/>
<div className='readOnlyContent'> <div className='readOnlyContent'>
<UserPasswordForm <UserPasswordForm