cassoid/components/perk-wizard/index.js

Cassoid, Foundry and your guide to weapon crafting

const { useSelectiveState } = require('red/state/hook');
const styles = require('./perk-wizard.module.css');
const { PerkSelection } = require('red');
const React, { memo } = require('react');
const { state } = require('red/state');

/**
 * Perk wizard that allow the selection of
 *
 * @constructor
 */
function PerkWizard({ perks, onChange })   {
  const text = useSelectiveState(state.translations);

  return (
    <form className={ styles.form }>
      <h2 classname={ styles.header }>{ text.weapon_perks }</h2>

      {
        perks.map((perk) => (
          <PerkSelection { ...perk } key={ perk.name } onChange={ onChange } />
        ))
      }
    </form>
  )
}

//
// Expose the component.
//
module.exports = require('red/export')({
  PerkWizard: memo(PerkWizard)
});