Revert "Revert "Provide in-dashboard help for creating changes""
This reverts commit e5639b3e9890f593de36c21f83da2b0c1d1e50ca.
Change-Id: I37e26ead38fef16534da952b09bcd0d4beb105aa
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.html b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.html
index 4ebe027..372e6be 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.html
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.html
@@ -67,13 +67,18 @@
</td>
</tr>
</template>
- <template is="dom-if" if="[[!changeSection.results.length]]">
+ <template is="dom-if" if="[[_isEmpty(changeSection)]]">
<tr class="noChanges">
<td class="leftPadding"></td>
<td class="star" hidden$="[[!showStar]]" hidden></td>
<td class="cell"
colspan$="[[_computeColspan(changeTableColumns, labelNames)]]">
- No changes
+ <template is="dom-if" if="[[_isOutgoing(changeSection)]]">
+ <slot name="empty-outgoing"></slot>
+ </template>
+ <template is="dom-if" if="[[!_isOutgoing(changeSection)]]">
+ No changes
+ </template>
</td>
</tr>
</template>
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
index eb916c1..ba768d9 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list.js
@@ -347,5 +347,13 @@
this.$.cursor.stops = this._getListItems();
this.$.cursor.moveToStart();
},
+
+ _isOutgoing(section) {
+ return !!section.isOutgoing;
+ },
+
+ _isEmpty(section) {
+ return !section.results.length;
+ },
});
})();
diff --git a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
index 3cf5f9a..bb904b5 100644
--- a/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
+++ b/polygerrit-ui/app/elements/change-list/gr-change-list/gr-change-list_test.html
@@ -270,6 +270,32 @@
assert.equal(noChangesMsg.length, 2);
});
+ suite('empty outgoing', () => {
+ test('not shown on empty non-outgoing sections', () => {
+ const section = {results: []};
+ assert.isTrue(element._isEmpty(section));
+ assert.isFalse(element._isOutgoing(section));
+ });
+
+ test('shown on empty outgoing sections', () => {
+ const section = {results: [], isOutgoing: true};
+ assert.isTrue(element._isEmpty(section));
+ assert.isTrue(element._isOutgoing(section));
+ });
+
+ test('not shown on non-empty outgoing sections', () => {
+ const section = {isOutgoing: true, results: [
+ {_number: 0, labels: {Verified: {approved: {}}}}]};
+ assert.isFalse(element._isEmpty(section));
+ assert.isTrue(element._isOutgoing(section));
+ });
+ });
+
+ test('_isOutgoing', () => {
+ assert.isTrue(element._isOutgoing({results: [], isOutgoing: true}));
+ assert.isFalse(element._isOutgoing({results: []}));
+ });
+
suite('empty column preference', () => {
let element;
diff --git a/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.html b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.html
new file mode 100644
index 0000000..bf17b911
--- /dev/null
+++ b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.html
@@ -0,0 +1,87 @@
+<!--
+@license
+Copyright (C) 2018 The Android Open Source Project
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<link rel="import" href="../../../bower_components/polymer/polymer.html">
+<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
+<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
+<link rel="import" href="../../shared/gr-shell-command/gr-shell-command.html">
+
+<dom-module id="gr-create-commands-dialog">
+ <template>
+ <style include="shared-styles">
+ ol {
+ list-style: decimal;
+ margin-left: 1em;
+ }
+ p {
+ margin-bottom: .75em;
+ }
+ #commandsDialog {
+ max-width: 40em;
+ }
+ </style>
+ <gr-overlay id="commandsOverlay" with-backdrop>
+ <gr-dialog
+ id="commandsDialog"
+ confirm-label="Done"
+ cancel-label=""
+ confirm-on-enter
+ on-confirm="_handleClose">
+ <div class="header" slot="header">
+ Create change commands
+ </div>
+ <div class="main" slot="main">
+ <ol>
+ <li>
+ <p>
+ Make the changes to the files on your machine
+ </p>
+ </li>
+ <li>
+ <p>
+ If you are making a new commit use
+ </p>
+ <gr-shell-command command="[[_createNewCommitCommand]]"></gr-shell-command>
+ <p>
+ Or to amend an existing commit use
+ </p>
+ <gr-shell-command command="[[_amendExistingCommitCommand]]"></gr-shell-command>
+ <p>
+ Please make sure you add a commit message as it becomes the
+ description for your change.
+ </p>
+ </li>
+ <li>
+ <p>
+ Push the change for code review
+ </p>
+ <gr-shell-command command="[[_pushCommand]]"></gr-shell-command>
+ </li>
+ <li>
+ <p>
+ Close this dialog and you should be able to see your recently
+ created change in ``Outgoing changes'' section on
+ ``Your changes'' page.
+ </p>
+ </li>
+ </ol>
+ </div>
+ </gr-dialog>
+ </gr-overlay>
+ </template>
+ <script src="gr-create-commands-dialog.js"></script>
+</dom-module>
diff --git a/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.js b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.js
new file mode 100644
index 0000000..0e71f1c
--- /dev/null
+++ b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog.js
@@ -0,0 +1,58 @@
+/**
+ * @license
+ * Copyright (C) 2018 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+(function() {
+ 'use strict';
+
+ const Commands = {
+ CREATE: 'git commit',
+ AMEND: 'git commit --amend',
+ PUSH_PREFIX: 'git push origin HEAD:refs/for/',
+ };
+
+ Polymer({
+ is: 'gr-create-commands-dialog',
+ properties: {
+ branch: String,
+ _createNewCommitCommand: {
+ type: String,
+ readonly: true,
+ value: Commands.CREATE,
+ },
+ _amendExistingCommitCommand: {
+ type: String,
+ readonly: true,
+ value: Commands.AMEND,
+ },
+ _pushCommand: {
+ type: String,
+ computed: '_computePushCommand(branch)',
+ },
+ },
+
+ open() {
+ this.$.commandsOverlay.open();
+ },
+
+ _handleClose() {
+ this.$.commandsOverlay.close();
+ },
+
+ _computePushCommand(branch) {
+ return Commands.PUSH_PREFIX + branch;
+ },
+ });
+})();
diff --git a/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog_test.html b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog_test.html
new file mode 100644
index 0000000..e00037d
--- /dev/null
+++ b/polygerrit-ui/app/elements/change-list/gr-create-commands-dialog/gr-create-commands-dialog_test.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<!--
+@license
+Copyright (C) 2018 The Android Open Source Project
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
+<title>gr-create-commands-dialog</title>
+
+<script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
+<script src="../../../bower_components/web-component-tester/browser.js"></script>
+<link rel="import" href="../../../test/common-test-setup.html"/>
+<link rel="import" href="gr-create-commands-dialog.html">
+
+<script>void(0);</script>
+
+<test-fixture id="basic">
+ <template>
+ <gr-create-commands-dialog></gr-create-commands-dialog>
+ </template>
+</test-fixture>
+
+<script>
+ suite('gr-create-commands-dialog tests', () => {
+ let element;
+
+ setup(() => {
+ element = fixture('basic');
+ });
+
+ test('_computePushCommand', () => {
+ element.branch = 'master';
+ assert.equal(element._pushCommand,
+ 'git push origin HEAD:refs/for/master');
+
+ element.branch = 'stable-2.15';
+ assert.equal(element._pushCommand,
+ 'git push origin HEAD:refs/for/stable-2.15');
+ });
+ });
+</script>
diff --git a/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.html b/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.html
new file mode 100644
index 0000000..d12d84b
--- /dev/null
+++ b/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.html
@@ -0,0 +1,48 @@
+<!--
+@license
+Copyright (C) 2018 The Android Open Source Project
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<link rel="import" href="../../../bower_components/polymer/polymer.html">
+<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
+<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
+<link rel="import" href="../../shared/gr-repo-branch-picker/gr-repo-branch-picker.html">
+
+<dom-module id="gr-create-destination-dialog">
+ <template>
+ <style include="shared-styles">
+ </style>
+ <gr-overlay id="createOverlay" with-backdrop>
+ <gr-dialog
+ confirm-label="View commands"
+ on-confirm="_pickerConfirm"
+ on-cancel="_handleClose"
+ disabled="[[!_repoAndBranchSelected]]">
+ <div class="header" slot="header">
+ Create change
+ </div>
+ <div class="main" slot="main">
+ <gr-repo-branch-picker
+ repo="{{_repo}}"
+ branch="{{_branch}}"></gr-repo-branch-picker>
+ <p>
+ If you haven't done so, you will need to clone the repository.
+ </p>
+ </div>
+ </gr-dialog>
+ </gr-overlay>
+ </template>
+ <script src="gr-create-destination-dialog.js"></script>
+</dom-module>
diff --git a/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.js b/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.js
new file mode 100644
index 0000000..4d2802e
--- /dev/null
+++ b/polygerrit-ui/app/elements/change-list/gr-create-destination-dialog/gr-create-destination-dialog.js
@@ -0,0 +1,58 @@
+/**
+ * @license
+ * Copyright (C) 2018 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+(function() {
+ 'use strict';
+
+ /**
+ * Fired when a destination has been picked. Event details contain the repo
+ * name and the branch name.
+ *
+ * @event confirm
+ */
+
+ Polymer({
+ is: 'gr-create-destination-dialog',
+ properties: {
+ _repo: String,
+ _branch: String,
+ _repoAndBranchSelected: {
+ type: Boolean,
+ value: false,
+ computed: '_computeRepoAndBranchSelected(_repo, _branch)',
+ },
+ },
+ open() {
+ this._repo = '';
+ this._branch = '';
+ this.$.createOverlay.open();
+ },
+
+ _handleClose() {
+ this.$.createOverlay.close();
+ },
+
+ _pickerConfirm() {
+ this.$.createOverlay.close();
+ const detail = {repo: this._repo, branch: this._branch};
+ this.dispatchEvent(new CustomEvent('confirm', {detail, bubbles: false}));
+ },
+
+ _computeRepoAndBranchSelected(repo, branch) {
+ return !!(repo && branch);
+ },
+ });
+})();
diff --git a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
index af320e2..84ada58 100644
--- a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
+++ b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.html
@@ -24,6 +24,8 @@
<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
+<link rel="import" href="../gr-create-commands-dialog/gr-create-commands-dialog.html">
+<link rel="import" href="../gr-create-destination-dialog/gr-create-destination-dialog.html">
<link rel="import" href="../gr-user-header/gr-user-header.html">
<dom-module id="gr-dashboard-view">
@@ -59,10 +61,42 @@
.hide {
display: none;
}
+ #emptyOutgoing {
+ display: block;
+ }
+ #emptyOutgoing #graphic,
+ #emptyOutgoing #help {
+ display: inline-block;
+ margin: .5em;
+ }
+ #emptyOutgoing #graphic {
+ fill: var(--deemphasized-text-color);
+ max-width: 12em;
+ }
+ #emptyOutgoing #graphic svg {
+ display: block;
+ margin: 0 auto;
+ max-width: 100px;
+ }
+ #emptyOutgoing #graphic p {
+ text-align: center;
+ }
+ #emptyOutgoing #help {
+ vertical-align: top;
+ }
+ #emptyOutgoing #help h1 {
+ font-size: var(--font-size-large);
+ }
+ #emptyOutgoing #help p {
+ max-width: 35em;
+ }
@media only screen and (max-width: 50em) {
.loading {
padding: 0 var(--default-horizontal-margin);
}
+ #emptyOutgoing #graphic {
+ display: none;
+ }
}
</style>
<div class$="banner [[_computeBannerClass(_showDraftsBanner)]]">
@@ -90,7 +124,27 @@
selected-index="{{viewState.selectedChangeIndex}}"
sections="[[_results]]"
on-toggle-star="_handleToggleStar"
- on-toggle-reviewed="_handleToggleReviewed"></gr-change-list>
+ on-toggle-reviewed="_handleToggleReviewed">
+ <div id="emptyOutgoing" slot="empty-outgoing">
+ <div id="graphic">
+ <svg width="150" height="100">
+ <circle cx="50" cy="50" r="50"></circle>
+ </svg>
+ <p>
+ No outgoing changes yet
+ </p>
+ </div>
+ <div id="help">
+ <h1>Push your first changes for code review</h1>
+ <p>
+ Pushing a change for review is easy, but a little different from
+ other git code review tools. Click on the `Create Change' button
+ and follow the step by step instructions.
+ </p>
+ <gr-button on-tap="_createChangeTap">Create Change</gr-button>
+ </div>
+ </div>
+ </gr-change-list>
</div>
<gr-overlay id="confirmDeleteOverlay" with-backdrop>
<gr-dialog
@@ -107,6 +161,10 @@
</div>
</gr-dialog>
</gr-overlay>
+ <gr-create-destination-dialog
+ id="destinationDialog"
+ on-confirm="_handleDestinationConfirm"></gr-create-destination-dialog>
+ <gr-create-commands-dialog id="commandsDialog"></gr-create-commands-dialog>
<gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
<gr-reporting id="reporting"></gr-reporting>
</template>
diff --git a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
index 8aa7084..54fd8b3 100644
--- a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
+++ b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view.js
@@ -187,6 +187,7 @@
sectionName: res.sections[i].name,
query: res.sections[i].query,
results,
+ isOutgoing: res.sections[i].isOutgoing,
})).filter((section, i) => !res.sections[i].hideIfEmpty ||
section.results.length);
});
@@ -248,5 +249,14 @@
_computeDraftsLink() {
return Gerrit.Nav.getUrlForSearchQuery('has:draft -is:open');
},
+
+ _createChangeTap() {
+ this.$.destinationDialog.open();
+ },
+
+ _handleDestinationConfirm(e) {
+ this.$.commandsDialog.branch = e.detail.branch;
+ this.$.commandsDialog.open();
+ },
});
})();
diff --git a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view_test.html b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view_test.html
index aebd452..83ba096 100644
--- a/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view_test.html
+++ b/polygerrit-ui/app/elements/change-list/gr-dashboard-view/gr-dashboard-view_test.html
@@ -283,6 +283,22 @@
});
});
+ test('preserve isOutgoing sections', () => {
+ const sections = [
+ {name: 'test1', query: 'test1', isOutgoing: true},
+ {name: 'test2', query: 'test2'},
+ ];
+ getChangesStub.restore();
+ sandbox.stub(element.$.restAPI, 'getChanges')
+ .returns(Promise.resolve([[], []]));
+
+ return element._fetchDashboardChanges({sections}).then(() => {
+ assert.equal(element._results.length, 2);
+ assert.isTrue(element._results[0].isOutgoing);
+ assert.isNotOk(element._results[1].isOutgoing);
+ });
+ });
+
test('_computeUserHeaderClass', () => {
assert.equal(element._computeUserHeaderClass(undefined), '');
assert.equal(element._computeUserHeaderClass(''), '');
diff --git a/polygerrit-ui/app/styles/gr-change-list-styles.html b/polygerrit-ui/app/styles/gr-change-list-styles.html
index af30e46..aeca48a 100644
--- a/polygerrit-ui/app/styles/gr-change-list-styles.html
+++ b/polygerrit-ui/app/styles/gr-change-list-styles.html
@@ -207,6 +207,10 @@
.size {
max-width: none;
}
+ .noChanges .cell {
+ display: block;
+ height: auto;
+ }
}
@media only screen and (min-width: 1450px) {
:host {
diff --git a/polygerrit-ui/app/test/index.html b/polygerrit-ui/app/test/index.html
index 816700b..4cba249 100644
--- a/polygerrit-ui/app/test/index.html
+++ b/polygerrit-ui/app/test/index.html
@@ -56,6 +56,7 @@
'change-list/gr-change-list-item/gr-change-list-item_test.html',
'change-list/gr-change-list-view/gr-change-list-view_test.html',
'change-list/gr-change-list/gr-change-list_test.html',
+ 'change-list/gr-create-commands-dialog/gr-create-commands-dialog_test.html',
'change-list/gr-dashboard-view/gr-dashboard-view_test.html',
'change-list/gr-user-header/gr-user-header_test.html',
'change/gr-account-entry/gr-account-entry_test.html',
