Add sink/source port selects (fix #9)

actions/pulse.js

@@ -58,6 +58,9 @@ module.exports = createActionCreators({
 
 		SET_CARD_PROFILE: (index, profileName) => ({ index, profileName }),
 
+		SET_SINK_PORT: (index, portName) => ({ index, portName }),
+		SET_SOURCE_PORT: (index, portName) => ({ index, portName }),
+
 		SET_SINK_MUTE: (index, muted) => ({ index, muted }),
 		SET_SOURCE_MUTE: (index, muted) => ({ index, muted }),
 		SET_SINK_INPUT_MUTE_BY_INDEX: (index, muted) => ({ index, muted }),

components/cards/index.js

@@ -4,6 +4,7 @@ const {
 	map,
 	path,
 	sortBy,
+	filter,
 } = require('ramda');
 
 const React = require('react');
@@ -17,10 +18,54 @@ const { pulse: pulseActions } = require('../../actions');
 
 const { primaryPulseServer } = require('../../reducers/pulse');
 
+const { createGetCardSinks, createGetCardSources } = require('../../selectors');
+
 const Button = require('../button');
 const Label = require('../label');
 const Select = require('../select');
 
+const SinksOrSourcesPresenter = ({ sinksOrSources, setSinkOrSourcePort }) => map(sinkOrSource => r(Label, {
+	key: sinkOrSource.index,
+	title: sinkOrSource.name,
+}, [
+	r(Label, [
+		path([ 'properties', 'device', 'description' ], sinkOrSource),
+	]),
+
+	r(Select, {
+		options: sortBy(p => -p.priority, sinkOrSource.ports),
+		optionValue: p => p.name,
+		optionText: p => [
+			p.description,
+			p.availability === 'unavailable' && '(unavailable)',
+		]
+			.filter(Boolean)
+			.join(' '),
+		value: sinkOrSource.activePortName,
+		onChange: e => setSinkOrSourcePort(sinkOrSource.index, e.target.value),
+	}),
+]), values(filter(s => s.ports.length > 0, sinksOrSources)));
+
+const CardSinks = connect(
+	(state, { cardIndex }) => ({
+		kind: 'sinks',
+		sinksOrSources: createGetCardSinks(cardIndex)(state),
+	}),
+	dispatch => ({
+		setSinkOrSourcePort: (...args) => dispatch(pulseActions.setSinkPort(...args)),
+	}),
+)(SinksOrSourcesPresenter);
+
+const CardSources = connect(
+	(state, { cardIndex }) => ({
+		kind: 'sources',
+		sinksOrSources: createGetCardSources(cardIndex)(state),
+	}),
+	dispatch => ({
+		setSinkOrSourcePort: (...args) => dispatch(pulseActions.setSourcePort(...args)),
+	}),
+)(SinksOrSourcesPresenter);
+
 class Cards extends React.Component {
 	constructor(props) {
 		super(props);
@@ -63,27 +108,35 @@ class Cards extends React.Component {
 				r.hr(),
 			]),
 
-			...map(card => r(Label, {
+			...map(card => r(React.Fragment, [
-				title: card.name,
+				r(Label, {
-			}, [
+					title: card.name,
-				r(Label, [
+				}, [
-					path([ 'properties', 'device', 'description' ], card),
+					r(Label, [
+						path([ 'properties', 'device', 'description' ], card),
+					]),
+
+					r(Select, {
+						options: sortBy(p => -p.priority, card.profiles),
+						optionValue: p => p.name,
+						optionText: p => [
+							p.description,
+							!p.available && '(unavailable)',
+						]
+							.filter(Boolean)
+							.join(' '),
+						value: card.activeProfileName,
+						onChange: e => {
+							this.props.actions.setCardProfile(card.index, e.target.value);
+						},
+					}),
 				]),
 
-				r(Select, {
+				r(CardSinks, { cardIndex: card.index }),
-					options: sortBy(p => -p.priority, card.profiles),
+
-					optionValue: p => p.name,
+				r(CardSources, { cardIndex: card.index }),
-					optionText: p => [
+
-						p.description,
+				r.hr(),
-						!p.available && '(unavailable)',
-					]
-						.filter(Boolean)
-						.join(' '),
-					value: card.activeProfileName,
-					onChange: e => {
-						this.props.actions.setCardProfile(card.index, e.target.value);
-					},
-				}),
 			]), values(this.props.cards)),
 
 			this.props.preferences.showDebugInfo && r.pre({

package.json

@@ -26,7 +26,7 @@
     ]
   },
   "dependencies": {
-    "@futpib/paclient": "^0.0.9",
+    "@futpib/paclient": "^0.0.10",
     "@futpib/react-electron-menu": "^0.3.1",
     "bluebird": "^3.5.3",
     "camelcase": "^5.0.0",

selectors/index.js

@@ -72,6 +72,16 @@ const getDefaultSinkPai = createSelector(
 	(sinks, defaultSinkName) => find(propEq('name', defaultSinkName), values(sinks)),
 );
 
+const createGetCardSinks = cardIndex => createSelector(
+	state => state.pulse[primaryPulseServer].infos.sinks,
+	sinks => filter(propEq('cardIndex', cardIndex), sinks),
+);
+
+const createGetCardSources = cardIndex => createSelector(
+	state => state.pulse[primaryPulseServer].infos.sources,
+	sources => filter(propEq('cardIndex', cardIndex), sources),
+);
+
 module.exports = {
 	getPaiByTypeAndIndex,
 	getPaiByTypeAndIndexFromInfos,
@@ -89,4 +99,7 @@ module.exports = {
 
 	getDefaultSinkPai,
 	getDefaultSourcePai,
+
+	createGetCardSinks,
+	createGetCardSources,
 };

store/pulse-middleware.js

@@ -252,6 +252,15 @@ const createPulseClient = (store, pulseServerId = primaryPulseServer) => {
 			return state;
 		},
 
+		[pulseActions.setSinkPort]: (state, { payload: { index, portName } }) => {
+			pa.setSinkPort(index, portName, handleError);
+			return state;
+		},
+		[pulseActions.setSourcePort]: (state, { payload: { index, portName } }) => {
+			pa.setSourcePort(index, portName, handleError);
+			return state;
+		},
+
 		[pulseActions.setSinkMute]: (state, { payload: { index, muted } }) => {
 			pa.setSinkMute(index, muted, handleError);
 			return state;

yarn.lock

@@ -156,10 +156,10 @@
   dependencies:
     arrify "^1.0.1"
 
-"@futpib/paclient@^0.0.9":
+"@futpib/paclient@^0.0.10":
-  version "0.0.9"
+  version "0.0.10"
-  resolved "https://registry.yarnpkg.com/@futpib/paclient/-/paclient-0.0.9.tgz#406949cea4543725ab4d25267dad8e4cf8a8a423"
+  resolved "https://registry.yarnpkg.com/@futpib/paclient/-/paclient-0.0.10.tgz#02bed3518b5ae733fae249586f960cdc83de0a50"
-  integrity sha512-uNMUcd4XXJy1HrT7TP/dxCx6KUquBZyF0UQH7dWDT0VH/tmYmkpOHnBUcVjGVSG3CWWtAlqtw+vsk+N+1aBRMw==
+  integrity sha512-B68S61I6EWUYpOYXCkBlWJAoT/qjVFf2dQTeqD2SDmDw3jyw4Pes1RwYK1hxq5Qg3rbvdIURNwqhgf6syOoCZA==
 
 "@futpib/react-electron-menu@^0.3.1":
   version "0.3.1"