All files / app/assets/javascripts/pages/admin/application_settings payload_previewer.js

0% Statements 0/29
0% Branches 0/4
0% Functions 0/10
0% Lines 0/27

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70                                                                                                                                           
import createFlash from '~/flash';
import axios from '../../../lib/utils/axios_utils';
import { __ } from '../../../locale';
 
export default class PayloadPreviewer {
  constructor(trigger) {
    this.trigger = trigger;
    this.isVisible = false;
    this.isInserted = false;
  }
 
  init() {
    this.spinner = this.trigger.querySelector('.js-spinner');
    this.text = this.trigger.querySelector('.js-text');
 
    this.trigger.addEventListener('click', (event) => {
      event.preventDefault();
 
      if (this.isVisible) return this.hidePayload();
 
      return this.requestPayload();
    });
  }
 
  getContainer() {
    return document.querySelector(this.trigger.dataset.payloadSelector);
  }
 
  requestPayload() {
    if (this.isInserted) return this.showPayload();
 
    this.spinner.classList.add('gl-display-inline-flex');
 
    const container = this.getContainer();
 
    return axios
      .get(container.dataset.endpoint, {
        responseType: 'text',
      })
      .then(({ data }) => {
        this.spinner.classList.remove('gl-display-inline-flex');
        this.insertPayload(data);
      })
      .catch(() => {
        this.spinner.classList.remove('gl-display-inline-flex');
        createFlash({
          message: __('Error fetching payload data.'),
        });
      });
  }
 
  hidePayload() {
    this.isVisible = false;
    this.getContainer().classList.add('gl-display-none');
    this.text.textContent = __('Preview payload');
  }
 
  showPayload() {
    this.isVisible = true;
    this.getContainer().classList.remove('gl-display-none');
    this.text.textContent = __('Hide payload');
  }
 
  insertPayload(data) {
    this.isInserted = true;
    this.getContainer().innerHTML = data;
    this.showPayload();
  }
}