opendev/gerrit
Code Issues Proposed changes

Add a note about hidden messages to experimental Change Log

Browse Source 
Change-Id: I728dc9982d0866b767487dc0eb67e4d82185b7ba
This commit is contained in:
Ben Rohlfs
2020-05-12 14:03:57 +02:00
parent d7e2a03305
commit cd164ed1fc
3 changed files with 35 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
polygerrit-ui/app/elements/change/gr-messages-list/gr-messages-list-experimental.js
View File

@@ -291,11 +291,14 @@ class GrMessagesListExperimental extends mixinBehaviors( [
this.scrollToMessage(e.detail.id); this.scrollToMessage(e.detail.id);
} }
_isVisibleShowAllActivityToggle(messages) { _isVisibleShowAllActivityToggle(messages = []) {
messages = messages || [];
return messages.some(m => !isImportant(m, messages)); return messages.some(m => !isImportant(m, messages));
} }
_computeHiddenEntriesCount(messages = []) {
return messages.filter(m => !isImportant(m, messages)).length;
}
/** /**
* This method is for reporting stats only. * This method is for reporting stats only.
*/ */

25
polygerrit-ui/app/elements/change/gr-messages-list/gr-messages-list-experimental_html.js
View File

@@ -45,6 +45,9 @@ export const htmlTemplate = html`
align-items: center; align-items: center;
display: flex; display: flex;
} }
.hiddenEntries {
color: var(--deemphasized-text-color);
}
gr-message:not(:last-of-type) { gr-message:not(:last-of-type) {
border-bottom: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color);
} }
@@ -61,18 +64,24 @@ export const htmlTemplate = html`
} }
</style> </style>
<div class="header"> <div class="header">
<span <template
id="showAllActivityToggleContainer" is="dom-if"
class="container" if="[[_isVisibleShowAllActivityToggle(_combinedMessages)]]"
hidden$="[[!_isVisibleShowAllActivityToggle(_combinedMessages)]]"
> >
<div id="showAllActivityToggleContainer" class="container">
<paper-toggle-button <paper-toggle-button
id="showAllActivityToggle" class="showAllActivityToggle"
checked="{{_showAllActivity}}" checked="{{_showAllActivity}}"
></paper-toggle-button ></paper-toggle-button>
>Show all entries <div>
<span class="transparent separator"></span> <span>Show all entries</span>
<span class="hiddenEntries" hidden$="[[_showAllActivity]]">
([[_computeHiddenEntriesCount(_combinedMessages)]] hidden)
</span> </span>
</div>
<span class="transparent separator"></span>
</div>
</template>
<div class="experimentMessage"> <div class="experimentMessage">
<iron-icon icon="gr-icons:pets"></iron-icon> <iron-icon icon="gr-icons:pets"></iron-icon>
<span>You're currently viewing an experimental Change Log view.</span> <span>You're currently viewing an experimental Change Log view.</span>

16
polygerrit-ui/app/elements/change/gr-messages-list/gr-messages-list-experimental_test.html
View File

@@ -207,8 +207,8 @@ suite('gr-messages-list-experimental tests', () => {
}); });
test('showAllActivity does not appear when all msgs are important', () => { test('showAllActivity does not appear when all msgs are important', () => {
assert.isOk(element.shadowRoot assert.isNotOk(element.shadowRoot
.querySelector('#showAllActivityToggleContainer[hidden]')); .querySelector('#showAllActivityToggleContainer'));
}); });
test('scroll to message', () => { test('scroll to message', () => {
@@ -430,8 +430,8 @@ suite('gr-messages-list-experimental tests', () => {
}); });
test('hide autogenerated button is not hidden', () => { test('hide autogenerated button is not hidden', () => {
assert.isNotOk(element.shadowRoot const toggle = dom(element.root).querySelector('.showAllActivityToggle');
.querySelector('#showAllActivityToggle[hidden]')); assert.isOk(toggle);
}); });
test('one unimportant message is hidden initially', () => { test('one unimportant message is hidden initially', () => {
@@ -441,7 +441,9 @@ suite('gr-messages-list-experimental tests', () => {
test('unimportant messages hidden after toggle', () => { test('unimportant messages hidden after toggle', () => {
element._showAllActivity = true; element._showAllActivity = true;
MockInteractions.tap(element.$.showAllActivityToggle); const toggle = dom(element.root).querySelector('.showAllActivityToggle');
assert.isOk(toggle);
MockInteractions.tap(toggle);
flushAsynchronousOperations(); flushAsynchronousOperations();
const displayedMsgs = dom(element.root).querySelectorAll('gr-message'); const displayedMsgs = dom(element.root).querySelectorAll('gr-message');
assert.equal(displayedMsgs.length, 2); assert.equal(displayedMsgs.length, 2);
@@ -449,7 +451,9 @@ suite('gr-messages-list-experimental tests', () => {
test('unimportant messages shown after toggle', () => { test('unimportant messages shown after toggle', () => {
element._showAllActivity = false; element._showAllActivity = false;
MockInteractions.tap(element.$.showAllActivityToggle); const toggle = dom(element.root).querySelector('.showAllActivityToggle');
assert.isOk(toggle);
MockInteractions.tap(toggle);
flushAsynchronousOperations(); flushAsynchronousOperations();
const displayedMsgs = dom(element.root).querySelectorAll('gr-message'); const displayedMsgs = dom(element.root).querySelectorAll('gr-message');
assert.equal(displayedMsgs.length, 3); assert.equal(displayedMsgs.length, 3);