diff --git a/components/log/index.js b/components/log/index.js index 4a6f675..5a90d83 100644 --- a/components/log/index.js +++ b/components/log/index.js @@ -17,29 +17,43 @@ const { connect } = require('react-redux'); const weakmapId = require('../../utils/weakmap-id'); +const { pulse: pulseActions } = require('../../actions'); + +const actionTypeText = { + [pulseActions.ready]: 'Connected to PulseAudio', + [pulseActions.close]: 'Disconnected from PulseAudio', +}; + class Log extends React.Component { constructor(props) { super(props); this.state = { - removedErrors: [], + removedItems: [], }; } - removeError(error) { + removeItem(item) { this.setState({ - removedErrors: takeLast(10, this.state.removedErrors.concat(weakmapId(error))), + removedItems: takeLast(10, this.state.removedItems.concat(weakmapId(item))), }); } - shouldShowError(error) { - return !this.state.removedErrors.includes(weakmapId(error)); + shouldShowItem(item) { + return !this.state.removedItems.includes(weakmapId(item)); + } + + itemText(item) { + if (item.type === 'error') { + return `${item.error.name}: ${item.error.message}`; + } + return actionTypeText[item.action] || item.action; } componentDidUpdate(prevProps) { - const newErrors = differenceWith((a, b) => a === b, this.props.log.errors, prevProps.log.errors); - newErrors.forEach(error => setTimeout(() => { - this.removeError(error); + const newItems = differenceWith((a, b) => a === b, this.props.log.items, prevProps.log.items); + newItems.forEach(item => setTimeout(() => { + this.removeItem(item); }, this.props.itemLifetime)); } @@ -51,12 +65,16 @@ class Log extends React.Component { transitionEnterTimeout: 300, transitionLeaveTimeout: 2000, }, compose( - map(e => r.div({ - key: weakmapId(e), - className: 'log-item-error', - }, `${e.name}: ${e.message}`)), - filter(e => this.shouldShowError(e)), - )(this.props.log.errors))); + map(item => r.div({ + key: weakmapId(item), + classSet: { + 'log-item': true, + 'log-item-error': item.type === 'error', + 'log-item-info': item.type === 'info', + }, + }, this.itemText(item))), + filter(item => this.shouldShowItem(item)), + )(this.props.log.items))); } } diff --git a/reducers/pulse.js b/reducers/pulse.js index 158e6a9..0b6fbfe 100644 --- a/reducers/pulse.js +++ b/reducers/pulse.js @@ -26,9 +26,11 @@ const initialState = { objects: fromPairs(map(({ key }) => [ key, {} ], things)), infos: fromPairs(map(({ key }) => [ key, {} ], things)), - log: { errors: [] }, + log: { items: [] }, }; +const logMaxItems = 3; + const reducer = combineReducers({ state: handleActions({ [pulse.ready]: always('ready'), @@ -110,9 +112,20 @@ const reducer = combineReducers({ }, initialState.infos[key]) ], things))), log: combineReducers({ - errors: handleActions({ - [pulse.error]: (state, { payload }) => takeLast(3, state.concat(payload)), - }, initialState.log.errors), + items: handleActions({ + [pulse.error]: (state, { payload }) => takeLast(logMaxItems, state.concat({ + type: 'error', + error: payload, + })), + [pulse.close]: (state, { type }) => takeLast(logMaxItems, state.concat({ + type: 'info', + action: type, + })), + [pulse.ready]: (state, { type }) => takeLast(logMaxItems, state.concat({ + type: 'info', + action: type, + })), + }, initialState.log.items), }), });