Update login for funkwhale

- Styling changes

src/api/controller.ts

@@ -63,7 +63,7 @@ import {
   updatePlaylist as jfUpdatePlaylist,
   getSongs as jfGetSongs,
 } from './jellyfinApi';
-import { APIEndpoints, Server, ServerType } from '../types';
+import { APIEndpoints, ServerType } from '../types';
 
 // prettier-ignore
 const endpoints = [
@@ -110,11 +110,7 @@ export const apiController = async (options: {
   args?: any;
 }) => {
   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) {
     return notifyToast('warning', `[${options.endpoint}] not available`);

src/components/settings/Config.tsx

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

src/components/settings/Login.tsx

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

src/types.ts

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