88 lines
2.5 KiB
JavaScript
88 lines
2.5 KiB
JavaScript
import React, { useGlobal } from 'reactn'
|
|
import { View, Text, Pressable } from 'react-native'
|
|
import { capitalize } from 'lodash'
|
|
import moment from 'moment'
|
|
import { Motion } from '@legendapp/motion'
|
|
import { validateDate } from 'react-native-minuit/src/actions/dateActions'
|
|
|
|
import { Fonts, Palette, Style } from '../styles'
|
|
import { projectsRef } from '../config/firebase'
|
|
|
|
export default ({ actionList = [] }) => {
|
|
const [currentProjectID] = useGlobal('currentProjectID')
|
|
|
|
const onCheck = async ({ todoID, isChecked = false }) => {
|
|
try {
|
|
const updatedObject = {
|
|
isChecked: !isChecked,
|
|
completionTimestamp: !isChecked ? new Date() : null,
|
|
}
|
|
|
|
await projectsRef
|
|
.doc(currentProjectID)
|
|
.collection('todoList')
|
|
.doc(todoID)
|
|
.update(updatedObject)
|
|
} catch (error) {
|
|
console.log('error', error)
|
|
}
|
|
}
|
|
|
|
if (!actionList.length) {
|
|
return (
|
|
<Text style={Fonts({ type: 'default', style: {} })}>
|
|
Vous n'avez pas d'actions en attente.
|
|
</Text>
|
|
)
|
|
}
|
|
|
|
return actionList.map(
|
|
(
|
|
{ title = '', requestedCompletionTimestamp = null, isChecked = false, todoID = null },
|
|
index
|
|
) => {
|
|
return (
|
|
<React.Fragment key={index}>
|
|
<Pressable style={Style.containerRow} onPress={() => onCheck({ todoID, isChecked })}>
|
|
<View style={[Style.containerRadio, { marginRight: 20 }]}>
|
|
{isChecked && (
|
|
<Motion.View
|
|
initial={{ opacity: 0, scale: 0 }}
|
|
animate={{ opacity: 1, scale: 1 }}
|
|
style={Style.circleRadio}
|
|
/>
|
|
)}
|
|
</View>
|
|
|
|
<View>
|
|
<Text
|
|
style={Fonts({
|
|
type: 'default',
|
|
style: isChecked ? { textDecorationLine: 'line-through' } : {},
|
|
})}
|
|
>
|
|
{capitalize(title)}
|
|
</Text>
|
|
|
|
<Text
|
|
style={Fonts({
|
|
type: 'default',
|
|
color: Palette.transparentWhite,
|
|
})}
|
|
>
|
|
{capitalize(moment(validateDate(requestedCompletionTimestamp)).fromNow())}
|
|
</Text>
|
|
</View>
|
|
</Pressable>
|
|
|
|
{index !== actionList.length - 1 && (
|
|
<View
|
|
style={[Style.separatorHorizontal, Style.containerRevertGutter, { width: '112%' }]}
|
|
/>
|
|
)}
|
|
</React.Fragment>
|
|
)
|
|
}
|
|
)
|
|
}
|