From 364d9d105ca3690fcd5f635485d7c025353bb9f1 Mon Sep 17 00:00:00 2001
From: sct <sctsnipe@gmail.com>
Date: Sun, 11 Oct 2020 00:26:49 +0000
Subject: [PATCH] fix(frontend): fix opening popups on safari

---
 src/components/PlexLoginButton/index.tsx |  5 ++++-
 src/utils/plex.ts                        | 21 ++++++++++-----------
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/components/PlexLoginButton/index.tsx b/src/components/PlexLoginButton/index.tsx
index 1f2add501..5a108fc64 100644
--- a/src/components/PlexLoginButton/index.tsx
+++ b/src/components/PlexLoginButton/index.tsx
@@ -31,7 +31,10 @@ const PlexLoginButton: React.FC<PlexLoginButtonProps> = ({
     <span className="block w-full rounded-md shadow-sm">
       <button
         type="button"
-        onClick={() => getPlexLogin()}
+        onClick={() => {
+          plexOAuth.preparePopup();
+          setTimeout(() => getPlexLogin(), 1500);
+        }}
         disabled={loading}
         className="plex-button"
       >
diff --git a/src/utils/plex.ts b/src/utils/plex.ts
index 400ef7eb5..25b58a6d5 100644
--- a/src/utils/plex.ts
+++ b/src/utils/plex.ts
@@ -72,6 +72,10 @@ class PlexOAuth {
     }
   }
 
+  public preparePopup(): void {
+    this.openPopup({ title: 'Plex Auth', w: 600, h: 700 });
+  }
+
   public async login(): Promise<string> {
     try {
       this.initializeHeaders();
@@ -98,12 +102,12 @@ class PlexOAuth {
         'context[device][layout]': 'desktop',
         code: this.pin.code,
       };
-      this.openPopup({
-        url: `https://app.plex.tv/auth/#!?${this.encodeData(params)}`,
-        title: 'Plex Auth',
-        w: 600,
-        h: 700,
-      });
+
+      if (this.popup) {
+        this.popup.location.href = `https://app.plex.tv/auth/#!?${this.encodeData(
+          params
+        )}`;
+      }
 
       return this.pinPoll();
     } catch (e) {
@@ -150,12 +154,10 @@ class PlexOAuth {
   }
 
   private openPopup({
-    url,
     title,
     w,
     h,
   }: {
-    url: string;
     title: string;
     w: number;
     h: number;
@@ -199,9 +201,6 @@ class PlexOAuth {
     if (newWindow) {
       newWindow.focus();
       this.popup = newWindow;
-      setTimeout(() => {
-        newWindow.location.href = url;
-      }, 1500);
       return this.popup;
     }
   }