From d414e958a42ec91ae919175099a0b2be2908d5e4 Mon Sep 17 00:00:00 2001 From: 11t518s <11t518s20161759@gmail.com> Date: Wed, 6 Apr 2022 01:36:29 +0900 Subject: [PATCH] fix: myItem logic --- android/app/build.gradle | 2 +- .../CheckListComponent/CheckListComponent.tsx | 12 ++-- .../myItem/MyItemElementOfBottomSheets.tsx | 15 +++-- .../myItem/MyItemOfBottomSheets.tsx | 65 +++++++++++-------- navigation/Main/BottomNavigation/styles.tsx | 2 +- .../StackNavigationOfCheckList.tsx | 2 +- .../BasicCheckList/MyItemOfBasicCheckList.tsx | 3 +- 7 files changed, 56 insertions(+), 45 deletions(-) diff --git a/android/app/build.gradle b/android/app/build.gradle index a4863f8..42d2afc 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -149,7 +149,7 @@ android { applicationId "com.amattang" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion - versionCode 4 + versionCode 6 versionName "1.0" manifestPlaceholders = [GOOGLE_MAP_API_KEY:googleMapApiKey, KAKAO_NATIVE_APP_KEY:kakaoLoginApiKey] // manifestPlaceholders = [KAKAO_NATIVE_APP_KEY:kakaoLoginApiKey] diff --git a/components/CheckListComponent/CheckListComponent.tsx b/components/CheckListComponent/CheckListComponent.tsx index 89d182a..c12d7f8 100644 --- a/components/CheckListComponent/CheckListComponent.tsx +++ b/components/CheckListComponent/CheckListComponent.tsx @@ -94,8 +94,8 @@ function CheckListComponent({ - {checkList.question.split(' ').map((word) => ( - + {checkList.question.split(' ').map((word, index) => ( + {word}{' '} ))} @@ -106,8 +106,8 @@ function CheckListComponent({ 📘 - {checkList.rule.split(' ').map((word) => ( - + {checkList.rule.split(' ').map((word, index) => ( + {word}  ))} @@ -119,8 +119,8 @@ function CheckListComponent({ 👀 - {checkList.description.split(' ').map((word) => ( - + {checkList.description.split(' ').map((word, index) => ( + {word}  ))} diff --git a/components/CheckListComponent/myItem/MyItemElementOfBottomSheets.tsx b/components/CheckListComponent/myItem/MyItemElementOfBottomSheets.tsx index 3c610e9..de203c1 100644 --- a/components/CheckListComponent/myItem/MyItemElementOfBottomSheets.tsx +++ b/components/CheckListComponent/myItem/MyItemElementOfBottomSheets.tsx @@ -1,4 +1,4 @@ -import React, { Dispatch, SetStateAction } from 'react'; +import React, { Dispatch, SetStateAction, useState } from 'react'; import { myItemElementType, myItemType } from '../../../types/checkListTypes'; import { Image, View } from 'react-native'; import styles from '../styles'; @@ -18,7 +18,8 @@ function MyItemElementOfBottomSheets({ isEdit, clickedMyItemElements, }: IProps) { - const onChangeQuestionElementHandler = (onChangedQuestionElement: string) => { + const [onChangedQuestionElement, setOnChangedQuestionElement] = useState(''); + const onChangeQuestionElementHandler = () => { onChangedQuestionElement === '' ? setClickedMyItem({ ...clickedMyItem, @@ -37,7 +38,7 @@ function MyItemElementOfBottomSheets({ } as myItemType); }; return ( - + {clickedMyItemElements.checked ? ( ) : ( @@ -46,11 +47,11 @@ function MyItemElementOfBottomSheets({ {clickedMyItemElements && ( - onChangeQuestionElementHandler(onChangedQuestionElement) - } + onChangeText={(onChangText: string) => setOnChangedQuestionElement(onChangText)} + onEndEditing={onChangeQuestionElementHandler} /> )} diff --git a/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx b/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx index 3037ca3..2412a8b 100644 --- a/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx +++ b/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx @@ -1,10 +1,10 @@ -import React, { Dispatch, RefObject, SetStateAction, useState } from 'react'; +import React, { createRef, Dispatch, RefObject, SetStateAction, useState } from 'react'; import { BottomSheetBackgroundProps, BottomSheetModal, BottomSheetTextInput, } from '@gorhom/bottom-sheet'; -import { ScrollView, TextInput, View } from 'react-native'; +import { KeyboardAvoidingViewComponent, ScrollView, Text, TextInput, View } from 'react-native'; import { myItemType } from '../../../types/checkListTypes'; import { BottomSheetModalMethods } from '@gorhom/bottom-sheet/lib/typescript/types'; @@ -12,6 +12,7 @@ import styles from '../styles'; import CreateMyItemButtonOfBottomSheets from './CreateMyItemButtonOfBottomSheets'; import DeleteMyItemButtonOfBottomSheets from './DeleteMyItemButtonOfBottomSheets'; import MyItemElementOfBottomSheets from './MyItemElementOfBottomSheets'; +import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view'; interface IProps { onDismissHandler: () => void; @@ -40,30 +41,27 @@ function MyItemOfBottomSheets({ handleSheetChanges, clickedMyItem, }: IProps) { - const [newElement, setNewElement] = useState(''); - - const onCategoryNameHandler = (newCategoryName: string) => { - setClickedMyItem({ + const [newCategory, setNewCategory] = useState(''); + const onCategoryNameHandler = async () => { + await setClickedMyItem({ ...clickedMyItem, - categoryName: newCategoryName, + categoryName: newCategory, } as myItemType); + setNewCategory(''); }; + const [newElement, setNewElement] = useState(''); const onCreateQuestionElementHandler = async () => { - newElement && clickedMyItem?.questions - ? setClickedMyItem({ + clickedMyItem?.questions + ? await setClickedMyItem({ ...clickedMyItem, questions: [...clickedMyItem?.questions, { content: newElement, checked: false }], } as myItemType) - : setClickedMyItem({ + : await setClickedMyItem({ ...clickedMyItem, questions: [{ content: newElement, checked: false }], } as myItemType); - setNewElement(''); - }; - - const onCreateQuestionElementTextHandler = (elementText: string) => { - setNewElement(elementText); + return null; }; return ( @@ -78,13 +76,13 @@ function MyItemOfBottomSheets({ onChange={handleSheetChanges} > - onCategoryNameHandler(newCategoryName)} + onChangeText={(newCategoryName) => setNewCategory(newCategoryName)} + onEndEditing={onCategoryNameHandler} /> {clickedMyItem?.questions?.map((clickedMyItemElements) => ( @@ -96,15 +94,26 @@ function MyItemOfBottomSheets({ clickedMyItemElements={clickedMyItemElements} /> ))} - onCreateQuestionElementTextHandler(elementText)} - onEndEditing={onCreateQuestionElementHandler} - /> + {newElement ? ( + setNewElement(elementText)} + onEndEditing={onCreateQuestionElementHandler} + /> + ) : ( + setNewElement(elementText)} + onEndEditing={onCreateQuestionElementHandler} + /> + )} { setInterval(() => { - onSubmitHandler(); + checkListContext?.onChoseCheckListHandler(); }, 100000); }, []); diff --git a/screens/BasicCheckList/MyItemOfBasicCheckList.tsx b/screens/BasicCheckList/MyItemOfBasicCheckList.tsx index e771df8..e565a96 100644 --- a/screens/BasicCheckList/MyItemOfBasicCheckList.tsx +++ b/screens/BasicCheckList/MyItemOfBasicCheckList.tsx @@ -8,7 +8,7 @@ import React, { useRef, useState, } from 'react'; -import { ActivityIndicator, ScrollView, View } from 'react-native'; +import { ActivityIndicator, ScrollView, TextInput, View } from 'react-native'; import BlankedMyItem from '../../components/CheckListComponent/myItem/BlankedMyItem'; import ButtonOfAddMyItem from '../../components/CheckListComponent/myItem/ButtonOfAddMyItem'; @@ -133,6 +133,7 @@ function MyItemOfBasicCheckList({ isEdit, setIsBottomSheet }: IProps) { /> ))} + {myItems.length === 0 && }