48 lines
1.6 KiB
TypeScript
48 lines
1.6 KiB
TypeScript
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 '../components/dashboard/elements/SectionTitleContainer';
|
|
import Page from '../components/Page';
|
|
|
|
const UserPasswordPage: FunctionComponent = () => {
|
|
const userId = getParameterByName('userId');
|
|
const [ userName, setUserName ] = useState('');
|
|
|
|
const loadUser = useCallback(() => {
|
|
window.ApiClient.getUser(userId).then(function (user) {
|
|
if (!user.Name) {
|
|
throw new Error('Unexpected null user.Name');
|
|
}
|
|
setUserName(user.Name);
|
|
});
|
|
}, [userId]);
|
|
useEffect(() => {
|
|
loadUser();
|
|
}, [loadUser]);
|
|
|
|
return (
|
|
<Page
|
|
id='userPasswordPage'
|
|
className='mainAnimatedPage type-interior userPasswordPage'
|
|
>
|
|
<div className='content-primary'>
|
|
<div className='verticalSection'>
|
|
<SectionTitleContainer
|
|
title={userName}
|
|
url='https://docs.jellyfin.org/general/server/users/'
|
|
/>
|
|
</div>
|
|
<SectionTabs activeTab='userpassword'/>
|
|
<div className='readOnlyContent'>
|
|
<UserPasswordForm
|
|
userId={userId}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</Page>
|
|
|
|
);
|
|
};
|
|
|
|
export default UserPasswordPage;
|