From e3221ca3ed66886aa1246c9941142b00d59d8748 Mon Sep 17 00:00:00 2001
From: Shawn Tabrizi <shawntabrizi@gmail.com>
Date: Mon, 6 Sep 2021 04:57:36 -0400
Subject: [PATCH] Add configurable notifications (#767)

* initial

* bump ui-keyring

* update names

* lint

Co-authored-by: Jaco Greeff <jacogr@gmail.com>
---
 .../src/background/handlers/State.ts          | 26 ++++++++++++++++---
 .../src/partials/MenuSettings.tsx             | 25 ++++++++++++++++++
 .../public/locales/en/translation.json        |  3 ++-
 3 files changed, 49 insertions(+), 5 deletions(-)

diff --git a/packages/extension-base/src/background/handlers/State.ts b/packages/extension-base/src/background/handlers/State.ts
index 6db07384..81f1fe1a 100644
--- a/packages/extension-base/src/background/handlers/State.ts
+++ b/packages/extension-base/src/background/handlers/State.ts
@@ -9,6 +9,7 @@ import { BehaviorSubject } from 'rxjs';
 
 import { addMetadata, knownMetadata } from '@polkadot/extension-chains';
 import chrome from '@polkadot/extension-inject/chrome';
+import settings from '@polkadot/ui-settings';
 import { assert } from '@polkadot/util';
 
 import { MetadataStore } from '../../stores';
@@ -59,17 +60,30 @@ interface SignRequest extends Resolver<ResponseSigning> {
 
 let idCounter = 0;
 
-const WINDOW_OPTS: chrome.windows.CreateData = {
-  // This is not allowed on FF, only on Chrome - disable completely
-  // focused: true,
+const NOTIFICATION_URL = chrome.extension.getURL('notification.html');
+
+const POPUP_WINDOW_OPTS: chrome.windows.CreateData = {
+  focused: true,
   height: 621,
   left: 150,
   top: 150,
   type: 'popup',
-  url: chrome.extension.getURL('notification.html'),
+  url: NOTIFICATION_URL,
   width: 560
 };
 
+const NORMAL_WINDOW_OPTS: chrome.windows.CreateData = {
+  focused: true,
+  type: 'normal',
+  url: NOTIFICATION_URL
+};
+
+export enum NotificationOptions {
+  None,
+  Normal,
+  PopUp,
+}
+
 const AUTH_URLS_KEY = 'authUrls';
 
 function getId (): string {
@@ -162,6 +176,10 @@ export default class State {
   }
 
   private popupOpen (): void {
+    if (settings.notification === 'extension') { return; }
+
+    const WINDOW_OPTS = settings.notification === 'window' ? NORMAL_WINDOW_OPTS : POPUP_WINDOW_OPTS;
+
     chrome.windows.create({ ...WINDOW_OPTS }, (window?: chrome.windows.Window): void => {
       if (window) {
         this.#windows.push(window.id || 0);
diff --git a/packages/extension-ui/src/partials/MenuSettings.tsx b/packages/extension-ui/src/partials/MenuSettings.tsx
index cb630f1c..b3c140ad 100644
--- a/packages/extension-ui/src/partials/MenuSettings.tsx
+++ b/packages/extension-ui/src/partials/MenuSettings.tsx
@@ -25,6 +25,9 @@ interface Props extends ThemeProps {
   reference: React.MutableRefObject<null>;
 }
 
+const notificationOptions = ['Extension', 'PopUp', 'Window']
+  .map((item) => ({ text: item, value: item.toLowerCase() }));
+
 const prefixOptions = settings.availablePrefixes
   .filter(({ value }) => value !== -1)
   .map(({ text, value }): Option => ({ text, value: `${value}` }));
@@ -33,6 +36,7 @@ function MenuSettings ({ className, reference }: Props): React.ReactElement<Prop
   const { t } = useTranslation();
   const [camera, setCamera] = useState(settings.camera === 'on');
   const [prefix, setPrefix] = useState(`${settings.prefix === -1 ? 42 : settings.prefix}`);
+  const [notification, setNotification] = useState(settings.notification);
   const themeContext = useContext<Theme>(ThemeContext);
   const setTheme = useContext(ThemeSwitchContext);
   const isPopup = useIsPopup();
@@ -51,6 +55,14 @@ function MenuSettings ({ className, reference }: Props): React.ReactElement<Prop
     []
   );
 
+  const _onChangeNotification = useCallback(
+    (value: string): void => {
+      setNotification(value);
+      settings.set({ notification: value });
+    },
+    []
+  );
+
   const _onChangeTheme = useCallback(
     (checked: boolean): void => setTheme(checked ? 'dark' : 'light'),
     [setTheme]
@@ -137,6 +149,19 @@ function MenuSettings ({ className, reference }: Props): React.ReactElement<Prop
           value={settings.i18nLang}
         />
       </MenuItem>
+      <MenuDivider />
+      <MenuItem
+        className='setting'
+        title={t<string>('Notifications')}
+      >
+        <Dropdown
+          className='dropdown'
+          label=''
+          onChange={_onChangeNotification}
+          options={notificationOptions}
+          value={notification}
+        />
+      </MenuItem>
       {isPopup && (
         <>
           <MenuDivider />
diff --git a/packages/extension/public/locales/en/translation.json b/packages/extension/public/locales/en/translation.json
index fea681fc..a6ccff63 100644
--- a/packages/extension/public/locales/en/translation.json
+++ b/packages/extension/public/locales/en/translation.json
@@ -158,5 +158,6 @@
   "Export all accounts": "",
   "All account": "",
   "password for encrypting all accounts": "",
-  "I want to export all my accounts": ""
+  "I want to export all my accounts": "",
+  "Notifications": ""
 }