blob: 7b8f79a06d775c79dacd03585e4b204013ca2c57 [file] [log] [blame]
Adrià Vilanova Martínezf19ea432024-01-23 20:20:52 +01001// Copyright 2019 The Chromium Authors
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +02002// Use of this source code is governed by a BSD-style license that can be
3// found in the LICENSE file.
4
5import {LitElement, html, css} from 'lit-element';
6
7import {connectStore} from 'reducers/base.js';
8import * as issueV0 from 'reducers/issueV0.js';
9import {SHARED_STYLES} from 'shared/shared-styles.js';
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +020010import {migratedTypes} from 'shared/issue-fields.js';
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +020011
12/**
13 * `<mr-migrated-banner>`
14 *
15 * Display for showing whether an issue is restricted.
16 *
17 */
18export class MrMigratedBanner extends connectStore(LitElement) {
19 /** @override */
20 static get styles() {
21 return [
22 SHARED_STYLES,
23 css`
24 :host {
25 width: 100%;
26 margin-top: 0;
27 background-color: var(--chops-orange-50);
28 border-bottom: var(--chops-normal-border);
29 font-size: var(--chops-main-font-size);
30 padding: 0.25em 8px;
31 box-sizing: border-box;
32 display: flex;
33 flex-direction: row;
34 justify-content: flex-start;
35 align-items: center;
36 }
37 :host([hidden]) {
38 display: none;
39 }
40 i.material-icons {
41 color: var(--chops-primary-icon-color);
42 font-size: var(--chops-icon-font-size);
43 }
44 .warning-icon {
45 margin-right: 4px;
46 }
47 `,
48 ];
49 }
50
51 /** @override */
52 render() {
53 return html`
54 <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
55 rel="stylesheet">
56 <i
57 class="warning-icon material-icons"
58 icon="warning"
59 >warning</i>
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +020060 ${this._link}
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +020061 `;
62 }
63
64 /** @override */
65 static get properties() {
66 return {
67 migratedId: {type: String},
68 hidden: {
69 type: Boolean,
70 reflect: true,
71 },
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +020072 migratedType: {type: migratedTypes}
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +020073 };
74 }
75
76 /** @override */
77 constructor() {
78 super();
79
80 this.hidden = true;
81 }
82
83 /** @override */
84 stateChanged(state) {
85 this.migratedId = issueV0.migratedId(state);
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +020086 this.migratedType = issueV0.migratedType(state);
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +020087 }
88
89 /** @override */
90 update(changedProperties) {
91 if (changedProperties.has('migratedId')) {
92 this.hidden = !this.migratedId || this.migratedId === '';
93 }
94
95 super.update(changedProperties);
96 }
97
98 /**
99 * @return {string} the link of the issue in Issue Tracker.
100 */
101 get _link() {
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +0200102 if (this.migratedType === migratedTypes.BUGANIZER_TYPE) {
Adrià Vilanova Martínezf19ea432024-01-23 20:20:52 +0100103 const link =
Adrià Vilanova Martínez9f9ade52022-10-10 23:20:11 +0200104 html`<a href="https://issuetracker.google.com/issues/${this.migratedId}">b/${this.migratedId}</a>`;
105 return html`<p>This issue has moved to ${link}. Updates should be posted in ${link}.</p>`;
106 } else {
107 return html`<p>This issue has been migrated to Launch, see link in final comment below.</p>`;
108 }
Adrià Vilanova Martínezde942802022-07-15 14:06:55 +0200109 }
110}
111
112customElements.define('mr-migrated-banner', MrMigratedBanner);