|
|
|
@ -5,13 +5,7 @@ import { Form, ControlLabel, Message, RadioGroup } from 'rsuite'; |
|
|
|
import axios from 'axios'; |
|
|
|
import { useTranslation } from 'react-i18next'; |
|
|
|
import { settings, setDefaultSettings } from '../shared/setDefaultSettings'; |
|
|
|
import { |
|
|
|
StyledButton, |
|
|
|
StyledCheckbox, |
|
|
|
StyledInput, |
|
|
|
StyledInputPickerContainer, |
|
|
|
StyledRadio, |
|
|
|
} from '../shared/styled'; |
|
|
|
import { StyledButton, StyledInput } from '../shared/styled'; |
|
|
|
import { LoginPanel } from './styled'; |
|
|
|
import GenericPage from '../layout/GenericPage'; |
|
|
|
import logo from '../../../assets/icon.png'; |
|
|
|
@ -21,13 +15,14 @@ import { Server } from '../../types'; |
|
|
|
|
|
|
|
const Login = () => { |
|
|
|
const { t } = useTranslation(); |
|
|
|
const [serverType, setServerType] = useState('subsonic'); |
|
|
|
const [serverName, setServerName] = useState(''); |
|
|
|
// const serverType = 'subsonic';
|
|
|
|
const serverName = 'https://tunio.blago.cloud'; |
|
|
|
const [userName, setUserName] = useState(''); |
|
|
|
const [password, setPassword] = useState(''); |
|
|
|
const [legacyAuth, setLegacyAuth] = useState(false); |
|
|
|
// const [legacyAuth, setLegacyAuth] = useState(true);
|
|
|
|
const legacyAuth = true; |
|
|
|
const [message, setMessage] = useState(''); |
|
|
|
const serverTypePickerRef = useRef(null); |
|
|
|
// const serverTypePickerRef = useRef(null);
|
|
|
|
|
|
|
|
const handleConnect = async () => { |
|
|
|
setMessage(''); |
|
|
|
@ -80,52 +75,6 @@ const Login = () => { |
|
|
|
window.location.reload(); |
|
|
|
}; |
|
|
|
|
|
|
|
const handleConnectJellyfin = async () => { |
|
|
|
setMessage(''); |
|
|
|
const cleanServerName = serverName.replace(/\/$/, ''); |
|
|
|
const deviceId = randomstring.generate({ length: 12, charset: 'alphanumeric' }); |
|
|
|
|
|
|
|
try { |
|
|
|
const { data } = await axios.post( |
|
|
|
`${cleanServerName}/users/authenticatebyname`, |
|
|
|
{ |
|
|
|
Username: userName, |
|
|
|
Pw: password, |
|
|
|
}, |
|
|
|
{ |
|
|
|
headers: { |
|
|
|
'X-Emby-Authorization': `MediaBrowser Client="Sonixd", Device="PC", DeviceId="${deviceId}", Version="${packageJson.version}"`, |
|
|
|
}, |
|
|
|
} |
|
|
|
); |
|
|
|
|
|
|
|
localStorage.setItem('server', cleanServerName); |
|
|
|
localStorage.setItem('serverBase64', btoa(cleanServerName)); |
|
|
|
localStorage.setItem('serverType', 'jellyfin'); |
|
|
|
localStorage.setItem('username', data.User.Id); |
|
|
|
localStorage.setItem('token', data.AccessToken); |
|
|
|
localStorage.setItem('deviceId', deviceId); |
|
|
|
|
|
|
|
settings.set('server', cleanServerName); |
|
|
|
settings.set('serverBase64', btoa(cleanServerName)); |
|
|
|
settings.set('serverType', 'jellyfin'); |
|
|
|
settings.set('username', data.User.Id); |
|
|
|
settings.set('token', data.AccessToken); |
|
|
|
settings.set('deviceId', deviceId); |
|
|
|
} catch (err) { |
|
|
|
if (err instanceof Error) { |
|
|
|
setMessage(`${err.message}`); |
|
|
|
return; |
|
|
|
} |
|
|
|
setMessage(t('An unknown error occurred')); |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
// Set defaults on login
|
|
|
|
setDefaultSettings(false); |
|
|
|
window.location.reload(); |
|
|
|
}; |
|
|
|
|
|
|
|
return ( |
|
|
|
<GenericPage hideDivider> |
|
|
|
<LoginPanel bordered> |
|
|
|
@ -136,27 +85,6 @@ const Login = () => { |
|
|
|
<br /> |
|
|
|
{message !== '' && <Message type="error" description={message} />} |
|
|
|
<Form id="login-form" fluid style={{ paddingTop: '20px' }}> |
|
|
|
<StyledInputPickerContainer ref={serverTypePickerRef}> |
|
|
|
<ControlLabel>{t('Server type')}</ControlLabel> |
|
|
|
<RadioGroup |
|
|
|
inline |
|
|
|
defaultValue="subsonic" |
|
|
|
value={serverType} |
|
|
|
onChange={(e: Server) => setServerType(e)} |
|
|
|
> |
|
|
|
<StyledRadio value="subsonic">Subsonic</StyledRadio> |
|
|
|
<StyledRadio value="jellyfin">Jellyfin</StyledRadio> |
|
|
|
</RadioGroup> |
|
|
|
</StyledInputPickerContainer> |
|
|
|
<br /> |
|
|
|
<ControlLabel>{t('Server')}</ControlLabel> |
|
|
|
<StyledInput |
|
|
|
id="login-servername" |
|
|
|
name="servername" |
|
|
|
value={serverName} |
|
|
|
onChange={(e: string) => setServerName(e)} |
|
|
|
placeholder={t('Requires http(s)://')} |
|
|
|
/> |
|
|
|
<br /> |
|
|
|
<ControlLabel>{t('Username')}</ControlLabel> |
|
|
|
<StyledInput |
|
|
|
@ -177,31 +105,12 @@ const Login = () => { |
|
|
|
placeholder={t('Enter password')} |
|
|
|
/> |
|
|
|
<br /> |
|
|
|
{serverType !== 'jellyfin' && ( |
|
|
|
<> |
|
|
|
<StyledCheckbox |
|
|
|
defaultChecked={ |
|
|
|
process.env.NODE_ENV === 'test' |
|
|
|
? mockSettings.legacyAuth |
|
|
|
: Boolean(settings.get('legacyAuth')) |
|
|
|
} |
|
|
|
checked={legacyAuth} |
|
|
|
onChange={(_v: any, e: boolean) => { |
|
|
|
settings.set('legacyAuth', e); |
|
|
|
setLegacyAuth(e); |
|
|
|
}} |
|
|
|
> |
|
|
|
{t('Legacy auth (plaintext)')} |
|
|
|
</StyledCheckbox> |
|
|
|
<br /> |
|
|
|
</> |
|
|
|
)} |
|
|
|
<StyledButton |
|
|
|
id="login-button" |
|
|
|
appearance="primary" |
|
|
|
type="submit" |
|
|
|
block |
|
|
|
onClick={serverType !== 'jellyfin' ? handleConnect : handleConnectJellyfin} |
|
|
|
onClick={handleConnect} |
|
|
|
> |
|
|
|
{t('Connect')} |
|
|
|
</StyledButton> |
|
|
|
|
