diff --git a/app/components/DeviceView.tsx b/app/components/DeviceView.tsx
index bc50de1..2bcf19c 100644
--- a/app/components/DeviceView.tsx
+++ b/app/components/DeviceView.tsx
@@ -13,7 +13,7 @@ import { ProgramTable, RunSectionForm, SectionRunnerView, SectionTable } from ".
import "@app/styles/DeviceView";
const ConnectionState = observer(({ connectionState, className }:
- { connectionState: ConState, className?: string }) => {
+ { connectionState: ConState, className?: string }) => {
const connected = connectionState.isDeviceConnected;
let connectionText: string;
let iconName: SemanticICONS = "unlinkify";
@@ -37,7 +37,7 @@ const ConnectionState = observer(({ connectionState, className }:
const classes = classNames("connectionState", clazzName, className);
return (
-
+
{connectionText}
);
@@ -57,26 +57,26 @@ class DeviceView extends React.Component
-
+
-
+
-
+
-
-
+
+
);
return (
-
-
+
Raspberry Pi Grinklers Device
diff --git a/app/components/ProgramTable.tsx b/app/components/ProgramTable.tsx
index 1b2f82d..cd1e312 100644
--- a/app/components/ProgramTable.tsx
+++ b/app/components/ProgramTable.tsx
@@ -2,7 +2,7 @@ import { observer } from "mobx-react";
import { RouterStore } from "mobx-react-router";
import * as React from "react";
import { Link } from "react-router-dom";
-import { Button, ButtonProps, Icon, Table } from "semantic-ui-react";
+import { Button, ButtonProps, Form, Icon, Table } from "semantic-ui-react";
import { ProgramSequenceView, ScheduleView } from "@app/components";
import * as rp from "@app/routePaths";
@@ -41,11 +41,11 @@ class ProgramRows extends React.Component<{
{stopStartButton}
@@ -54,8 +54,10 @@ class ProgramRows extends React.Component<{
const detailRow = expanded && (
-
Sequence:
- Schedule:
+
);
diff --git a/app/components/ScheduleView/ScheduleDate.tsx b/app/components/ScheduleView/ScheduleDate.tsx
index 834ed22..38e3f71 100644
--- a/app/components/ScheduleView/ScheduleDate.tsx
+++ b/app/components/ScheduleView/ScheduleDate.tsx
@@ -42,7 +42,7 @@ export default class ScheduleDate extends React.Component;
}
- dayNode = ;
+ dayNode = ;
} else {
let dayString: string;
if (date) {
@@ -56,7 +56,7 @@ export default class ScheduleDate extends React.Component{label}
+ labelNode = ;
} else if (label != null) {
labelNode = label;
}
diff --git a/app/components/ScheduleView/ScheduleTimes.tsx b/app/components/ScheduleView/ScheduleTimes.tsx
index c8df80c..6cac876 100644
--- a/app/components/ScheduleView/ScheduleTimes.tsx
+++ b/app/components/ScheduleView/ScheduleTimes.tsx
@@ -27,10 +27,11 @@ export default class ScheduleTimes extends React.Component<{
);
}
- return (
-
- {timesNode}
- );
+ return (
+
+ {timesNode}
+
+ );
}
private onTimeChange = (newTime: TimeOfDay, index: number) => {
const { times, onChange } = this.props;
diff --git a/app/components/ScheduleView/TimeInput.tsx b/app/components/ScheduleView/TimeInput.tsx
index 11f18b7..43e4373 100644
--- a/app/components/ScheduleView/TimeInput.tsx
+++ b/app/components/ScheduleView/TimeInput.tsx
@@ -28,18 +28,22 @@ export default class TimeInput extends React.Component;
}
+
private onChange = (e: React.SyntheticEvent, data: InputOnChangeData) => {
this.setState({
rawValue: data.value,
});
- };
+ }
+
private onBlur: React.FocusEventHandler = (e) => {
const m = moment(this.state.rawValue, HTML_TIME_INPUT_FORMAT);
if (m.isValid()) {
@@ -47,5 +51,5 @@ export default class TimeInput extends React.Component {
} else {
node = weekdays.map((weekday) => Weekday[weekday]).join(", ");
}
- return (
- {node}
- );
+ return (
+
+ {node}
+
+ );
}
private toggleWeekday = (event: React.FormEvent, data: CheckboxProps) => {
const { weekdays, onChange } = this.props;
diff --git a/app/components/ScheduleView/index.tsx b/app/components/ScheduleView/index.tsx
index dafd9d1..89d5eef 100644
--- a/app/components/ScheduleView/index.tsx
+++ b/app/components/ScheduleView/index.tsx
@@ -23,7 +23,7 @@ export default class ScheduleView extends React.Component {
let labelNode: React.ReactNode;
if (typeof label === "string") {
- labelNode =
+ labelNode = ;
} else if (label != null) {
labelNode = label;
}
@@ -31,10 +31,10 @@ export default class ScheduleView extends React.Component {
return (
{labelNode}
-
-
-
-
+
+
+
+
);
}
diff --git a/app/pages/ProgramPage.tsx b/app/pages/ProgramPage.tsx
index 382c213..223aff3 100644
--- a/app/pages/ProgramPage.tsx
+++ b/app/pages/ProgramPage.tsx
@@ -71,7 +71,7 @@ class ProgramPage extends React.Component {
} else {
editButtons = (
);
@@ -141,11 +141,15 @@ class ProgramPage extends React.Component {
readOnly={!editing}
onChange={this.onEnabledChange}
/>
-
+
-
+
Schedule} />