Project import generated by Copybara.
GitOrigin-RevId: d9e9e3fb4e31372ec1fb43b178994ca78fa8fe70
diff --git a/static_src/elements/help/mr-cue/mr-fed-ref-cue.js b/static_src/elements/help/mr-cue/mr-fed-ref-cue.js
new file mode 100644
index 0000000..8e8626f
--- /dev/null
+++ b/static_src/elements/help/mr-cue/mr-fed-ref-cue.js
@@ -0,0 +1,83 @@
+// Copyright 2019 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import {html, css} from 'lit-element';
+import * as userV0 from 'reducers/userV0.js';
+import * as issueV0 from 'reducers/issueV0.js';
+import {store} from 'reducers/base.js';
+import 'elements/chops/chops-button/chops-button.js';
+import 'elements/chops/chops-dialog/chops-dialog.js';
+import {fromShortlink, GoogleIssueTrackerIssue} from 'shared/federated.js';
+import {MrCue} from './mr-cue.js';
+
+/**
+ * `<mr-fed-ref-cue>`
+ *
+ * Displays information and login/logout links for the federated references
+ * info popup.
+ *
+ */
+export class MrFedRefCue extends MrCue {
+ /** @override */
+ static get properties() {
+ return {
+ ...MrCue.properties,
+ fedRefShortlink: {type: String},
+ };
+ }
+
+ /** @override */
+ static get styles() {
+ return [
+ ...MrCue.styles,
+ css`
+ :host {
+ margin: 0;
+ width: 120px;
+ font-size: 11px;
+ }
+ `,
+ ];
+ }
+
+ get message() {
+ const fedRef = fromShortlink(this.fedRefShortlink);
+ if (fedRef && fedRef instanceof GoogleIssueTrackerIssue) {
+ let authLink;
+ if (this.user && this.user.gapiEmail) {
+ authLink = html`
+ <br /><br />
+ <a href="#"
+ @click=${() => store.dispatch(userV0.initGapiLogout())}
+ >Sign out</a>
+ <br />
+ (for references only)
+ `;
+ } else {
+ const clickLoginHandler = async () => {
+ await store.dispatch(userV0.initGapiLogin(this.issue));
+ // Re-fetch related issues.
+ store.dispatch(issueV0.fetchRelatedIssues(this.issue));
+ };
+ authLink = html`
+ <br /><br />
+ Googlers, to enable viewing status & title,
+ <a href="#"
+ @click=${clickLoginHandler}
+ >sign in here</a> with your Google email.
+ `;
+ }
+ return html`
+ This references an issue in the ${fedRef.trackerName} issue tracker.
+ ${authLink}
+ `;
+ } else {
+ return html`
+ This references an issue in another tracker. Status not displayed.
+ `;
+ }
+ }
+}
+
+customElements.define('mr-fed-ref-cue', MrFedRefCue);