test.js

// bad
<div
	className={`miniBook__tab miniBook__tabOneWay${oneWay ? ' miniBook__tab--active' : ''}`}
	onClick={() => this.tabOnClick(oneWay)}
>
	{children}
</div>

// better
<div
	className={classNames(
		`${miniBookBaseClass}__tab`,
		`${miniBookBaseClass}__tabOneWay`,
		{ [`${miniBookBaseClass}__tab--active`]: oneWay }
	)}
	onClick={() => this.tabOnClick(oneWay)}
>
	{children}
</div>

// best
const Tab = ({ isActive, baseClass, tabType, children, ...restProps }) => (
	<div
		className={classNames(
			`${baseClass}__tab`,
			`${baseClass}__${tabType}`,
			{ [`${baseClass}__tab--active`]: isActive }
		)}
		{...restProps}
	>
		{children}
	</div>
)
// use
<Tab 
	isActive={oneWay} 
	baseClass='miniBook' 
	tabType='tabOneWay'
	onClick={() => this.tabOnClick(oneWay)} 
>
	tab text
</Tab>