@bbc/react-transcript-editor/dist/TranscriptEditor/Settings/Shortcuts.js

A React component to make transcribing audio and video easier and faster.

import React from 'react';
import PropTypes from 'prop-types';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faWindowClose } from '@fortawesome/free-solid-svg-icons';
import returnHotKeys from '../MediaPlayer/defaultHotKeys';
import style from './Shortcuts.module.css';

class Shortcuts extends React.Component {
  render() {
    const hotKeys = returnHotKeys(this);
    const hotKeysCheatsheet = Object.keys(hotKeys).map((key, i) => {
      const shortcut = hotKeys[key];
      return React.createElement("li", {
        key: i,
        className: style.listItem
      }, React.createElement("div", {
        className: style.shortcut
      }, key), React.createElement("div", {
        className: style.shortcutLabel
      }, shortcut.label));
    });
    return React.createElement("div", {
      className: style.shortcuts
    }, React.createElement("h2", {
      className: style.header
    }, "Shortcuts"), React.createElement("div", {
      className: style.closeButton,
      onClick: this.props.handleShortcutsToggle
    }, React.createElement(FontAwesomeIcon, {
      icon: faWindowClose
    })), React.createElement("ul", {
      className: style.list
    }, hotKeysCheatsheet));
  }

}

Shortcuts.propTypes = {
  handleShortcutsToggle: PropTypes.func
};
export default Shortcuts;