Pass notification settings to background (#819)

* Pass notification settings to background

* Feedback

packages/extension-base/src/background/handlers/Extension.ts

@@ -590,6 +590,9 @@ export default class Extension {
       case 'pri(seed.validate)':
         return this.seedValidate(request as RequestSeedValidate);
 
+      case 'pri(settings.notification)':
+        return this.#state.setNotification(request as string);
+
       case 'pri(signing.approve.password)':
         return this.signingApprovePassword(request as RequestSigningApprovePassword);
 

packages/extension-base/src/background/handlers/State.ts

@@ -102,6 +102,8 @@ export default class State {
 
   readonly #metaRequests: Record<string, MetaRequest> = {};
 
+  #notification = settings.notification;
+
   // Map of all providers exposed by the extension, they are retrievable by key
   readonly #providers: Providers;
 
@@ -176,15 +178,16 @@ 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);
-      }
-    });
+    this.#notification !== 'extension' &&
+      chrome.windows.create(
+        this.#notification === 'window'
+          ? NORMAL_WINDOW_OPTS
+          : POPUP_WINDOW_OPTS,
+        (window): void => {
+          if (window) {
+            this.#windows.push(window.id || 0);
+          }
+        });
   }
 
   private authComplete = (id: string, resolve: (result: boolean) => void, reject: (error: Error) => void): Resolver<boolean> => {
@@ -455,6 +458,12 @@ export default class State {
     addMetadata(meta);
   }
 
+  public setNotification (notification: string): boolean {
+    this.#notification = notification;
+
+    return true;
+  }
+
   public sign (url: string, request: RequestSign, account: AccountJson): Promise<ResponseSigning> {
     const id = getId();
 

packages/extension-base/src/background/types.ts

@@ -103,6 +103,7 @@ export interface RequestSignatures {
   'pri(metadata.list)': [null, MetadataDef[]];
   'pri(seed.create)': [RequestSeedCreate, ResponseSeedCreate];
   'pri(seed.validate)': [RequestSeedValidate, ResponseSeedValidate];
+  'pri(settings.notification)': [string, boolean];
   'pri(signing.approve.password)': [RequestSigningApprovePassword, boolean];
   'pri(signing.approve.signature)': [RequestSigningApproveSignature, boolean];
   'pri(signing.cancel)': [RequestSigningCancel, boolean];

packages/extension-ui/src/messaging.ts

@@ -231,3 +231,7 @@ export async function jsonRestore (file: KeyringPair$Json, password: string): Pr
 export async function batchRestore (file: KeyringPairs$Json, password: string): Promise<void> {
   return sendMessage('pri(json.batchRestore)', { file, password });
 }
+
+export async function setNotification (notification: string): Promise<boolean> {
+  return sendMessage('pri(settings.notification)', notification);
+}

packages/extension-ui/src/partials/MenuSettings.tsx

@@ -12,7 +12,7 @@ import settings from '@polkadot/ui-settings';
 import { ActionContext, ActionText, Checkbox, Dropdown, Menu, MenuDivider, MenuItem, Svg, Switch, themes, ThemeSwitchContext } from '../components';
 import useIsPopup from '../hooks/useIsPopup';
 import useTranslation from '../hooks/useTranslation';
-import { windowOpen } from '../messaging';
+import { setNotification, windowOpen } from '../messaging';
 import getLanguageOptions from '../util/getLanguageOptions';
 
 interface Option {
@@ -36,7 +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 [notification, updateNotification] = useState(settings.notification);
   const themeContext = useContext<Theme>(ThemeContext);
   const setTheme = useContext(ThemeSwitchContext);
   const isPopup = useIsPopup();
@@ -57,7 +57,9 @@ function MenuSettings ({ className, reference }: Props): React.ReactElement<Prop
 
   const _onChangeNotification = useCallback(
     (value: string): void => {
-      setNotification(value);
+      setNotification(value).catch(console.error);
+
+      updateNotification(value);
       settings.set({ notification: value });
     },
     []
@@ -69,7 +71,7 @@ function MenuSettings ({ className, reference }: Props): React.ReactElement<Prop
   );
 
   const _onWindowOpen = useCallback(
-    () => windowOpen('/'),
+    () => windowOpen('/').catch(console.error),
     []
   );