Browse Source

Update login for funkwhale

- Styling changes
master
jeffvli 3 years ago
committed by Jeff
parent
commit
eb596a76b4
  1. 8
      src/api/controller.ts
  2. 8
      src/components/settings/Config.tsx
  3. 46
      src/components/settings/Login.tsx
  4. 3
      src/types.ts

8
src/api/controller.ts

@ -63,7 +63,7 @@ import {
updatePlaylist as jfUpdatePlaylist, updatePlaylist as jfUpdatePlaylist,
getSongs as jfGetSongs, getSongs as jfGetSongs,
} from './jellyfinApi'; } from './jellyfinApi';
import { APIEndpoints, Server, ServerType } from '../types'; import { APIEndpoints, ServerType } from '../types';
// prettier-ignore // prettier-ignore
const endpoints = [ const endpoints = [
@ -110,11 +110,7 @@ export const apiController = async (options: {
args?: any; args?: any;
}) => { }) => {
const selectedEndpoint = endpoints.find((e) => e.id === options.endpoint); const selectedEndpoint = endpoints.find((e) => e.id === options.endpoint);
// If the serverType is funkwhale call the subsonic endpoint const selectedEndpointFn = selectedEndpoint!.endpoint[options.serverType];
const selectedEndpointFn =
options.serverType === Server.Funkwhale
? selectedEndpoint!.endpoint[Server.Subsonic]
: selectedEndpoint!.endpoint[options.serverType];
if (!selectedEndpointFn || !selectedEndpoint) { if (!selectedEndpointFn || !selectedEndpoint) {
return notifyToast('warning', `[${options.endpoint}] not available`); return notifyToast('warning', `[${options.endpoint}] not available`);

8
src/components/settings/Config.tsx

@ -40,9 +40,6 @@ const Config = () => {
}, []); }, []);
useEffect(() => { useEffect(() => {
// skip scan status if server type is funkwhale
if (config.serverType === 'funkwhale') return setScanProgress(0);
// Check scan status on render // Check scan status on render
apiController({ serverType: config.serverType, endpoint: 'getScanStatus' }) apiController({ serverType: config.serverType, endpoint: 'getScanStatus' })
.then((status) => { .then((status) => {
@ -56,9 +53,6 @@ const Config = () => {
}, [config.serverType]); }, [config.serverType]);
useEffect(() => { useEffect(() => {
// skip scan status if server type is funkwhale
if (config.serverType === 'funkwhale') return setScanProgress(0);
// Reload scan status on interval during scan // Reload scan status on interval during scan
if (isScanning) { if (isScanning) {
const interval = setInterval(() => { const interval = setInterval(() => {
@ -131,7 +125,6 @@ const Config = () => {
sidetitle={<DisconnectButton />} sidetitle={<DisconnectButton />}
subsidetitle={ subsidetitle={
<ButtonToolbar> <ButtonToolbar>
{useAppSelector((state) => state.config).serverType !== 'funkwhale' && (
<> <>
<StyledButton <StyledButton
size="sm" size="sm"
@ -148,7 +141,6 @@ const Config = () => {
{isScanning ? `${scanProgress}` : 'Scan'} {isScanning ? `${scanProgress}` : 'Scan'}
</StyledButton> </StyledButton>
</> </>
)}
<Whisper <Whisper
trigger="click" trigger="click"
placement="auto" placement="auto"

46
src/components/settings/Login.tsx

@ -2,20 +2,22 @@ import React, { useRef, useState } from 'react';
import md5 from 'md5'; import md5 from 'md5';
import randomstring from 'randomstring'; import randomstring from 'randomstring';
import settings from 'electron-settings'; import settings from 'electron-settings';
import { Button, Form, ControlLabel, Message } from 'rsuite'; import { Form, ControlLabel, Message, RadioGroup } from 'rsuite';
import axios from 'axios'; import axios from 'axios';
import setDefaultSettings from '../shared/setDefaultSettings'; import setDefaultSettings from '../shared/setDefaultSettings';
import { import {
StyledButton,
StyledCheckbox, StyledCheckbox,
StyledInput, StyledInput,
StyledInputPicker,
StyledInputPickerContainer, StyledInputPickerContainer,
StyledRadio,
} from '../shared/styled'; } from '../shared/styled';
import { LoginPanel } from './styled'; import { LoginPanel } from './styled';
import GenericPage from '../layout/GenericPage'; import GenericPage from '../layout/GenericPage';
import logo from '../../../assets/icon.png'; import logo from '../../../assets/icon.png';
import { mockSettings } from '../../shared/mockSettings'; import { mockSettings } from '../../shared/mockSettings';
import packageJson from '../../package.json'; import packageJson from '../../package.json';
import { Server } from '../../types';
const Login = () => { const Login = () => {
const [serverType, setServerType] = useState('subsonic'); const [serverType, setServerType] = useState('subsonic');
@ -34,17 +36,9 @@ const Login = () => {
try { try {
const testConnection = legacyAuth const testConnection = legacyAuth
? serverType === 'subsonic'
? await axios.get( ? await axios.get(
`${cleanServerName}/rest/getScanStatus?v=1.15.0&c=sonixd&f=json&u=${userName}&p=${password}`
)
: await axios.get(
`${cleanServerName}/rest/ping?v=1.15.0&c=sonixd&f=json&u=${userName}&p=${password}` `${cleanServerName}/rest/ping?v=1.15.0&c=sonixd&f=json&u=${userName}&p=${password}`
) )
: serverType === 'subsonic'
? await axios.get(
`${cleanServerName}/rest/getScanStatus?v=1.15.0&c=sonixd&f=json&u=${userName}&s=${salt}&t=${hash}`
)
: await axios.get( : await axios.get(
`${cleanServerName}/rest/ping?v=1.15.0&c=sonixd&f=json&u=${userName}&s=${salt}&t=${hash}` `${cleanServerName}/rest/ping?v=1.15.0&c=sonixd&f=json&u=${userName}&s=${salt}&t=${hash}`
); );
@ -66,7 +60,7 @@ const Login = () => {
localStorage.setItem('server', cleanServerName); localStorage.setItem('server', cleanServerName);
localStorage.setItem('serverBase64', btoa(cleanServerName)); localStorage.setItem('serverBase64', btoa(cleanServerName));
localStorage.setItem('serverType', serverType); localStorage.setItem('serverType', 'subsonic');
localStorage.setItem('username', userName); localStorage.setItem('username', userName);
localStorage.setItem('password', password); localStorage.setItem('password', password);
localStorage.setItem('salt', salt); localStorage.setItem('salt', salt);
@ -74,7 +68,7 @@ const Login = () => {
settings.setSync('server', cleanServerName); settings.setSync('server', cleanServerName);
settings.setSync('serverBase64', btoa(cleanServerName)); settings.setSync('serverBase64', btoa(cleanServerName));
settings.setSync('serverType', serverType); settings.setSync('serverType', 'subsonic');
settings.setSync('username', userName); settings.setSync('username', userName);
settings.setSync('password', password); settings.setSync('password', password);
settings.setSync('salt', salt); settings.setSync('salt', salt);
@ -143,19 +137,15 @@ const Login = () => {
<Form id="login-form" fluid style={{ paddingTop: '20px' }}> <Form id="login-form" fluid style={{ paddingTop: '20px' }}>
<StyledInputPickerContainer ref={serverTypePickerRef}> <StyledInputPickerContainer ref={serverTypePickerRef}>
<ControlLabel>Server type</ControlLabel> <ControlLabel>Server type</ControlLabel>
<StyledInputPicker <RadioGroup
container={() => serverTypePickerRef.current} inline
cleanable={false}
data={[
{ label: 'Subsonic', value: 'subsonic' },
{ label: 'Jellyfin', value: 'jellyfin' },
{ label: 'Funkwhale', value: 'funkwhale' },
]}
defaultValue="subsonic" defaultValue="subsonic"
valueKey="value" value={serverType}
labelKey="label" onChange={(e: Server) => setServerType(e)}
onChange={(e: 'subsonic' | 'jellyfin' | 'funkwhale') => setServerType(e)} >
/> <StyledRadio value="subsonic">Subsonic</StyledRadio>
<StyledRadio value="jellyfin">Jellyfin</StyledRadio>
</RadioGroup>
</StyledInputPickerContainer> </StyledInputPickerContainer>
<br /> <br />
<ControlLabel>Server</ControlLabel> <ControlLabel>Server</ControlLabel>
@ -164,6 +154,7 @@ const Login = () => {
name="servername" name="servername"
value={serverName} value={serverName}
onChange={(e: string) => setServerName(e)} onChange={(e: string) => setServerName(e)}
placeholder="Requires http(s)://"
/> />
<br /> <br />
<ControlLabel>Username</ControlLabel> <ControlLabel>Username</ControlLabel>
@ -172,6 +163,7 @@ const Login = () => {
name="name" name="name"
value={userName} value={userName}
onChange={(e: string) => setUserName(e)} onChange={(e: string) => setUserName(e)}
placeholder="Enter username"
/> />
<br /> <br />
<ControlLabel>Password</ControlLabel> <ControlLabel>Password</ControlLabel>
@ -181,6 +173,7 @@ const Login = () => {
type="password" type="password"
value={password} value={password}
onChange={(e: string) => setPassword(e)} onChange={(e: string) => setPassword(e)}
placeholder="Enter password"
/> />
<br /> <br />
{serverType !== 'jellyfin' && ( {serverType !== 'jellyfin' && (
@ -202,16 +195,15 @@ const Login = () => {
<br /> <br />
</> </>
)} )}
<Button <StyledButton
id="login-button" id="login-button"
appearance="primary" appearance="primary"
type="submit" type="submit"
color="green"
block block
onClick={serverType !== 'jellyfin' ? handleConnect : handleConnectJellyfin} onClick={serverType !== 'jellyfin' ? handleConnect : handleConnectJellyfin}
> >
Connect Connect
</Button> </StyledButton>
</Form> </Form>
</LoginPanel> </LoginPanel>
</GenericPage> </GenericPage>

3
src/types.ts

@ -1,7 +1,6 @@
export enum Server { export enum Server {
Subsonic = 'subsonic', Subsonic = 'subsonic',
Jellyfin = 'jellyfin', Jellyfin = 'jellyfin',
Funkwhale = 'funkwhale',
} }
export enum Item { export enum Item {
@ -13,7 +12,7 @@ export enum Item {
Playlist = 'playlist', Playlist = 'playlist',
} }
export type ServerType = Server.Subsonic | Server.Jellyfin | Server.Funkwhale; export type ServerType = Server.Subsonic | Server.Jellyfin;
export type APIEndpoints = export type APIEndpoints =
| 'getPlaylist' | 'getPlaylist'

Loading…
Cancel
Save