isomorphic-style-loader - How to add an "active" class

Question

I'm using react-starter-kit and building a list component that looks like this:

import React from 'react';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import s from './CommandList.css';

const CommandList = () => {
  return (
    <ul className={s.commandList}>
      {data.commands.map((command, index) => (
        <li 
          key={index}
          className={s.commandListItem}>
          {command.command}
        </li>
      ))} 
    </ul>
  );
};

export default withStyles(s)(CommandList);

I'm trying to add an "active" class to my li item but not sure how to to that? I tried using the classnames library but not sure how to get the second class from my styles. When I just pass in the string "active", the styles don't get imported.

import cx from 'classnames';

<li className={cx(s.commandListItem, {'active': command.active })}>

My question is how would I do something like:

<li className={cx(s.commandListItem, {s.active: command.active })}>

Answer 1

<li className={cx(s.commandListItem, {[s.active]: command.active })}>
see [] object key notation