feat: remove email requirement for jellyfin/emby non-admin users

src/components/Login/JellyfinLogin.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import Button from '../Common/Button';
 
@@ -7,7 +7,6 @@ import * as Yup from 'yup';
 import axios from 'axios';
 import { useToasts } from 'react-toast-notifications';
 import useSettings from '../../hooks/useSettings';
-import AddEmailModal from './AddEmailModal';
 
 const messages = defineMessages({
   username: 'Username',
@@ -38,9 +37,6 @@ const JellyfinLogin: React.FC<JellyfinLoginProps> = ({
   revalidate,
   initial,
 }) => {
-  const [requiresEmail, setRequiresEmail] = useState<number>(0);
-  const [username, setUsername] = useState<string>();
-  const [password, setPassword] = useState<string>();
   const toasts = useToasts();
   const intl = useIntl();
   const settings = useSettings();
@@ -195,14 +191,6 @@ const JellyfinLogin: React.FC<JellyfinLoginProps> = ({
     });
     return (
       <div>
-        {requiresEmail == 1 && (
-          <AddEmailModal
-            username={username ?? ''}
-            password={password ?? ''}
-            onSave={revalidate}
-            onClose={() => setRequiresEmail(0)}
-          ></AddEmailModal>
-        )}
         <Formik
           initialValues={{
             username: '',
@@ -214,25 +202,20 @@ const JellyfinLogin: React.FC<JellyfinLoginProps> = ({
               await axios.post('/api/v1/auth/jellyfin', {
                 username: values.username,
                 password: values.password,
+                email: values.username,
               });
             } catch (e) {
-              if (e.message === 'Request failed with status code 406') {
+              toasts.addToast(
-                setUsername(values.username);
+                intl.formatMessage(
-                setPassword(values.password);
+                  e.message == 'Request failed with status code 401'
-                setRequiresEmail(1);
+                    ? messages.credentialerror
-              } else {
+                    : messages.loginerror
-                toasts.addToast(
+                ),
-                  intl.formatMessage(
+                {
-                    e.message == 'Request failed with status code 401'
+                  autoDismiss: true,
-                      ? messages.credentialerror
+                  appearance: 'error',
-                      : messages.loginerror
+                }
-                  ),
+              );
-                  {
-                    autoDismiss: true,
-                    appearance: 'error',
-                  }
-                );
-              }
             } finally {
               revalidate();
             }

src/components/Login/LocalLogin.tsx

@@ -10,6 +10,7 @@ import Button from '../Common/Button';
 import SensitiveInput from '../Common/SensitiveInput';
 
 const messages = defineMessages({
+  username: 'Username',
   email: 'Email Address',
   password: 'Password',
   validationemailrequired: 'You must provide a valid email address',
@@ -30,9 +31,9 @@ const LocalLogin: React.FC<LocalLoginProps> = ({ revalidate }) => {
   const [loginError, setLoginError] = useState<string | null>(null);
 
   const LoginSchema = Yup.object().shape({
-    email: Yup.string()
+    email: Yup.string().required(
-      .email()
+      intl.formatMessage(messages.validationemailrequired)
-      .required(intl.formatMessage(messages.validationemailrequired)),
+    ),
     password: Yup.string().required(
       intl.formatMessage(messages.validationpasswordrequired)
     ),
@@ -68,7 +69,9 @@ const LocalLogin: React.FC<LocalLoginProps> = ({ revalidate }) => {
             <Form>
               <div>
                 <label htmlFor="email" className="text-label">
-                  {intl.formatMessage(messages.email)}
+                  {intl.formatMessage(messages.email) +
+                    ' / ' +
+                    intl.formatMessage(messages.username)}
                 </label>
                 <div className="mt-1 mb-2 sm:col-span-2 sm:mt-0">
                   <div className="form-input-field">