Store number of files displayed in _viewState

Previously, if a user viewed more files or expanded all files, navigated
to a diff view, and back to the file list, it would not preserve the
state that it was left in.

Because the Polymer elements are recreated when the change view reloads,
the number of files shown property is reset to the default value.

This change adds an attribute in _viewState.changeView to store the
number of files shown. It preserves the state of the change view when
navigating to pages of a different type (ex: diff) and then back to the
change view. When a new change view is rendered (with a different
change number), the default files shown is reset.

Bug: Issue 5877
Change-Id: I36f9bc64b7d64a23a41c195b2e8188daf47d063f

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html

@@ -463,7 +463,8 @@ limitations under the License.
             revisions="[[_change.revisions]]"
             project-config="[[_projectConfig]]"
             selected-index="{{viewState.selectedFileIndex}}"
-            diff-view-mode="{{viewState.diffMode}}"></gr-file-list>
+            diff-view-mode="{{viewState.diffMode}}"
+            num-files-shown="{{_numFilesShown}}"></gr-file-list>
       </section>
       <gr-messages-list id="messageList"
           change-num="[[_changeNum]]"

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.js

@@ -22,6 +22,7 @@
   var COMMENT_SAVE = 'Saving... Try again after all comments are saved.';
 
   var MIN_LINES_FOR_COMMIT_COLLAPSE = 30;
+  var DEFAULT_NUM_FILES_SHOWN = 75;
 
   // Maximum length for patch set descriptions.
   var PATCH_DESC_MAX_LENGTH = 500;
@@ -68,7 +69,10 @@
         type: Object,
         value: function() { return document.body; },
       },
-
+      _numFilesShown: {
+        type: Number,
+        observer: '_numFilesShownChanged',
+      },
       _account: {
         type: Object,
         value: {},
@@ -188,6 +192,9 @@
         }
       }.bind(this));
 
+      this._numFilesShown = this.viewState.numFilesShown ?
+          this.viewState.numFilesShown : DEFAULT_NUM_FILES_SHOWN;
+
       this.addEventListener('comment-save', this._handleCommentSave.bind(this));
       this.addEventListener('comment-discard',
           this._handleCommentDiscard.bind(this));
@@ -471,6 +478,10 @@
       }
     },
 
+    _numFilesShownChanged: function(numFilesShown) {
+      this.viewState.numFilesShown = numFilesShown;
+    },
+
     _maybeScrollToMessage: function() {
       var msgPrefix = '#message-';
       var hash = window.location.hash;
@@ -530,6 +541,7 @@
         // Reset the diff mode to null when navigating from one change to
         // another, so that the user's preference is restored.
         this.set('viewState.diffMode', null);
+        this.set('_numFilesShown', DEFAULT_NUM_FILES_SHOWN);
      }
       this.set('viewState.changeNum', this._changeNum);
       this.set('viewState.patchRange', this._patchRange);

polygerrit-ui/app/elements/change/gr-change-view/gr-change-view_test.html

@@ -374,8 +374,12 @@ limitations under the License.
       };
       element.viewState.changeNum = null;
       element.viewState.diffMode = 'UNIFIED';
+      assert.equal(element.viewState.numFilesShown, 75);
+      assert.equal(element._numFilesShown, 75);
+      element._numFilesShown = 150;
       flushAsynchronousOperations();
       assert.equal(element.viewState.diffMode, 'UNIFIED');
+      assert.equal(element.viewState.numFilesShown, 150);
 
       element._changeNum = '1';
       element.params = {changeNum: '1'};
@@ -390,6 +394,8 @@ limitations under the License.
       flushAsynchronousOperations();
       assert.isNull(element.viewState.diffMode);
       assert.equal(element.viewState.changeNum, '2');
+      assert.equal(element.viewState.numFilesShown, 75);
+      assert.equal(element._numFilesShown, 75);
     });
 
     test('patch num change', function(done) {

polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html

@@ -362,14 +362,14 @@ limitations under the License.
     <gr-button
         class="fileListButton"
         id="incrementButton"
-        hidden$="[[_computeFileListButtonHidden(_numFilesShown, _files)]]"
+        hidden$="[[_computeFileListButtonHidden(numFilesShown, _files)]]"
         link on-tap="_incrementNumFilesShown">
-      [[_computeIncrementText(_numFilesShown, _files)]]
+      [[_computeIncrementText(numFilesShown, _files)]]
     </gr-button>
     <gr-button
         class="fileListButton"
         id="showAllButton"
-        hidden$="[[_computeFileListButtonHidden(_numFilesShown, _files)]]"
+        hidden$="[[_computeFileListButtonHidden(numFilesShown, _files)]]"
         link on-tap="_showAllFiles">
       [[_computeShowAllText(_files)]]
     </gr-button>

polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.js

@@ -72,9 +72,9 @@
       _userPrefs: Object,
       _localPrefs: Object,
       _showInlineDiffs: Boolean,
-      _numFilesShown: {
+      numFilesShown: {
         type: Number,
-        value: 75,
+        notify: true,
       },
       _patchChange: {
         type: Object,
@@ -95,7 +95,7 @@
       },
       _shownFiles: {
         type: Array,
-        computed: '_computeFilesShown(_numFilesShown, _files.*)',
+        computed: '_computeFilesShown(numFilesShown, _files.*)',
       },
       // Caps the number of files that can be shown and have the 'show diffs' /
       // 'hide diffs' buttons still be functional.
@@ -701,7 +701,7 @@
     },
 
     _incrementNumFilesShown: function() {
-      this._numFilesShown += this._fileListIncrement;
+      this.numFilesShown += this._fileListIncrement;
     },
 
     _computeFileListButtonHidden: function(numFilesShown, files) {
@@ -721,7 +721,7 @@
     },
 
     _showAllFiles: function() {
-      this._numFilesShown = this._files.length;
+      this.numFilesShown = this._files.length;
     },
 
     _updateSelected: function(patchRange) {

polygerrit-ui/app/elements/change/gr-file-list/gr-file-list_test.html

@@ -60,6 +60,7 @@ limitations under the License.
         reload: function() { return Promise.resolve(); },
       });
       element = fixture('basic');
+      element.numFilesShown = 75;
       saveStub = sandbox.stub(element, '_saveReviewedState',
           function() { return Promise.resolve(); });
     });
@@ -738,7 +739,7 @@ limitations under the License.
           arr.push({__path: 'myfile.txt'});
         });
         element._files = arr;
-        element._numFilesShown = arr.length;
+        element.numFilesShown = arr.length;
         assert.isFalse(computeSpy.lastCall.returnValue);
         done();
       });

polygerrit-ui/app/elements/gr-app.js

@@ -101,6 +101,7 @@
           selectedFileIndex: 0,
           showReplyDialog: false,
           diffMode: null,
+          numFilesShown: null,
         },
         changeListView: {
           query: null,