Hide flash messages using Stimulus 29 augustus 2020

When converting some old code to stimulus I needed a way to hide the flash messages that Rails generates in native javascript.

(Flash messages are notifications to inform a user that a CRUD action has taken place. E.g. User updates successfully.)

import { Controller } from 'stimulus';

export default class extends Controller {
  static targets = ['message']

  connect() {
    this.timeout = setTimeout(this.closeFlash, 2500);
  }

  disconnect() {
    clearTimeout(this.timeout);
  }

  closeFlash = () => {
    this.element.style.display = 'none';
  }

  get flashBox() {
    return $(this.element);
  }
}