feat(jellyfn-auth): added crude error handling
This commit is contained in:
parent
1511870766
commit
e396d9844c
2 changed files with 41 additions and 23 deletions
|
|
@ -1,4 +1,4 @@
|
|||
import axios from "axios";
|
||||
import axios, { AxiosError } from "axios";
|
||||
|
||||
const DeviceInfoString = "MediaBrowser Client=JellyGlass, Device=JellyGlass, DeviceId=JellyGlass, Version=1";
|
||||
|
||||
|
|
@ -12,26 +12,32 @@ export interface QuickConnectAuth {
|
|||
AccessToken: string;
|
||||
}
|
||||
|
||||
export const BeginQuickConnect = async (url: string, callback: (apiToken: string) => void, isCancelled: () => boolean): Promise<string> => {
|
||||
export const BeginQuickConnect = async (url: string, callback: (apiToken: string) => void, isCancelled: () => boolean, onError: (e: AxiosError) => void): Promise<string> => {
|
||||
const response = await axios.post<QuickConnectInfo>(`${url}/QuickConnect/Initiate`, {}, { headers: { Authorization: DeviceInfoString } });
|
||||
|
||||
setTimeout(() => { PollQuickConnect(url, response.data, callback, isCancelled) });
|
||||
setTimeout(() => { PollQuickConnect(url, response.data, callback, isCancelled, onError) });
|
||||
|
||||
return response.data.Code;
|
||||
}
|
||||
|
||||
const PollQuickConnect = async (url: string, info: QuickConnectInfo, callback: (apiToken: string) => void, isCancelled: () => boolean) => {
|
||||
const PollQuickConnect = async (url: string, info: QuickConnectInfo, callback: (apiToken: string) => void, isCancelled: () => boolean, onError: (e: AxiosError) => void) => {
|
||||
if (isCancelled()) {
|
||||
return;
|
||||
}
|
||||
|
||||
const response = await axios.get<QuickConnectInfo>(`${url}/QuickConnect/Connect?secret=${info.Secret}`, { headers: { Authorization: DeviceInfoString } });
|
||||
try {
|
||||
const response = await axios.get<QuickConnectInfo>(`${url}/QuickConnect/Connect?secret=${info.Secret}`, { headers: { Authorization: DeviceInfoString } });
|
||||
|
||||
if (response.data.Authenticated) {
|
||||
const authResponse = await axios.post<QuickConnectAuth>(`${url}/Users/AuthenticateWithQuickConnect`, { Secret: response.data.Secret })
|
||||
callback(authResponse.data.AccessToken);
|
||||
if (response.data.Authenticated) {
|
||||
const authResponse = await axios.post<QuickConnectAuth>(`${url}/Users/AuthenticateWithQuickConnect`, { Secret: response.data.Secret })
|
||||
callback(authResponse.data.AccessToken);
|
||||
}
|
||||
else {
|
||||
setTimeout(() => { PollQuickConnect(url, response.data, callback, isCancelled, onError) }, 5000)
|
||||
}
|
||||
}
|
||||
else {
|
||||
setTimeout(() => { PollQuickConnect(url, response.data, callback, isCancelled) }, 5000)
|
||||
catch (e) {
|
||||
console.log(e);
|
||||
onError(e as AxiosError);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,14 +1,16 @@
|
|||
import { useEffect, useState } from "react";
|
||||
import { Button, Form, Spinner, Table } from "react-bootstrap";
|
||||
import { Button, Form, Modal, Spinner, Table } from "react-bootstrap";
|
||||
import { AddServer, getServerList, RemoveServer, type Server } from "../../../Lib/Servers";
|
||||
import { useImmer } from "use-immer";
|
||||
import styles from "../Management.module.scss";
|
||||
import { BeginQuickConnect } from "../../../Lib/QuickConnect";
|
||||
import type { AxiosError } from "axios";
|
||||
|
||||
|
||||
const ServerManagement = () => {
|
||||
const [servers, setServers] = useImmer<Array<Server> | undefined>(undefined);
|
||||
const [addCancelled, setAddCancelled] = useState(false);
|
||||
const [isCancelled, setIsCancelled] = useState(false);
|
||||
const [quickConnectCode, setQuickConnectCode] = useState<string | undefined>(undefined);
|
||||
|
||||
const [addServerInfo, setAddServerInfo] = useImmer({
|
||||
url: "",
|
||||
|
|
@ -39,24 +41,23 @@ const ServerManagement = () => {
|
|||
}
|
||||
|
||||
const onQuickConnect = () => {
|
||||
//start quick connect request
|
||||
//show quick connect code to user (modal)
|
||||
//poll quick connect state until it's authenticated
|
||||
//fetch quick connect credentials
|
||||
//onServerAdd(token);
|
||||
BeginQuickConnect(addServerInfo.url, onServerAdd, () => addCancelled).then(quickConnectCode => {
|
||||
//show modal with code
|
||||
alert(`Your quick connect code is ${quickConnectCode}`);
|
||||
setIsCancelled(false);
|
||||
BeginQuickConnect(addServerInfo.url, onServerAdd, () => isCancelled, onQuickConnectError).then(code => {
|
||||
setQuickConnectCode(code);
|
||||
}).catch(err => {
|
||||
//alert user to error
|
||||
//possibly clear fields?
|
||||
console.log(err);
|
||||
alert(err);
|
||||
});
|
||||
}
|
||||
|
||||
const onQuickConnectError = (e: AxiosError) => {
|
||||
setIsCancelled(true);
|
||||
setQuickConnectCode(undefined);
|
||||
alert(e);
|
||||
}
|
||||
|
||||
const onServerAdd = (apiToken: string) => {
|
||||
//hide quick connect modal
|
||||
setQuickConnectCode(undefined);
|
||||
AddServer(addServerInfo.owner, addServerInfo.url, apiToken).then(result => {
|
||||
if (result.errored) {
|
||||
alert("Server was added, but is not working. Check the logs for details");
|
||||
|
|
@ -121,6 +122,17 @@ const ServerManagement = () => {
|
|||
}
|
||||
</tbody>
|
||||
</Table>
|
||||
<Modal show={quickConnectCode !== undefined} onHide={() => { setQuickConnectCode(undefined); setIsCancelled(true); }}>
|
||||
<Modal.Header>
|
||||
<Modal.Title>Jellyfin quick connect code</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
Your quick connect code is {quickConnectCode}
|
||||
</Modal.Body>
|
||||
<Modal.Footer>
|
||||
<Button onClick={() => { setQuickConnectCode(undefined); setIsCancelled(true); }}>Cancel</Button>
|
||||
</Modal.Footer>
|
||||
</Modal>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue