@@ -25,8 +25,8 @@ const config = {
25
25
} , {
26
26
user : {
27
27
// negative numbers can be used as temporary ids in a transaction
28
- id : - 1 ,
29
- name : 'Stella'
28
+ id : - 1 ,
29
+ name : 'Stella'
30
30
}
31
31
} , {
32
32
user : {
@@ -80,16 +80,16 @@ const NewTodo = () => {
80
80
transact ( [ {
81
81
todo : {
82
82
name : e . target . elements [ 'todo-name' ] . value ,
83
- createdAt : new Date
83
+ createdAt : new Date ( )
84
84
}
85
85
} ] )
86
86
e . target . reset ( )
87
87
} } >
88
- < input
88
+ < input
89
89
autoFocus
90
- type = "text"
91
- name = "todo-name"
92
- placeholder = "What needs to be done?"
90
+ type = "text"
91
+ name = "todo-name"
92
+ placeholder = "What needs to be done?"
93
93
autoComplete = "off"
94
94
required
95
95
/>
@@ -105,8 +105,8 @@ const TodoFilters = () => {
105
105
return (
106
106
< div >
107
107
< label htmlFor = "show-completed" > Show Completed?</ label >
108
- < input
109
- type = "checkbox"
108
+ < input
109
+ type = "checkbox"
110
110
id = "show-completed"
111
111
checked = { filters . get ( 'showCompleted' ) }
112
112
onChange = { e => transact ( [ { todoFilter : { id : filters . get ( 'id' ) , showCompleted : e . target . checked } } ] ) }
@@ -131,15 +131,15 @@ const ProjectSelect = ({ value, onChange }) => {
131
131
Project:
132
132
</ label >
133
133
134
- < select
135
- name = "projects"
134
+ < select
135
+ name = "projects"
136
136
value = { value }
137
137
onChange = { e => onChange && onChange ( Number ( e . target . value ) ) }
138
138
>
139
139
< option value = "0" > </ option >
140
140
{ projects . map ( project => (
141
- < option
142
- key = { project . get ( 'id' ) }
141
+ < option
142
+ key = { project . get ( 'id' ) }
143
143
value = { project . get ( 'id' ) }
144
144
>
145
145
{ project . get ( 'name' ) }
@@ -192,13 +192,13 @@ const Todo = ({ todo }) => (
192
192
const TodoCheck = ( { todo } ) => {
193
193
const [ transact ] = useTransact ( )
194
194
return (
195
- < input
195
+ < input
196
196
type = "checkbox"
197
197
style = { { width : 20 , height : 20 , cursor : 'pointer' } }
198
198
checked = { ! ! todo . get ( 'isCompleted' ) }
199
- onChange = { e => transact ( [ {
199
+ onChange = { e => transact ( [ {
200
200
todo : {
201
- id : todo . get ( 'id' ) ,
201
+ id : todo . get ( 'id' ) ,
202
202
isCompleted : e . target . checked
203
203
}
204
204
} ] ) }
@@ -209,8 +209,8 @@ const TodoCheck = ({ todo }) => {
209
209
const TodoName = ( { todo } ) => {
210
210
const [ transact ] = useTransact ( )
211
211
return (
212
- < input
213
- style = { {
212
+ < input
213
+ style = { {
214
214
border : 'none' , fontSize : 20 , marginTop : - 2 , cursor : 'pointer' ,
215
215
...todo . get ( 'isCompleted' ) && { textDecoration : 'line-through ' }
216
216
} }
@@ -226,7 +226,7 @@ const TodoProject = ({ todo }) => {
226
226
< ProjectSelect
227
227
value = { todo . get ( 'project' , 'id' ) || '' }
228
228
onChange = { projectId => transact ( [ { todo : { id : todo . get ( 'id' ) , 'project' : projectId || null } } ] ) }
229
- />
229
+ />
230
230
)
231
231
}
232
232
@@ -242,15 +242,15 @@ const TodoOwner = ({ todo }) => {
242
242
Owner:
243
243
</ label >
244
244
245
- < select
246
- name = "users"
245
+ < select
246
+ name = "users"
247
247
value = { todo . get ( 'owner' , 'id' ) || '' }
248
248
onChange = { e => transact ( [ { todo : { id : todo . get ( 'id' ) , owner : Number ( e . target . value ) || null } } ] ) }
249
249
>
250
250
< option value = "" > </ option >
251
251
{ users . map ( user => (
252
- < option
253
- key = { user . get ( 'id' ) }
252
+ < option
253
+ key = { user . get ( 'id' ) }
254
254
value = { user . get ( 'id' ) }
255
255
>
256
256
{ user . get ( 'name' ) }
0 commit comments