import React from 'react';
-import CountDisplay from './CountDisplay';
import ToggleIcon from './ToggleIcon';
+import { BOTTLE_CONTENTS } from '../../helpers/tracker';
import { useTracker } from '../../hooks/tracker';
const Items = () => {
</div>
<div className="item">
<ToggleIcon controller={ToggleIcon.medallionController} icons={['bombos']} />
+ {state['mm-medallion'] === 'bombos' ?
+ <span className="med-display bottom-left">MM</span>
+ : null}
+ {state['tr-medallion'] === 'bombos' ?
+ <span className="med-display bottom-right">TR</span>
+ : null}
</div>
<div className="item">
<ToggleIcon controller={ToggleIcon.medallionController} icons={['ether']} />
+ {state['mm-medallion'] === 'ether' ?
+ <span className="med-display bottom-left">MM</span>
+ : null}
+ {state['tr-medallion'] === 'ether' ?
+ <span className="med-display bottom-right">TR</span>
+ : null}
</div>
<div className="item">
<ToggleIcon controller={ToggleIcon.medallionController} icons={['quake']} />
+ {state['mm-medallion'] === 'quake' ?
+ <span className="med-display bottom-left">MM</span>
+ : null}
+ {state['tr-medallion'] === 'quake' ?
+ <span className="med-display bottom-right">TR</span>
+ : null}
</div>
<div className="item">
<ToggleIcon controller={ToggleIcon.simpleController} icons={['lamp']} />
<ToggleIcon controller={ToggleIcon.simpleController} icons={['book']} />
</div>
<div className="item">
- <ToggleIcon controller={ToggleIcon.countController(4)} icons={['bottle']} />
- <CountDisplay className="bottom-right" count={state.bottle || 0} />
+ <ToggleIcon
+ className="top-left"
+ controller={ToggleIcon.bottleController('bottle-1')}
+ icons={BOTTLE_CONTENTS}
+ />
+ <ToggleIcon
+ className="top-right"
+ controller={ToggleIcon.bottleController('bottle-2')}
+ icons={BOTTLE_CONTENTS}
+ />
+ <ToggleIcon
+ className="bottom-left"
+ controller={ToggleIcon.bottleController('bottle-3')}
+ icons={BOTTLE_CONTENTS}
+ />
+ <ToggleIcon
+ className="bottom-right"
+ controller={ToggleIcon.bottleController('bottle-4')}
+ icons={BOTTLE_CONTENTS}
+ />
</div>
<div className="item">
<ToggleIcon controller={ToggleIcon.simpleController} icons={['somaria']} />