✨ Add support for qBittorrent in AddAppShelfItem

src/components/AppShelf/AddAppShelfItem.tsx

@@ -74,6 +74,8 @@ export function AddAppShelfItemForm(props: { setOpened: (b: boolean) => void } &
       icon: props.icon ?? '/favicon.svg',
       url: props.url ?? '',
       apiKey: props.apiKey ?? (undefined as unknown as string),
+      username: props.username ?? (undefined as unknown as string),
+      password: props.password ?? (undefined as unknown as string),
     },
     validate: {
       apiKey: () => null,
@@ -188,6 +190,30 @@ export function AddAppShelfItemForm(props: { setOpened: (b: boolean) => void } &
               error={form.errors.apiKey && 'Invalid API key'}
             />
           )}
+          {form.values.type === 'qBittorrent' && (
+            <>
+              <TextInput
+                required
+                label="Username"
+                placeholder="admin"
+                value={form.values.username}
+                onChange={(event) => {
+                  form.setFieldValue('username', event.currentTarget.value);
+                }}
+                error={form.errors.username && 'Invalid username'}
+              />
+              <TextInput
+                required
+                label="Password"
+                placeholder="adminadmin"
+                value={form.values.password}
+                onChange={(event) => {
+                  form.setFieldValue('password', event.currentTarget.value);
+                }}
+                error={form.errors.password && 'Invalid password'}
+              />
+            </>
+          )}
         </Group>
 
         <Group grow position="center" mt="xl">

src/components/AppShelf/AppShelfMenu.tsx

@@ -27,6 +27,8 @@ export default function AppShelfMenu(props: any) {
           url={service.url}
           icon={service.icon}
           apiKey={service.apiKey}
+          login={service.login}
+          password={service.password}
           message="Save service"
         />
       </Modal>