Move diffViewMode into model

Moving the diffViewMode property to the model allows any changes made
in the change page to the diffMode to reflect to the diff view
retained in the background.

Currently Gerrit has this feature where if the screen width is small
then we want to show Unified diff instead of Side by Side diff to the
user.
This is done by updating a default_diff_view property inside the
getPreferences() API call in gr-rest-api-interface. The implementation
runs into several issues which are fixed by this change.

1. The updated diff is only shown to the user if they reload the page
by requesting the preferences again.
2. Once the screen is narrowed and then expanded again, the diff view
mode remains Unified instead of reverting back to Side by Side(If the
user set that initially).

There was also the ability to temporarily change the diff mode until
the next reload but that has been removed for simplicity and now any
changes to the diff mode are reflected to the preference setting.

Change-Id: Ice95ed03faa5f05eaf650b06ba945206ca39cf6b
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
index b47c51c..3d43ef3 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
@@ -26,6 +26,9 @@
 import {FixIronA11yAnnouncer} from '../../../types/types';
 import {appContext} from '../../../services/app-context';
 import {fireIronAnnounce} from '../../../utils/event-util';
+import {diffViewMode$} from '../../../services/browser/browser-model';
+import {Subject} from 'rxjs';
+import {takeUntil} from 'rxjs/operators';
 
 @customElement('gr-diff-mode-selector')
 export class GrDiffModeSelector extends PolymerElement {
@@ -34,7 +37,7 @@
   }
 
   @property({type: String, notify: true})
-  mode?: DiffViewMode;
+  mode: DiffViewMode = DiffViewMode.SIDE_BY_SIDE;
 
   /**
    * If set to true, the user's preference will be updated every time a
@@ -48,11 +51,24 @@
 
   private readonly userService = appContext.userService;
 
+  disconnected$ = new Subject();
+
+  constructor() {
+    super();
+  }
+
   override connectedCallback() {
     super.connectedCallback();
     (
       IronA11yAnnouncer as unknown as FixIronA11yAnnouncer
     ).requestAvailability();
+    diffViewMode$
+      .pipe(takeUntil(this.disconnected$))
+      .subscribe(diffView => (this.mode = diffView));
+  }
+
+  override disconnectedCallback() {
+    this.disconnected$.next();
   }
 
   /**