Revert "fix: unique plex oauth login client id (#147)"

This reverts commit 4fca10e.

package.json

@@ -34,7 +34,6 @@
     "sharp": "^0.33.4",
     "stories-react": "^1.1.2",
     "three": "^0.166.1",
-    "uuid": "^10.0.0",
     "vanta": "^0.5.24",
     "xml2js": "^0.6.2",
     "zod": "^3.23.8"
@@ -50,7 +49,6 @@
     "@types/qs": "^6.9.15",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "@types/uuid": "^10.0.0",
     "@types/xml2js": "^0.4.14",
     "@typescript-eslint/eslint-plugin": "^7.16.1",
     "@typescript-eslint/parser": "^7.16.1",

src/lib/auth.ts

@@ -1,22 +1,15 @@
 import { AuthOptions } from 'next-auth'
 import CredentialsProvider from 'next-auth/providers/credentials'
 import qs from 'qs'
-import { v4 as uuidv4 } from 'uuid'
 import { parseStringPromise } from 'xml2js'
 import {
   APP_URL,
   PLEX_API_ENDPOINT,
-  PLEX_PRODUCT_NAME,
+  PLEX_CLIENT_IDENTIFIER,
+  PLEX_CLIENT_NAME,
 } from '../utils/constants'
 import fetchTautulli from '../utils/fetchTautulli'
 
-function getClientIdentifier(): string {
-  const clientId = localStorage.getItem('plexClientId') || uuidv4()
-  localStorage.setItem('plexClientId', clientId)
-
-  return clientId
-}
-
 export const authOptions: AuthOptions = {
   providers: [
     CredentialsProvider({
@@ -116,16 +109,18 @@ type PlexPinResponse = {
 }
 
 async function fetchPlexPins(): Promise<PlexPinResponse> {
-  const clientIdentifier = getClientIdentifier()
-
   try {
-    const res = await fetch(`${PLEX_API_ENDPOINT}/pins?strong=true`, {
+    const res = await fetch(`${PLEX_API_ENDPOINT}/pins`, {
       method: 'POST',
       headers: {
         Accept: 'application/json',
-        'X-Plex-Product': PLEX_PRODUCT_NAME,
-        'X-Plex-Client-Identifier': clientIdentifier,
+        'Content-Type': 'application/x-www-form-urlencoded',
       },
+      body: new URLSearchParams({
+        strong: 'true',
+        'X-Plex-Product': PLEX_CLIENT_NAME,
+        'X-Plex-Client-Identifier': PLEX_CLIENT_IDENTIFIER,
+      }),
     })
 
     if (!res.ok) {
@@ -144,7 +139,6 @@ async function fetchPlexPins(): Promise<PlexPinResponse> {
 export async function createPlexAuthUrl() {
   const { id, code } = await fetchPlexPins()
   const forwardUrl = `${APP_URL}?plexPinId=${id}`
-  const clientIdentifier = getClientIdentifier()
 
   if (!forwardUrl) {
     console.error('Base url is not configured!')
@@ -153,12 +147,12 @@ export async function createPlexAuthUrl() {
   const authAppUrl =
     'https://app.plex.tv/auth#?' +
     qs.stringify({
-      clientID: clientIdentifier,
+      clientID: PLEX_CLIENT_IDENTIFIER,
       code,
       forwardUrl,
       context: {
         device: {
-          product: PLEX_PRODUCT_NAME,
+          product: PLEX_CLIENT_NAME,
         },
       },
     })
@@ -167,14 +161,12 @@ export async function createPlexAuthUrl() {
 }
 
 export async function getPlexAuthToken(pinId: string) {
-  const clientIdentifier = getClientIdentifier()
-
   try {
     const res = await fetch(`${PLEX_API_ENDPOINT}/pins/${pinId}`, {
       method: 'GET',
       headers: {
         Accept: 'application/json',
-        'X-Plex-Client-Identifier': clientIdentifier,
+        'X-Plex-Client-Identifier': PLEX_CLIENT_IDENTIFIER,
       },
     })
 
@@ -193,17 +185,19 @@ export async function getPlexAuthToken(pinId: string) {
 }
 
 export async function verifyPlexAuthToken(authToken: string) {
-  const clientIdentifier = getClientIdentifier()
-
   try {
-    const res = await fetch(`${PLEX_API_ENDPOINT}/user?strong=true`, {
+    const res = await fetch(`${PLEX_API_ENDPOINT}/user`, {
       method: 'POST',
       headers: {
         Accept: 'application/json',
-        'X-Plex-Token': authToken,
-        'X-Plex-Product': PLEX_PRODUCT_NAME,
-        'X-Plex-Client-Identifier': clientIdentifier,
+        'Content-Type': 'application/x-www-form-urlencoded',
       },
+      body: new URLSearchParams({
+        strong: 'true',
+        'X-Plex-Product': PLEX_CLIENT_NAME,
+        'X-Plex-Client-Identifier': PLEX_CLIENT_IDENTIFIER,
+        'X-Plex-Token': authToken,
+      }),
     })
 
     if (!res.ok) {

src/utils/constants.ts

@@ -59,7 +59,8 @@ export const META_TITLE: string = 'Plex Rewind'
 export const META_TITLE_TEMPLATE: string = '%s | Plex Rewind'
 
 export const PLEX_API_ENDPOINT = 'https://plex.tv/api/v2'
-export const PLEX_PRODUCT_NAME = 'Plex Rewind'
+export const PLEX_CLIENT_NAME = 'Plex Rewind'
+export const PLEX_CLIENT_IDENTIFIER = 'plex-rewind'
 
 export const APP_URL = env('NEXT_PUBLIC_SITE_URL') || 'http://localhost:8383'