smarthut/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Prettier reformat

Browse source
This commit is contained in:
Claudio Maggioni 2020-05-08 15:45:08 +02:00
parent 3e53f11da0
commit e5bf0dbd83
6 changed files with 1366 additions and 1435 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
smart-hut/src/components/HeaderController.js
View file

@ -77,10 +77,16 @@ export class MyHeader extends React.Component {
<Button basic inverted onClick={this.logout}> <Button basic inverted onClick={this.logout}>
Logout Logout
</Button> </Button>
<Segment compact style={{margin: "auto", marginTop: "1em", textAlign: "center"}}> <Segment
compact
style={{
margin: "auto",
marginTop: "1em",
textAlign: "center",
}}
>
<Checkbox <Checkbox
label={<label label={<label>Share cameras</label>}
>Share cameras</label>}
checked={this.props.cameraEnabled} checked={this.props.cameraEnabled}
toggle toggle
onChange={(e, val) => this.setCameraEnabled(val.checked)} onChange={(e, val) => this.setCameraEnabled(val.checked)}
@ -108,10 +114,16 @@ export class MyHeader extends React.Component {
</Label> </Label>
<Divider /> <Divider />
<Button onClick={this.logout}>Logout</Button> <Button onClick={this.logout}>Logout</Button>
<Segment compact style={{margin: "auto", marginTop: "1em", textAlign: "center"}}> <Segment
compact
style={{
margin: "auto",
marginTop: "1em",
textAlign: "center",
}}
>
<Checkbox <Checkbox
label={<label label={<label>Share cameras</label>}
>Share cameras</label>}
checked={this.props.cameraEnabled} checked={this.props.cameraEnabled}
toggle toggle
onChange={(e, val) => this.setCameraEnabled(val.checked)} onChange={(e, val) => this.setCameraEnabled(val.checked)}

89
smart-hut/src/components/dashboard/AutomationCreationModal.js
View file

@ -99,9 +99,7 @@ const CreateTrigger = (props) => {
<React.Fragment> <React.Fragment>
<Form.Field inline width={2}> <Form.Field inline width={2}>
<Dropdown <Dropdown
onChange={(e, val) => onChange={(e, val) => props.inputChange(val)}
props.inputChange(val)
}
ref={operandsRef} ref={operandsRef}
name="operand" name="operand"
compact compact
@ -124,9 +122,7 @@ const CreateTrigger = (props) => {
) : ( ) : (
<Form.Field inline width={7}> <Form.Field inline width={7}>
<Dropdown <Dropdown
onChange={(e, val) => onChange={(e, val) => props.inputChange(val)}
props.inputChange(val)
}
placeholder="State" placeholder="State"
name="on" name="on"
compact compact
@ -153,10 +149,7 @@ const SceneItem = (props) => {
<Checkbox <Checkbox
toggle toggle
onChange={(e, val) => onChange={(e, val) =>
props.orderScenes( props.orderScenes(props.scene.id, val.checked)
props.scene.id,
val.checked
)
} }
checked={position + 1 > 0} checked={position + 1 > 0}
/> />
@ -165,9 +158,7 @@ const SceneItem = (props) => {
<h3>{props.scene.name}</h3> <h3>{props.scene.name}</h3>
</Grid.Column> </Grid.Column>
<Grid.Column width={4}> <Grid.Column width={4}>
<h3> <h3>{position !== -1 ? "# " + (position + 1) : ""}</h3>
{position !== -1 ? "# " + (position + 1) : ""}
</h3>
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>
@ -187,9 +178,7 @@ const Trigger = ({ deviceName, trigger, onRemove, index }) => {
<Menu compact> <Menu compact>
<Menu.Item as="span">{deviceName}</Menu.Item> <Menu.Item as="span">{deviceName}</Menu.Item>
{operand ? <Menu.Item as="span">{symbol}</Menu.Item> : ""} {operand ? <Menu.Item as="span">{symbol}</Menu.Item> : ""}
<Menu.Item as="span"> <Menu.Item as="span">{operand ? value : on ? "on" : "off"}</Menu.Item>
{operand ? value : on ? "on" : "off"}
</Menu.Item>
</Menu> </Menu>
<Icon <Icon
as={"i"} as={"i"}
@ -217,8 +206,7 @@ class AutomationSaveModal extends Component {
if (this.props.automation) { if (this.props.automation) {
this.state.automationName = this.props.automation.name; this.state.automationName = this.props.automation.name;
for (const scenePriority of this.props.automation.scenes) { for (const scenePriority of this.props.automation.scenes) {
this.state.order[scenePriority.priority] = this.state.order[scenePriority.priority] = scenePriority.sceneId;
scenePriority.sceneId;
} }
for (const trigger of this.props.automation.triggers) { for (const trigger of this.props.automation.triggers) {
this.state.triggerList.push( this.state.triggerList.push(
@ -296,19 +284,11 @@ class AutomationSaveModal extends Component {
return error; return error;
} }
let deviceKind = device.kind; let deviceKind = device.kind;
const devicesWithPercentage = [ const devicesWithPercentage = ["dimmableLight", "curtains", "knobDimmer"];
"dimmableLight",
"curtains",
"knobDimmer",
];
switch (triggerKind) { switch (triggerKind) {
case "booleanTrigger": case "booleanTrigger":
if ( if (!trigger.device || trigger.on === null || trigger.on === undefined)
!trigger.device ||
trigger.on === null ||
trigger.on === undefined
)
return error; return error;
break; break;
case "rangeTrigger": case "rangeTrigger":
@ -324,16 +304,14 @@ class AutomationSaveModal extends Component {
devicesWithPercentage.includes(deviceKind) && devicesWithPercentage.includes(deviceKind) &&
trigger.value > 100 trigger.value > 100
) { ) {
error.message = error.message = "The value can't exceed 100, as it's a percentage";
"The value can't exceed 100, as it's a percentage";
return error; return error;
} else if ( } else if (
deviceKind === "sensor" && deviceKind === "sensor" &&
device.sensor === "HUMIDITY" && device.sensor === "HUMIDITY" &&
trigger.value > 100 trigger.value > 100
) { ) {
error.message = error.message = "The value can't exceed 100, as it's a percentage";
"The value can't exceed 100, as it's a percentage";
return error; return error;
} }
break; break;
@ -354,9 +332,7 @@ class AutomationSaveModal extends Component {
} }
addTrigger() { addTrigger() {
const { result, message } = this._checkNewTrigger( const { result, message } = this._checkNewTrigger(this.state.newTrigger);
this.state.newTrigger
);
if (result) { if (result) {
this.setState( this.setState(
@ -508,12 +484,7 @@ class AutomationSaveModal extends Component {
onClick={this.openModal} onClick={this.openModal}
/> />
) : ( ) : (
<Button <Button icon labelPosition="left" color="green" onClick={this.openModal}>
icon
labelPosition="left"
color="green"
onClick={this.openModal}
>
<Icon name="add"></Icon>Create new automation <Icon name="add"></Icon>Create new automation
</Button> </Button>
); );
@ -557,32 +528,21 @@ class AutomationSaveModal extends Component {
<Header>Create Triggers</Header> <Header>Create Triggers</Header>
<List divided relaxed> <List divided relaxed>
{this.state.triggerList.length > 0 && {this.state.triggerList.length > 0 &&
this.state.triggerList.map( this.state.triggerList.map((trigger, i) => {
(trigger, i) => {
const deviceName = this.deviceList.filter( const deviceName = this.deviceList.filter(
(d) => (d) => d.id === trigger.device
d.id ===
trigger.device
)[0].name; )[0].name;
const key = this._generateKey( const key = this._generateKey(trigger);
trigger
);
return ( return (
<Trigger <Trigger
key={key} key={key}
index={i} index={i}
deviceName={ deviceName={deviceName}
deviceName
}
trigger={trigger} trigger={trigger}
onRemove={ onRemove={this.removeTrigger}
this
.removeTrigger
}
/> />
); );
} })}
)}
<CreateTrigger <CreateTrigger
devices={this.props.devices} devices={this.props.devices}
inputChange={this.onInputChange} inputChange={this.onInputChange}
@ -613,9 +573,7 @@ class AutomationSaveModal extends Component {
key={scene.id} key={scene.id}
scene={scene} scene={scene}
order={this.state.order} order={this.state.order}
orderScenes={ orderScenes={this.orderScenes}
this.orderScenes
}
/> />
))} ))}
</List> </List>
@ -625,9 +583,7 @@ class AutomationSaveModal extends Component {
<Header icon> <Header icon>
<Icon name="world" /> <Icon name="world" />
</Header> </Header>
<Button primary> <Button primary>Create Scene</Button>
Create Scene
</Button>
</React.Fragment> </React.Fragment>
)} )}
</Grid.Column> </Grid.Column>
@ -637,10 +593,7 @@ class AutomationSaveModal extends Component {
<Grid> <Grid>
<Grid.Row> <Grid.Row>
<Grid.Column style={{ marginRight: "1rem" }}> <Grid.Column style={{ marginRight: "1rem" }}>
<Button <Button onClick={() => this.saveAutomation()} color="green">
onClick={() => this.saveAutomation()}
color="green"
>
{this.props.id ? "Save" : "Create"} {this.props.id ? "Save" : "Create"}
</Button> </Button>
</Grid.Column> </Grid.Column>

18
smart-hut/src/components/dashboard/AutomationsPanel.js
View file

@ -51,9 +51,7 @@ const Automation = ({ automation, devices, scenes, removeAutomation }) => {
<Menu.Item as="span"> <Menu.Item as="span">
{device.name}{" "} {device.name}{" "}
{trigger.operator {trigger.operator
? getOperator( ? getOperator(trigger.operator) +
trigger.operator
) +
" " + " " +
trigger.range trigger.range
: trigger.on : trigger.on
@ -76,9 +74,7 @@ const Automation = ({ automation, devices, scenes, removeAutomation }) => {
if (!sceneData) return ""; if (!sceneData) return "";
return ( return (
<Menu key={sceneData.id} compact> <Menu key={sceneData.id} compact>
<Menu.Item as="span"> <Menu.Item as="span">{sceneData.name}</Menu.Item>
{sceneData.name}
</Menu.Item>
</Menu> </Menu>
); );
})} })}
@ -119,9 +115,7 @@ class AutomationsPanel extends Component {
removeAutomation = (id) => { removeAutomation = (id) => {
this.props this.props
.deleteAutomation(id) .deleteAutomation(id)
.catch((err) => .catch((err) => console.error(`error removing automation ${id}:`, err));
console.error(`error removing automation ${id}:`, err)
);
}; };
render() { render() {
@ -141,11 +135,7 @@ class AutomationsPanel extends Component {
<Grid.Row> <Grid.Row>
{this.props.automations.map((automation, i) => { {this.props.automations.map((automation, i) => {
return ( return (
<Grid.Column <Grid.Column key={i} width={8} style={{ margin: "2rem 0" }}>
key={i}
width={8}
style={{ margin: "2rem 0" }}
>
<Automation <Automation
removeAutomation={this.removeAutomation} removeAutomation={this.removeAutomation}
scenes={this.props.scenes} scenes={this.props.scenes}

7
smart-hut/src/components/dashboard/devices/Sensor.js
View file

@ -57,13 +57,6 @@ class Sensor extends Component {
this.name = "Sensor"; this.name = "Sensor";
} }
// setName = () => {
// if (this.props.device.name.length > 15) {
// return this.props.device.name.slice(0, 12) + "...";
// }
// return this.props.device.name;
// };
componentDidUpdate(prevProps) { componentDidUpdate(prevProps) {
if ( if (
this.props.stateOrDevice.kind === "sensor" && this.props.stateOrDevice.kind === "sensor" &&

35
smart-hut/src/store.js
View file

@ -248,8 +248,7 @@ function reducer(previousState, action) {
change.scenes[sceneState.sceneId] || {}; change.scenes[sceneState.sceneId] || {};
change.scenes[sceneState.sceneId].sceneStates = change.scenes[sceneState.sceneId].sceneStates =
change.scenes[sceneState.sceneId].sceneStates || {}; change.scenes[sceneState.sceneId].sceneStates || {};
const sceneStates = const sceneStates = change.scenes[sceneState.sceneId].sceneStates;
change.scenes[sceneState.sceneId].sceneStates;
sceneStates.$add = sceneStates.$add || []; sceneStates.$add = sceneStates.$add || [];
sceneStates.$add.push(sceneState.id); sceneStates.$add.push(sceneState.id);
} else { } else {
@ -340,8 +339,7 @@ function reducer(previousState, action) {
} }
if (device.roomId in newState.rooms) { if (device.roomId in newState.rooms) {
change.rooms[device.roomId] = change.rooms[device.roomId] = change.rooms[device.roomId] || {};
change.rooms[device.roomId] || {};
change.rooms[device.roomId].devices = change.rooms[device.roomId].devices =
change.rooms[device.roomId].devices || {}; change.rooms[device.roomId].devices || {};
const devices = change.rooms[device.roomId].devices; const devices = change.rooms[device.roomId].devices;
@ -356,9 +354,7 @@ function reducer(previousState, action) {
$set: new Set([device.id]), $set: new Set([device.id]),
}; };
} else { } else {
change.pendingJoins.rooms[device.roomId].$set.add( change.pendingJoins.rooms[device.roomId].$set.add(device.id);
device.id
);
} }
} }
} }
@ -522,9 +518,7 @@ function reducer(previousState, action) {
break; break;
case "SCENE_DELETE": case "SCENE_DELETE":
if (!(action.sceneId in previousState.scenes)) { if (!(action.sceneId in previousState.scenes)) {
console.warn( console.warn(`Scene to delete ${action.sceneId} does not exist`);
`Scene to delete ${action.sceneId} does not exist`
);
break; break;
} }
@ -547,9 +541,7 @@ function reducer(previousState, action) {
break; break;
case "STATE_DELETE": case "STATE_DELETE":
if (!(action.stateId in previousState.sceneStates)) { if (!(action.stateId in previousState.sceneStates)) {
console.warn( console.warn(`State to delete ${action.stateId} does not exist`);
`State to delete ${action.stateId} does not exist`
);
break; break;
} }
@ -558,9 +550,7 @@ function reducer(previousState, action) {
}; };
if ( if (
previousState.scenes[ previousState.scenes[previousState.sceneStates[action.stateId].sceneId]
previousState.sceneStates[action.stateId].sceneId
]
) { ) {
change.scenes = { change.scenes = {
[previousState.sceneStates[action.stateId].sceneId]: { [previousState.sceneStates[action.stateId].sceneId]: {
@ -574,9 +564,7 @@ function reducer(previousState, action) {
case "DEVICE_DELETE": case "DEVICE_DELETE":
if (!(action.deviceId in previousState.devices)) { if (!(action.deviceId in previousState.devices)) {
console.warn( console.warn(`Device to delete ${action.deviceId} does not exist`);
`Device to delete ${action.deviceId} does not exist`
);
break; break;
} }
@ -584,11 +572,7 @@ function reducer(previousState, action) {
devices: { $unset: [action.deviceId] }, devices: { $unset: [action.deviceId] },
}; };
if ( if (previousState.rooms[previousState.devices[action.deviceId].roomId]) {
previousState.rooms[
previousState.devices[action.deviceId].roomId
]
) {
change.rooms = { change.rooms = {
[previousState.devices[action.deviceId].roomId]: { [previousState.devices[action.deviceId].roomId]: {
devices: { $remove: [action.deviceId] }, devices: { $remove: [action.deviceId] },
@ -614,8 +598,7 @@ function reducer(previousState, action) {
const allDevices = JSON.parse(action.payload.message); const allDevices = JSON.parse(action.payload.message);
const devices = allDevices.filter( const devices = allDevices.filter(
(d) => (d) =>
(d.fromHostId === null || d.fromHostId === undefined) && (d.fromHostId === null || d.fromHostId === undefined) && !d.deleted
!d.deleted
); );
const hostDevicesMapByHostId = allDevices const hostDevicesMapByHostId = allDevices
.filter((d) => d.fromHostId) .filter((d) => d.fromHostId)