Convert files to typescript
The change converts the following files to typescript:
* elements/diff/gr-diff-mode-selector/gr-diff-mode-selector.ts
Change-Id: I3d677069eb4e30a49536d21ea8e702a2f2cbbc7a
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 7c9d1ec..c1447d4 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
@@ -14,72 +14,71 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import '@polymer/iron-icon/iron-icon.js';
-import '../../../styles/shared-styles.js';
-import '../../shared/gr-button/gr-button.js';
-import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
-import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
-import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
-import {PolymerElement} from '@polymer/polymer/polymer-element.js';
-import {htmlTemplate} from './gr-diff-mode-selector_html.js';
+import '@polymer/iron-icon/iron-icon';
+import '../../../styles/shared-styles';
+import '../../shared/gr-button/gr-button';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface';
+import {DiffViewMode} from '../../../constants/constants';
+import {RestApiService} from '../../../services/services/gr-rest-api/gr-rest-api';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin';
+import {PolymerElement} from '@polymer/polymer/polymer-element';
+import {htmlTemplate} from './gr-diff-mode-selector_html';
+import {customElement, property} from '@polymer/decorators';
-/** @extends PolymerElement */
-class GrDiffModeSelector extends GestureEventListeners(
- LegacyElementMixin(
- PolymerElement)) {
- static get template() { return htmlTemplate; }
+export interface GrDiffModeSelector {
+ $: {
+ restAPI: RestApiService & Element;
+ };
+}
- static get is() { return 'gr-diff-mode-selector'; }
-
- static get properties() {
- return {
- mode: {
- type: String,
- notify: true,
- },
-
- /**
- * If set to true, the user's preference will be updated every time a
- * button is tapped. Don't set to true if there is no user.
- */
- saveOnChange: {
- type: Boolean,
- value: false,
- },
-
- /** @type {?} */
- _VIEW_MODES: {
- type: Object,
- readOnly: true,
- value: {
- SIDE_BY_SIDE: 'SIDE_BY_SIDE',
- UNIFIED: 'UNIFIED_DIFF',
- },
- },
- };
+@customElement('gr-diff-mode-selector')
+export class GrDiffModeSelector extends GestureEventListeners(
+ LegacyElementMixin(PolymerElement)
+) {
+ static get template() {
+ return htmlTemplate;
}
+ @property({type: String, notify: true})
+ mode?: DiffViewMode;
+
+ /**
+ * If set to true, the user's preference will be updated every time a
+ * button is tapped. Don't set to true if there is no user.
+ */
+ @property({type: Boolean})
+ saveOnChange = false;
+
/**
* Set the mode. If save on change is enabled also update the preference.
*/
- setMode(newMode) {
+ setMode(newMode: DiffViewMode) {
if (this.saveOnChange && this.mode && this.mode !== newMode) {
this.$.restAPI.savePreferences({diff_view: newMode});
}
this.mode = newMode;
}
- _computeSelectedClass(diffViewMode, buttonViewMode) {
- return buttonViewMode === diffViewMode ? 'selected' : '';
+ _computeSideBySideSelected(mode: DiffViewMode) {
+ return mode === DiffViewMode.SIDE_BY_SIDE ? 'selected' : '';
+ }
+
+ _computeUnifiedSelected(mode: DiffViewMode) {
+ return mode === DiffViewMode.UNIFIED ? 'selected' : '';
}
_handleSideBySideTap() {
- this.setMode(this._VIEW_MODES.SIDE_BY_SIDE);
+ this.setMode(DiffViewMode.SIDE_BY_SIDE);
}
_handleUnifiedTap() {
- this.setMode(this._VIEW_MODES.UNIFIED);
+ this.setMode(DiffViewMode.UNIFIED);
}
}
-customElements.define(GrDiffModeSelector.is, GrDiffModeSelector);
+declare global {
+ interface HTMLElementTagNameMap {
+ 'gr-diff-mode-selector': GrDiffModeSelector;
+ }
+}
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_html.ts b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_html.ts
index 40f6a32..73f7426 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_html.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_html.ts
@@ -34,7 +34,7 @@
id="sideBySideBtn"
link=""
has-tooltip=""
- class$="[[_computeSelectedClass(mode, _VIEW_MODES.SIDE_BY_SIDE)]]"
+ class$="[[_computeSideBySideSelected(mode)]]"
title="Side-by-side diff"
on-click="_handleSideBySideTap"
>
@@ -45,7 +45,7 @@
link=""
has-tooltip=""
title="Unified diff"
- class$="[[_computeSelectedClass(mode, _VIEW_MODES.UNIFIED)]]"
+ class$="[[_computeUnifiedSelected(mode)]]"
on-click="_handleUnifiedTap"
>
<iron-icon icon="gr-icons:unified"></iron-icon>
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_test.js b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_test.js
index e84ef2b..07a1d16 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_test.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-mode-selector/gr-diff-mode-selector_test.js
@@ -17,6 +17,7 @@
import '../../../test/common-test-setup-karma.js';
import './gr-diff-mode-selector.js';
+import {DiffViewMode} from '../../../constants/constants.js';
const basicFixture = fixtureFromElement('gr-diff-mode-selector');
@@ -28,11 +29,14 @@
});
test('_computeSelectedClass', () => {
- assert.equal(
- element._computeSelectedClass('SIDE_BY_SIDE', 'SIDE_BY_SIDE'),
+ assert.equal(element._computeSideBySideSelected(DiffViewMode.SIDE_BY_SIDE),
'selected');
- assert.equal(
- element._computeSelectedClass('SIDE_BY_SIDE', 'UNIFIED_DIFF'), '');
+ assert.equal(element._computeSideBySideSelected(DiffViewMode.UNIFIED),
+ '');
+ assert.equal(element._computeUnifiedSelected(DiffViewMode.UNIFIED),
+ 'selected');
+ assert.equal(element._computeUnifiedSelected(DiffViewMode.SIDE_BY_SIDE),
+ '');
});
test('setMode', () => {
