render() { const { color } = this.props; const { data, loadingState } = this.state; return ( <> {!loadingState ? <Statistic inverted size='huge' color={color} style={{ height: '100%', marginTop: '5em' }}> <Statistic.Value>{data.value}</Statistic.Value> <Statistic.Label>{data.label}</Statistic.Label> </Statistic> : <Dimmer active> <Loader>Loading</Loader> </Dimmer> } </> ) }
handleActions({ 'add playlist' (state, action) { return [{ id: state.reduce((maxId, playlist) => Math.max(playlist.id, maxId), -1) + 1, label: action.payload }, ...state] }, 'delete playlist' (state, action) { return state.filter(playlist => playlist.id !== action.payload ) }, 'edit playlist' (state, action) { return state.map(playlist => { return playlist.id === action.payload.id ? { ...playlist, label: action.payload.label } : playlist }) }, }, initialState)
blocks[i].body.label = blocks.label; blocks[i] = blocks[i].body;