https://assets-production.dnsimple.com/assets/system_status-64df6476.js

1import Tooltip from 'components/tooltip/component';
2
3class SystemStatus {
4  static readyAttached = false;
5  static initializedBody = null;
6
7  constructor (el, tooltip) {
8    this.el = el;
9    this.Tooltip = tooltip;
10  }
11
12  /**
13   * Starts the status indicator once for the initial body and after every
14   * top-level Turbo visit. This module is Importmap-only, so it owns the small
15   * lifecycle that the app pages index previously supplied through onReady.
16   *
17   * @returns {void}
18   */
19  static ready() {
20    if (SystemStatus.readyAttached)
21      return;
22
23    SystemStatus.readyAttached = true;
24
25    const run = () => {
26      if (SystemStatus.initializedBody === document.body)
27        return;
28
29      SystemStatus.initializedBody = document.body;
30
31      const el = document.querySelector('.js-system-status');
32      if (el) {
33        const status = new SystemStatus(el, Tooltip);
34
35        status.loadStatusPageScript();
36      }
37    };
38
39    if (document.readyState === 'loading')
40      document.addEventListener('DOMContentLoaded', run);
41    else
42      run();
43
44    document.addEventListener('turbo:load', run);
45  }
46
47  loadStatusPageScript () {
48    const script = document.createElement('script');
49    script.src = 'https://statuspage-production.s3.amazonaws.com/se-v2.js';
50
51    script.addEventListener('load', () => {
52      if (window.StatusPage) {
53        const api = new window.StatusPage.page({ page: 'tjym90yyv2zt' });
54        this.displayStatus(api);
55      }
56    });
57
58    script.addEventListener('error', () => this.showTooltip('Cannot retrieve status'));
59
60    document.head.appendChild(script);
61  };
62
63  displayStatus (api) {
64    api.summary({
65      success: (data) => this.displayCurrentStatus(data),
66      error: (data) => this.showTooltip('Cannot retrieve status')
67    });
68  }
69
70  displayCurrentStatus (data) {
71    this.el.className += ` ${this.getStatus(data)}`;
72    this.showTooltip(data.status.description);
73  }
74
75  getStatus (data) {
76    let icon = '';
77
78    switch (data.status.indicator) {
79      case 'none':
80        icon = 'green';
81        break;
82      case 'minor':
83        icon = 'yellow';
84        break;
85      case 'major':
86      case 'critical':
87        icon = 'red';
88        break;
89      default:
90        'gray';
91    };
92
93    return icon;
94  }
95
96  showTooltip (title) {
97    this.Tooltip.set(this.el, title);
98  }
99};
100
101export default SystemStatus;