Convert gr-confirm-move-dialog to typescript
The change converts the following files to typescript: * elements/change/gr-confirm-move-dialog/gr-confirm-move-dialog.ts Change-Id: I4577850d18f118ff888d9f50840d11243d605250
This commit is contained in:
@@ -14,28 +14,35 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import '../../../styles/shared-styles.js';
|
import '../../../styles/shared-styles';
|
||||||
import '../../shared/gr-autocomplete/gr-autocomplete.js';
|
import '../../shared/gr-autocomplete/gr-autocomplete';
|
||||||
import '../../shared/gr-dialog/gr-dialog.js';
|
import '../../shared/gr-dialog/gr-dialog';
|
||||||
import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
|
import '../../shared/gr-rest-api-interface/gr-rest-api-interface';
|
||||||
import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
|
import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners';
|
||||||
import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
|
import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin';
|
||||||
import {PolymerElement} from '@polymer/polymer/polymer-element.js';
|
import {PolymerElement} from '@polymer/polymer/polymer-element';
|
||||||
import {htmlTemplate} from './gr-confirm-move-dialog_html.js';
|
import {htmlTemplate} from './gr-confirm-move-dialog_html';
|
||||||
import {KeyboardShortcutMixin} from '../../../mixins/keyboard-shortcut-mixin/keyboard-shortcut-mixin.js';
|
import {KeyboardShortcutMixin} from '../../../mixins/keyboard-shortcut-mixin/keyboard-shortcut-mixin';
|
||||||
|
import {customElement, property} from '@polymer/decorators';
|
||||||
|
import {GrRestApiInterface} from '../../shared/gr-rest-api-interface/gr-rest-api-interface';
|
||||||
|
import {RepoName, BranchName} from '../../../types/common';
|
||||||
|
import {AutoCompleteSuggestion} from '../../shared/gr-autocomplete/gr-autocomplete';
|
||||||
|
|
||||||
const SUGGESTIONS_LIMIT = 15;
|
const SUGGESTIONS_LIMIT = 15;
|
||||||
|
|
||||||
/**
|
export interface GrConfirmMoveDialog {
|
||||||
* @extends PolymerElement
|
$: {
|
||||||
*/
|
restAPI: GrRestApiInterface;
|
||||||
class GrConfirmMoveDialog extends KeyboardShortcutMixin(
|
};
|
||||||
GestureEventListeners(
|
}
|
||||||
LegacyElementMixin(
|
@customElement('gr-confirm-move-dialog')
|
||||||
PolymerElement))) {
|
export class GrConfirmMoveDialog extends KeyboardShortcutMixin(
|
||||||
static get template() { return htmlTemplate; }
|
GestureEventListeners(LegacyElementMixin(PolymerElement))
|
||||||
|
) {
|
||||||
|
static get template() {
|
||||||
|
return htmlTemplate;
|
||||||
|
}
|
||||||
|
|
||||||
static get is() { return 'gr-confirm-move-dialog'; }
|
|
||||||
/**
|
/**
|
||||||
* Fired when the confirm button is pressed.
|
* Fired when the confirm button is pressed.
|
||||||
*
|
*
|
||||||
@@ -48,19 +55,17 @@ class GrConfirmMoveDialog extends KeyboardShortcutMixin(
|
|||||||
* @event cancel
|
* @event cancel
|
||||||
*/
|
*/
|
||||||
|
|
||||||
static get properties() {
|
@property({type: String})
|
||||||
return {
|
branch?: BranchName;
|
||||||
branch: String,
|
|
||||||
message: String,
|
@property({type: String})
|
||||||
project: String,
|
message?: string;
|
||||||
_query: {
|
|
||||||
type: Function,
|
@property({type: String})
|
||||||
value() {
|
project?: RepoName;
|
||||||
return this._getProjectBranchesSuggestions.bind(this);
|
|
||||||
},
|
@property({type: Object})
|
||||||
},
|
_query?: (_text?: string) => Promise<AutoCompleteSuggestion[]>;
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
get keyBindings() {
|
get keyBindings() {
|
||||||
return {
|
return {
|
||||||
@@ -68,44 +73,66 @@ class GrConfirmMoveDialog extends KeyboardShortcutMixin(
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
_handleConfirmTap(e) {
|
constructor() {
|
||||||
e.preventDefault();
|
super();
|
||||||
e.stopPropagation();
|
this._query = () => this._getProjectBranchesSuggestions();
|
||||||
this.dispatchEvent(new CustomEvent('confirm', {
|
|
||||||
composed: true, bubbles: false,
|
|
||||||
}));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
_handleCancelTap(e) {
|
_handleConfirmTap(e: Event) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
this.dispatchEvent(new CustomEvent('cancel', {
|
this.dispatchEvent(
|
||||||
composed: true, bubbles: false,
|
new CustomEvent('confirm', {
|
||||||
}));
|
composed: true,
|
||||||
|
bubbles: false,
|
||||||
|
})
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
_getProjectBranchesSuggestions(input) {
|
_handleCancelTap(e: Event) {
|
||||||
|
e.preventDefault();
|
||||||
|
e.stopPropagation();
|
||||||
|
this.dispatchEvent(
|
||||||
|
new CustomEvent('cancel', {
|
||||||
|
composed: true,
|
||||||
|
bubbles: false,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
_getProjectBranchesSuggestions(
|
||||||
|
input?: string
|
||||||
|
): Promise<AutoCompleteSuggestion[]> {
|
||||||
|
if (!this.project) return Promise.reject(new Error('Missing project'));
|
||||||
|
if (!input) return Promise.reject(new Error('Missing input'));
|
||||||
if (input.startsWith('refs/heads/')) {
|
if (input.startsWith('refs/heads/')) {
|
||||||
input = input.substring('refs/heads/'.length);
|
input = input.substring('refs/heads/'.length);
|
||||||
}
|
}
|
||||||
return this.$.restAPI.getRepoBranches(
|
return this.$.restAPI
|
||||||
input, this.project, SUGGESTIONS_LIMIT).then(response => {
|
.getRepoBranches(input, this.project, SUGGESTIONS_LIMIT)
|
||||||
const branches = [];
|
.then(response => {
|
||||||
let branch;
|
const branches: AutoCompleteSuggestion[] = [];
|
||||||
for (const key in response) {
|
let branch;
|
||||||
if (!response.hasOwnProperty(key)) { continue; }
|
if (response) {
|
||||||
if (response[key].ref.startsWith('refs/heads/')) {
|
response.forEach(value => {
|
||||||
branch = response[key].ref.substring('refs/heads/'.length);
|
if (value.ref.startsWith('refs/heads/')) {
|
||||||
} else {
|
branch = value.ref.substring('refs/heads/'.length);
|
||||||
branch = response[key].ref;
|
} else {
|
||||||
|
branch = value.ref;
|
||||||
|
}
|
||||||
|
branches.push({
|
||||||
|
name: branch,
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
branches.push({
|
|
||||||
name: branch,
|
return branches;
|
||||||
});
|
});
|
||||||
}
|
|
||||||
return branches;
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
customElements.define(GrConfirmMoveDialog.is, GrConfirmMoveDialog);
|
declare global {
|
||||||
|
interface HTMLElementTagNameMap {
|
||||||
|
'gr-confirm-move-dialog': GrConfirmMoveDialog;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@@ -35,7 +35,7 @@ suite('gr-confirm-move-dialog tests', () => {
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
} else {
|
} else {
|
||||||
return Promise.resolve({});
|
return Promise.resolve(undefined);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -51,7 +51,7 @@ declare global {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Suggestion {
|
export interface AutoCompleteSuggestion {
|
||||||
name: string;
|
name: string;
|
||||||
label?: string;
|
label?: string;
|
||||||
value?: string;
|
value?: string;
|
||||||
@@ -94,7 +94,8 @@ export class GrAutocomplete extends KeyboardShortcutMixin(
|
|||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
@property({type: Object})
|
@property({type: Object})
|
||||||
query: (_text?: string) => Promise<Suggestion[]> = () => Promise.resolve([]);
|
query: (_text?: string) => Promise<AutoCompleteSuggestion[]> = () =>
|
||||||
|
Promise.resolve([]);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The number of characters that must be typed before suggestions are
|
* The number of characters that must be typed before suggestions are
|
||||||
@@ -165,7 +166,7 @@ export class GrAutocomplete extends KeyboardShortcutMixin(
|
|||||||
noDebounce = false;
|
noDebounce = false;
|
||||||
|
|
||||||
@property({type: Array})
|
@property({type: Array})
|
||||||
_suggestions: Suggestion[] = [];
|
_suggestions: AutoCompleteSuggestion[] = [];
|
||||||
|
|
||||||
@property({type: Array})
|
@property({type: Array})
|
||||||
_suggestionEls = [];
|
_suggestionEls = [];
|
||||||
@@ -324,7 +325,7 @@ export class GrAutocomplete extends KeyboardShortcutMixin(
|
|||||||
}
|
}
|
||||||
|
|
||||||
@observe('_suggestions', '_focused')
|
@observe('_suggestions', '_focused')
|
||||||
_maybeOpenDropdown(suggestions: Suggestion[], focused: boolean) {
|
_maybeOpenDropdown(suggestions: AutoCompleteSuggestion[], focused: boolean) {
|
||||||
if (suggestions.length > 0 && focused) {
|
if (suggestions.length > 0 && focused) {
|
||||||
return this.$.suggestions.open();
|
return this.$.suggestions.open();
|
||||||
}
|
}
|
||||||
@@ -413,7 +414,10 @@ export class GrAutocomplete extends KeyboardShortcutMixin(
|
|||||||
this._commit(_tabComplete);
|
this._commit(_tabComplete);
|
||||||
}
|
}
|
||||||
|
|
||||||
_updateValue(suggestion: HTMLElement | null, suggestions: Suggestion[]) {
|
_updateValue(
|
||||||
|
suggestion: HTMLElement | null,
|
||||||
|
suggestions: AutoCompleteSuggestion[]
|
||||||
|
) {
|
||||||
if (!suggestion) {
|
if (!suggestion) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user