diff --git a/src/components/PlexLoginButton/index.tsx b/src/components/PlexLoginButton/index.tsx index 36323173..8809f5fc 100644 --- a/src/components/PlexLoginButton/index.tsx +++ b/src/components/PlexLoginButton/index.tsx @@ -1,3 +1,4 @@ +import useSettings from '@app/hooks/useSettings'; import globalMessages from '@app/i18n/globalMessages'; import PlexOAuth from '@app/utils/plex'; import { ArrowLeftOnRectangleIcon } from '@heroicons/react/24/outline'; @@ -24,11 +25,14 @@ const PlexLoginButton = ({ }: PlexLoginButtonProps) => { const intl = useIntl(); const [loading, setLoading] = useState(false); + const settings = useSettings(); const getPlexLogin = async () => { setLoading(true); try { - const authToken = await plexOAuth.login(); + const authToken = await plexOAuth.login( + settings.currentSettings.applicationTitle + ); setLoading(false); onAuthToken(authToken); } catch (e) { diff --git a/src/utils/plex.ts b/src/utils/plex.ts index f773d868..890a588e 100644 --- a/src/utils/plex.ts +++ b/src/utils/plex.ts @@ -40,8 +40,11 @@ class PlexOAuth { private popup?: Window; private authToken?: string; + private DEFAULT_APPLICATION_NAME = 'Overseerr'; - public initializeHeaders(): void { + public initializeHeaders( + applicationName = this.DEFAULT_APPLICATION_NAME + ): void { if (!window) { throw new Error( 'Window is not defined. Are you calling this in the browser?' @@ -55,10 +58,15 @@ class PlexOAuth { clientId = uuid; } + const plexProductName = + applicationName === this.DEFAULT_APPLICATION_NAME + ? applicationName + : `${applicationName} - ${this.DEFAULT_APPLICATION_NAME}`; + const browser = Bowser.getParser(window.navigator.userAgent); this.plexHeaders = { Accept: 'application/json', - 'X-Plex-Product': 'Overseerr', + 'X-Plex-Product': plexProductName, 'X-Plex-Version': 'Plex OAuth', 'X-Plex-Client-Identifier': clientId, 'X-Plex-Model': 'Plex OAuth', @@ -93,8 +101,8 @@ class PlexOAuth { this.openPopup({ title: 'Plex Auth', w: 600, h: 700 }); } - public async login(): Promise { - this.initializeHeaders(); + public async login(applicationName?: string): Promise { + this.initializeHeaders(applicationName); await this.getPin(); if (!this.plexHeaders || !this.pin) {