fix: QA

텍스트 색상, 텍스트 입력시 컴포넌트를 올리는 로직 구현 #70
Amattang · Mar 31, 2022 · a9c2691 · a9c2691
1 parent 0c68e56
commit a9c2691
Show file tree

Hide file tree

Showing 12 changed files with 217 additions and 178 deletions.
diff --git a/components/CheckListComponent/ButtonsOfTypeB.tsx b/components/CheckListComponent/ButtonsOfTypeB.tsx
@@ -98,6 +98,7 @@ function ButtonsOfTypeB({ isEdit, checkList, setCheckLists, checkLists }: IProps
             onChangeText={onChangeText}
             onEndEditing={() => onEndEditing(answer)}
             placeholder={answer.type ? answer.type : '직접 입력'}
+            placeholderTextColor={'#D6D4D4'}
             style={[styles.typeDBtnWrapper]}
           />
           <DefaultText style={[styles.checkListGrayText, { marginRight: 10 }]}>

diff --git a/components/CheckListComponent/ButtonsOfTypeD.tsx b/components/CheckListComponent/ButtonsOfTypeD.tsx
@@ -157,6 +157,7 @@ function ButtonsOfTypeD({ isEdit, checkList, setCheckLists, checkLists }: IProps
         onChangeText={onChangeTextHandler}
         onEndEditing={onEndEditing}
         placeholder={'+ 직접 입력'}
+        placeholderTextColor={'#D6D4D4'}
         value={newCheckListElement}
         style={[styles.typeDBtnWrapper, styles.typeDInputBtnWrapper]}
       />

diff --git a/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx b/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx
@@ -81,6 +81,7 @@ function MyItemOfBottomSheets({
         <BottomSheetTextInput
           style={styles.myItemCategoryName}
           value={clickedMyItem?.categoryName}
+          placeholderTextColor={'#D6D4D4'}
           placeholder={'새 그룹'}
           editable={isEdit}
           onChangeText={(newCategoryName) => onCategoryNameHandler(newCategoryName)}
@@ -98,6 +99,7 @@ function MyItemOfBottomSheets({
           <BottomSheetTextInput
             style={styles.addMyItemEachElementOfBottomSheets}
             placeholder={'+ 항목 추가'}
+            placeholderTextColor={'#999999'}
             value={newElement}
             editable={isEdit}
             onChangeText={(elementText) => onCreateQuestionElementTextHandler(elementText)}

diff --git a/navigation/Main/StackNavigation/StackNavigationOfCheckList.tsx b/navigation/Main/StackNavigation/StackNavigationOfCheckList.tsx
@@ -46,22 +46,27 @@ function CheckListStackNav({ setIsLogin }: IProps) {
   };
 
   const onSubmitHandler = async () => {
-    console.log(checkListContext?.choseCheckListByServer);
-    try {
-      await axios.put(
+    await axios
+      .put(
         `/api/check-list/${checkListContext?.checkListId}/common/question/status`,
         checkListContext?.deletedCheckListByServer
-      );
-      await axios.put(
+      )
+      .then(() => checkListContext?.setDeletedCheckListByServer({ question: [] }));
+
+    await axios
+      .put(
         `/api/check-list/${checkListContext?.checkListId}/common/question`,
         checkListContext?.choseCheckListByServer
+      )
+      .then(() =>
+        checkListContext?.setChoseCheckListByServer({
+          typeA: [],
+          typeB: [],
+          typeD: [],
+          typeM: {},
+        })
       );
-    } catch (error) {
-      console.error(error);
-    }
 
-    checkListContext?.setDeletedCheckListByServer({ question: [] });
-    checkListContext?.setChoseCheckListByServer({ typeA: [], typeB: [], typeD: [], typeM: {} });
     setIsEdit(false);
   };
 

diff --git a/screens/BasicCheckList/Inside/Bathroom.tsx b/screens/BasicCheckList/Inside/Bathroom.tsx
@@ -25,6 +25,7 @@ import ButtonOfBringBackDeletedCheckList from '../../../components/CheckListComp
 import BottomSheetsOfDeletedCheckList from '../../../components/CheckListComponent/BottomSheetsOfDeletedCheckList';
 import { GetCheckListServerData } from '../../../api/GetCheckListServerData';
 import { checkListCtx } from '../../../Context/CheckListByServer';
+import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 
 interface IProps {
   isEdit: boolean;
@@ -76,29 +77,32 @@ function Bathroom({ isEdit, setIsBottomSheet }: IProps) {
     <>
       {onServerData ? (
         <BottomSheetModalProvider>
-          <ScrollView>
-            {checkLists
-              .filter((item) => item.visibility)
-              .map((mainQuestionItem: checkListTypes) => (
-                <CheckListComponent
-                  key={mainQuestionItem.questionId}
-                  deletedCheckLists={deletedCheckLists}
-                  setDeletedCheckLists={setDeletedCheckLists}
-                  onBoarding={false}
-                  checkLists={checkLists}
+          <KeyboardAwareScrollView extraHeight={200}>
+            <ScrollView>
+              {checkLists
+                .filter((item) => item.visibility)
+                .map((mainQuestionItem: checkListTypes) => (
+                  <CheckListComponent
+                    key={mainQuestionItem.questionId}
+                    deletedCheckLists={deletedCheckLists}
+                    setDeletedCheckLists={setDeletedCheckLists}
+                    onBoarding={false}
+                    checkLists={checkLists}
+                    handlePresentModalPress={handlePresentModalPress}
+                    isEdit={isEdit}
+                    checkList={mainQuestionItem}
+                    setCheckLists={setCheckLists}
+                  />
+                ))}
+
+              {deletedCheckLists.length !== 0 && (
+                <ButtonOfBringBackDeletedCheckList
                   handlePresentModalPress={handlePresentModalPress}
-                  isEdit={isEdit}
-                  checkList={mainQuestionItem}
-                  setCheckLists={setCheckLists}
                 />
-              ))}
-
-            {deletedCheckLists.length !== 0 && (
-              <ButtonOfBringBackDeletedCheckList
-                handlePresentModalPress={handlePresentModalPress}
-              />
-            )}
-          </ScrollView>
+              )}
+            </ScrollView>
+          </KeyboardAwareScrollView>
+
           <BottomSheetsOfDeletedCheckList
             deletedCheckLists={deletedCheckLists}
             setDeletedCheckLists={setDeletedCheckLists}

diff --git a/screens/BasicCheckList/Inside/Ceiling.tsx b/screens/BasicCheckList/Inside/Ceiling.tsx
@@ -25,6 +25,7 @@ import ButtonOfBringBackDeletedCheckList from '../../../components/CheckListComp
 import BottomSheetsOfDeletedCheckList from '../../../components/CheckListComponent/BottomSheetsOfDeletedCheckList';
 import { GetCheckListServerData } from '../../../api/GetCheckListServerData';
 import { checkListCtx } from '../../../Context/CheckListByServer';
+import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 
 interface IProps {
   isEdit: boolean;
@@ -76,29 +77,32 @@ function Ceiling({ isEdit, setIsBottomSheet }: IProps) {
     <>
       {onServerData ? (
         <BottomSheetModalProvider>
-          <ScrollView>
-            {checkLists
-              .filter((item) => item.visibility)
-              .map((mainQuestionItem: checkListTypes) => (
-                <CheckListComponent
-                  key={mainQuestionItem.questionId}
-                  deletedCheckLists={deletedCheckLists}
-                  setDeletedCheckLists={setDeletedCheckLists}
-                  onBoarding={false}
-                  checkLists={checkLists}
+          <KeyboardAwareScrollView extraHeight={200}>
+            <ScrollView>
+              {checkLists
+                .filter((item) => item.visibility)
+                .map((mainQuestionItem: checkListTypes) => (
+                  <CheckListComponent
+                    key={mainQuestionItem.questionId}
+                    deletedCheckLists={deletedCheckLists}
+                    setDeletedCheckLists={setDeletedCheckLists}
+                    onBoarding={false}
+                    checkLists={checkLists}
+                    handlePresentModalPress={handlePresentModalPress}
+                    isEdit={isEdit}
+                    checkList={mainQuestionItem}
+                    setCheckLists={setCheckLists}
+                  />
+                ))}
+
+              {deletedCheckLists.length !== 0 && (
+                <ButtonOfBringBackDeletedCheckList
                   handlePresentModalPress={handlePresentModalPress}
-                  isEdit={isEdit}
-                  checkList={mainQuestionItem}
-                  setCheckLists={setCheckLists}
                 />
-              ))}
-
-            {deletedCheckLists.length !== 0 && (
-              <ButtonOfBringBackDeletedCheckList
-                handlePresentModalPress={handlePresentModalPress}
-              />
-            )}
-          </ScrollView>
+              )}
+            </ScrollView>
+          </KeyboardAwareScrollView>
+
           <BottomSheetsOfDeletedCheckList
             deletedCheckLists={deletedCheckLists}
             setDeletedCheckLists={setDeletedCheckLists}

diff --git a/screens/BasicCheckList/Inside/Entrance.tsx b/screens/BasicCheckList/Inside/Entrance.tsx
@@ -25,6 +25,7 @@ import ButtonOfBringBackDeletedCheckList from '../../../components/CheckListComp
 import BottomSheetsOfDeletedCheckList from '../../../components/CheckListComponent/BottomSheetsOfDeletedCheckList';
 import { GetCheckListServerData } from '../../../api/GetCheckListServerData';
 import { checkListCtx } from '../../../Context/CheckListByServer';
+import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 
 interface IProps {
   isEdit: boolean;
@@ -76,29 +77,32 @@ function Entrance({ isEdit, setIsBottomSheet }: IProps) {
     <>
       {onServerData ? (
         <BottomSheetModalProvider>
-          <ScrollView>
-            {checkLists
-              .filter((item) => item.visibility)
-              .map((mainQuestionItem: checkListTypes) => (
-                <CheckListComponent
-                  key={mainQuestionItem.questionId}
-                  deletedCheckLists={deletedCheckLists}
-                  setDeletedCheckLists={setDeletedCheckLists}
-                  onBoarding={false}
-                  checkLists={checkLists}
+          <KeyboardAwareScrollView extraHeight={200}>
+            <ScrollView>
+              {checkLists
+                .filter((item) => item.visibility)
+                .map((mainQuestionItem: checkListTypes) => (
+                  <CheckListComponent
+                    key={mainQuestionItem.questionId}
+                    deletedCheckLists={deletedCheckLists}
+                    setDeletedCheckLists={setDeletedCheckLists}
+                    onBoarding={false}
+                    checkLists={checkLists}
+                    handlePresentModalPress={handlePresentModalPress}
+                    isEdit={isEdit}
+                    checkList={mainQuestionItem}
+                    setCheckLists={setCheckLists}
+                  />
+                ))}
+
+              {deletedCheckLists.length !== 0 && (
+                <ButtonOfBringBackDeletedCheckList
                   handlePresentModalPress={handlePresentModalPress}
-                  isEdit={isEdit}
-                  checkList={mainQuestionItem}
-                  setCheckLists={setCheckLists}
                 />
-              ))}
-
-            {deletedCheckLists.length !== 0 && (
-              <ButtonOfBringBackDeletedCheckList
-                handlePresentModalPress={handlePresentModalPress}
-              />
-            )}
-          </ScrollView>
+              )}
+            </ScrollView>
+          </KeyboardAwareScrollView>
+
           <BottomSheetsOfDeletedCheckList
             deletedCheckLists={deletedCheckLists}
             setDeletedCheckLists={setDeletedCheckLists}

diff --git a/screens/BasicCheckList/Inside/Kitchen.tsx b/screens/BasicCheckList/Inside/Kitchen.tsx
@@ -25,6 +25,7 @@ import ButtonOfBringBackDeletedCheckList from '../../../components/CheckListComp
 import BottomSheetsOfDeletedCheckList from '../../../components/CheckListComponent/BottomSheetsOfDeletedCheckList';
 import { GetCheckListServerData } from '../../../api/GetCheckListServerData';
 import { checkListCtx } from '../../../Context/CheckListByServer';
+import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 
 interface IProps {
   isEdit: boolean;
@@ -76,29 +77,32 @@ function Kitchen({ isEdit, setIsBottomSheet }: IProps) {
     <>
       {onServerData ? (
         <BottomSheetModalProvider>
-          <ScrollView>
-            {checkLists
-              .filter((item) => item.visibility)
-              .map((mainQuestionItem: checkListTypes) => (
-                <CheckListComponent
-                  key={mainQuestionItem.questionId}
-                  deletedCheckLists={deletedCheckLists}
-                  setDeletedCheckLists={setDeletedCheckLists}
-                  onBoarding={false}
-                  checkLists={checkLists}
+          <KeyboardAwareScrollView extraHeight={200}>
+            <ScrollView>
+              {checkLists
+                .filter((item) => item.visibility)
+                .map((mainQuestionItem: checkListTypes) => (
+                  <CheckListComponent
+                    key={mainQuestionItem.questionId}
+                    deletedCheckLists={deletedCheckLists}
+                    setDeletedCheckLists={setDeletedCheckLists}
+                    onBoarding={false}
+                    checkLists={checkLists}
+                    handlePresentModalPress={handlePresentModalPress}
+                    isEdit={isEdit}
+                    checkList={mainQuestionItem}
+                    setCheckLists={setCheckLists}
+                  />
+                ))}
+
+              {deletedCheckLists.length !== 0 && (
+                <ButtonOfBringBackDeletedCheckList
                   handlePresentModalPress={handlePresentModalPress}
-                  isEdit={isEdit}
-                  checkList={mainQuestionItem}
-                  setCheckLists={setCheckLists}
                 />
-              ))}
-
-            {deletedCheckLists.length !== 0 && (
-              <ButtonOfBringBackDeletedCheckList
-                handlePresentModalPress={handlePresentModalPress}
-              />
-            )}
-          </ScrollView>
+              )}
+            </ScrollView>
+          </KeyboardAwareScrollView>
+
           <BottomSheetsOfDeletedCheckList
             deletedCheckLists={deletedCheckLists}
             setDeletedCheckLists={setDeletedCheckLists}

diff --git a/screens/BasicCheckList/Inside/Option.tsx b/screens/BasicCheckList/Inside/Option.tsx
@@ -25,6 +25,7 @@ import ButtonOfBringBackDeletedCheckList from '../../../components/CheckListComp
 import BottomSheetsOfDeletedCheckList from '../../../components/CheckListComponent/BottomSheetsOfDeletedCheckList';
 import { GetCheckListServerData } from '../../../api/GetCheckListServerData';
 import { checkListCtx } from '../../../Context/CheckListByServer';
+import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
 
 interface IProps {
   isEdit: boolean;
@@ -76,29 +77,32 @@ function Option({ isEdit, setIsBottomSheet }: IProps) {
     <>
       {onServerData ? (
         <BottomSheetModalProvider>
-          <ScrollView>
-            {checkLists
-              .filter((item) => item.visibility)
-              .map((mainQuestionItem: checkListTypes) => (
-                <CheckListComponent
-                  key={mainQuestionItem.questionId}
-                  deletedCheckLists={deletedCheckLists}
-                  setDeletedCheckLists={setDeletedCheckLists}
-                  onBoarding={false}
-                  checkLists={checkLists}
+          <KeyboardAwareScrollView extraHeight={200}>
+            <ScrollView>
+              {checkLists
+                .filter((item) => item.visibility)
+                .map((mainQuestionItem: checkListTypes) => (
+                  <CheckListComponent
+                    key={mainQuestionItem.questionId}
+                    deletedCheckLists={deletedCheckLists}
+                    setDeletedCheckLists={setDeletedCheckLists}
+                    onBoarding={false}
+                    checkLists={checkLists}
+                    handlePresentModalPress={handlePresentModalPress}
+                    isEdit={isEdit}
+                    checkList={mainQuestionItem}
+                    setCheckLists={setCheckLists}
+                  />
+                ))}
+
+              {deletedCheckLists.length !== 0 && (
+                <ButtonOfBringBackDeletedCheckList
                   handlePresentModalPress={handlePresentModalPress}
-                  isEdit={isEdit}
-                  checkList={mainQuestionItem}
-                  setCheckLists={setCheckLists}
                 />
-              ))}
-
-            {deletedCheckLists.length !== 0 && (
-              <ButtonOfBringBackDeletedCheckList
-                handlePresentModalPress={handlePresentModalPress}
-              />
-            )}
-          </ScrollView>
+              )}
+            </ScrollView>
+          </KeyboardAwareScrollView>
+
           <BottomSheetsOfDeletedCheckList
             deletedCheckLists={deletedCheckLists}
             setDeletedCheckLists={setDeletedCheckLists}