Add support for editing a task's status.

src/components/TaskEdit.tsx

@@ -28,7 +28,7 @@ import * as ICAL from 'ical.js';
 
 import * as EteSync from '../api/EteSync';
 
-import { TaskType } from '../pim-types';
+import { TaskType, TaskStatusType } from '../pim-types';
 
 interface PropsType {
   collections: Array<EteSync.CollectionInfo>;
@@ -44,6 +44,7 @@ class TaskEdit extends React.PureComponent<PropsType> {
   state: {
     uid: string,
     title: string;
+    status: TaskStatusType;
     allDay: boolean;
     start?: Date;
     due?: Date;
@@ -60,6 +61,7 @@ class TaskEdit extends React.PureComponent<PropsType> {
     this.state = {
       uid: '',
       title: '',
+      status: TaskStatusType.NeedsAction,
       allDay: false,
       location: '',
       description: '',
@@ -73,6 +75,7 @@ class TaskEdit extends React.PureComponent<PropsType> {
 
       this.state.uid = event.uid;
       this.state.title = event.title ? event.title : '';
+      this.state.status = event.status;
       if (event.startDate) {
         this.state.allDay = event.startDate.isDate;
         this.state.start = event.startDate.toJSDate();
@@ -162,6 +165,7 @@ class TaskEdit extends React.PureComponent<PropsType> {
 
     event.uid = this.state.uid;
     event.summary = this.state.title;
+    event.status = this.state.status;
     if (startDate) {
       event.startDate = startDate;
     }
@@ -238,6 +242,22 @@ class TaskEdit extends React.PureComponent<PropsType> {
             </Select>
           </FormControl>
 
+          <FormControl style={styles.fullWidth} >
+            <InputLabel>
+              Status
+            </InputLabel>
+            <Select
+              name="status"
+              value={this.state.status}
+              onChange={this.handleInputChange}
+            >
+              <MenuItem value={TaskStatusType.NeedsAction}>Needs action</MenuItem>
+              <MenuItem value={TaskStatusType.InProcess}>In progress</MenuItem>
+              <MenuItem value={TaskStatusType.Completed}>Completed</MenuItem>
+              <MenuItem value={TaskStatusType.Cancelled}>Cancelled</MenuItem>
+            </Select>
+          </FormControl>
+
           <FormGroup>
             <FormControlLabel
               control={

src/pim-types.ts

@@ -53,6 +53,13 @@ export class EventType extends ICAL.Event implements PimType {
   }
 }
 
+export enum TaskStatusType {
+  NeedsAction = 'NEEDS-ACTION',
+  Completed = 'COMPLETED',
+  InProcess = 'IN-PROCESS',
+  Cancelled = 'CANCELLED',
+}
+
 export class TaskType extends EventType {
   color: string;
 
@@ -69,6 +76,14 @@ export class TaskType extends EventType {
     return status === 'COMPLETED';
   }
 
+  set status(status: TaskStatusType) {
+      this.component.updatePropertyWithValue('status', status);
+  }
+
+  get status(): TaskStatusType {
+    return this.component.getFirstPropertyValue('status');
+  }
+
   set dueDate(date: ICAL.Time | undefined) {
     if (date) {
       this.component.updatePropertyWithValue('due', date);