Merge branch 'fix/task-modals' into 'master'

FIX |  tasks confirm modal windows

See merge request jetup/rws/rws-appication!358

src/modules/tasks/hooks/use-task-actions.hook.ts

@@ -162,10 +162,15 @@ export const useTaskActions = (reload = (id: number) => {}) => {
 		}
 	}
 	const handleDeleteTasks = () => {
-		const taskIds = getTasksIds().map(id => ` #${id}`)
+		const taskIds = getTasksIds()
+
+		const taskIdsMessage =
+			taskIds.length > 28
+				? taskIds.slice(0, 28).map(id => ` #${id}`) + `...`
+				: taskIds.map(id => ` #${id}`)
 
 		appEvents.emit('openConfirmModal', {
-			title: `Ви впевнені, що хочете видалити задачі: ${taskIds}?`,
+			title: `Ви впевнені, що хочете видалити задачі: ${taskIdsMessage}?`,
 			buttonToHighlight: 'notAllow',
 			allowBtnAction: () => deleteTasks(),
 			notAllowBtnAction: () => {},

src/modules/tasks/smart-components/finish-task-modal.smart-component.tsx

@@ -31,7 +31,7 @@ export const FinishTaskModal = () => {
 	const { styles, theme } = useTheme(createStyles)
 	const sheetRef = useRef<RBSheet>(null)
 	const [modalHeight, setModalHeight] = useState<number>($size(270))
-	const [tasksHeight, setTasksHeight] = useState<number>()
+	const [tasksCount, setTasksCount] = useState<number>(0)
 	const [tasksIds, setTasksIds] = useState<number[]>([])
 	const [startTaskDate, setTaskDate] = useState(new Date())
 	const [dateState, setDateState] = useState<IDateState>(dateInitialState)
@@ -45,9 +45,8 @@ export const FinishTaskModal = () => {
 				settingsRef.current = {
 					callback: data.onPressOk,
 				}
-				setTasksIds(data.taskIds)
-
-				setTasksHeight($size(Math.floor(data.taskIds.length / 8) * 16))
+				setTasksIds(data.taskIds as number[])
+				setTasksCount(data?.taskIds.length)
 
 				const findDate = data.startDates.reduce((acc, date) => {
 					return acc && new Date(acc) > new Date(date) ? acc : date
@@ -63,25 +62,35 @@ export const FinishTaskModal = () => {
 
 	useEffect(() => {
 		if (dateState.isShowCalendar)
-			return updateModalHeight(
-				$size(580 + tasksHeight, 520 + tasksHeight),
-			)
+			return updateModalHeight($size(580, 560), tasksCount)
 		if (dateState.isShowTimePicker)
-			return updateModalHeight(
-				$size(460 + tasksHeight, 400 + tasksHeight),
-			)
+			return updateModalHeight($size(460, 400), tasksCount)
 		if (!dateState.isShowCalendar && !dateState.isShowTimePicker)
-			return updateModalHeight($size(270 + tasksHeight))
-	}, [dateState, tasksHeight])
+			return updateModalHeight($size(270, 250), tasksCount)
+	}, [dateState, tasksCount])
+
+	const updateModalHeight = (
+		height: number = $size(270),
+		tasksCount: number,
+	) => {
+		const extraHeight = Math.floor(tasksCount / 8) * 16 + 20
+
+		if (tasksCount < 40) setModalHeight(height + extraHeight)
+		else setModalHeight(height + 100)
 
-	const updateModalHeight = (height: number = $size(270 + tasksHeight)) => {
-		setModalHeight(height)
 		sheetRef.current.forceUpdate()
 	}
 
 	const renderTasksIds = (tasksIds: number[]) => {
 		const serializedIds = ` #${tasksIds.join(', #')}`
-		return <Text style={styles.tasksIds}>Задача{serializedIds}</Text>
+		return (
+			<Text
+				numberOfLines={5}
+				ellipsizeMode="tail"
+				style={styles.tasksIds}>
+				Задача{serializedIds}
+			</Text>
+		)
 	}
 
 	const onPressDone = () => {