Merge pull request #82 from Amattang/fix/#70-QA

Fix/#70 qa
Amattang · Apr 6, 2022 · a9fc6a3 · a9fc6a3
2 parents f9bab72 + d414e95
commit a9fc6a3
Show file tree

Hide file tree

Showing 29 changed files with 594 additions and 704 deletions.
diff --git a/Context/CheckListByServer.tsx b/Context/CheckListByServer.tsx
@@ -1,5 +1,6 @@
 import React, { createContext, Dispatch, SetStateAction, useState } from 'react';
 import { choseCheckListByServerType, deletedCheckListByServerType } from '../types/checkListTypes';
+import axios from 'axios';
 
 interface contextType {
   deletedCheckListByServer: deletedCheckListByServerType;
@@ -8,6 +9,8 @@ interface contextType {
   setChoseCheckListByServer: Dispatch<SetStateAction<choseCheckListByServerType>>;
   checkListId: number | false;
   setCheckListId: Dispatch<SetStateAction<number | false>>;
+  onChoseCheckListHandler: () => void;
+  onDeleteCheckListHandler: (data: deletedCheckListByServerType) => void;
 }
 
 export const checkListCtx = createContext<contextType | null>(null);
@@ -22,6 +25,21 @@ const CheckListStore: React.FC = (props) => {
     typeM: {},
   });
   const [checkListId, setCheckListId] = useState<number | false>(false);
+  const onDeleteCheckListHandler = (data: deletedCheckListByServerType) => {
+    axios
+      .put(`/api/check-list/${checkListId}/common/question/status`, data)
+      .then(() => setDeletedCheckListByServer({ question: [] }));
+  };
+  const onChoseCheckListHandler = () => {
+    axios.put(`/api/check-list/${checkListId}/common/question`, choseCheckListByServer).then(() => {
+      setChoseCheckListByServer({
+        typeA: [],
+        typeB: [],
+        typeD: [],
+        typeM: {},
+      });
+    });
+  };
 
   return (
     <checkListCtx.Provider
@@ -32,6 +50,8 @@ const CheckListStore: React.FC = (props) => {
         setChoseCheckListByServer,
         checkListId,
         setCheckListId,
+        onChoseCheckListHandler,
+        onDeleteCheckListHandler,
       }}
     >
       {props.children}

diff --git 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/assets/images/checkList/checkLIstDefaultImg.png b/assets/images/checkList/checkLIstDefaultImg.png
diff --git a/components/CheckListComponent/BottomSheetsOfDeletedCheckList.tsx b/components/CheckListComponent/BottomSheetsOfDeletedCheckList.tsx
@@ -47,7 +47,7 @@ function BottomSheetsOfDeletedCheckList({
         deletedCheckLists.filter((CheckLists: checkListTypes) => !CheckLists.visibility)
       );
       setCheckLists([...checkLists.filter((item) => item.visibility), ...deletedCheckLists]);
-      checkListContext?.setDeletedCheckListByServer({
+      checkListContext?.onDeleteCheckListHandler({
         question: [
           ...checkListContext?.deletedCheckListByServer.question,
           ...deletedCheckLists.map((item) => ({ questionId: item.questionId, visibility: true })),

diff --git a/components/CheckListComponent/ButtonOfGoToTrash.tsx b/components/CheckListComponent/ButtonOfGoToTrash.tsx
@@ -36,18 +36,18 @@ function ButtonOfGoToTrash({
       isEdit &&
       deletedCheckLists &&
       setTimeout(async () => {
-        await checkListContext?.setDeletedCheckListByServer({
+        await checkListContext?.onDeleteCheckListHandler({
           question: [
             ...checkListContext?.deletedCheckListByServer.question,
             { questionId: checkList.questionId, visibility: false },
           ],
         });
-        await setCheckLists(
+        setCheckLists(
           checkLists.map((item) =>
             item.questionId === checkList.questionId ? { ...item, visibility: false } : { ...item }
           )
         );
-        await setDeletedCheckLists([...deletedCheckLists, { ...checkList, visibility: false }]);
+        setDeletedCheckLists([...deletedCheckLists, { ...checkList, visibility: false }]);
       }, 500);
   };
 

diff --git a/components/CheckListComponent/ButtonsOfTypeB.tsx b/components/CheckListComponent/ButtonsOfTypeB.tsx
@@ -5,7 +5,6 @@ import {
   checkListTypes,
   choseCheckListItemByServerType,
 } from '../../types/checkListTypes';
-import produce from 'immer';
 
 import styles from './styles';
 import { DefaultText } from '../../CustomText';
@@ -96,7 +95,7 @@ function ButtonsOfTypeB({ isEdit, checkList, setCheckLists, checkLists }: IProps
             autoCorrect={false}
             onChangeText={onChangeText}
             onEndEditing={() => onEndEditing(answer)}
-            placeholder={answer.type ? answer.type : '직접 입력'}
+            placeholder={answer.type ? answer.type : answer.setting}
             placeholderTextColor={'#D6D4D4'}
             style={[styles.typeDBtnWrapper]}
           />

diff --git a/components/CheckListComponent/CheckListComponent.tsx b/components/CheckListComponent/CheckListComponent.tsx
@@ -94,8 +94,8 @@ function CheckListComponent({
         <Animated.View style={[rStyle]}>
           <Pressable style={styles.whiteCard} key={checkList.questionId}>
             <View style={styles.textWrapWrapper}>
-              {checkList.question.split(' ').map((word) => (
-                <DefaultText style={[styles.checkListMainTitle, styles.textWrap]}>
+              {checkList.question.split(' ').map((word, index) => (
+                <DefaultText key={index} style={[styles.checkListMainTitle, styles.textWrap]}>
                   {word}{' '}
                 </DefaultText>
               ))}
@@ -106,8 +106,8 @@ function CheckListComponent({
                 <View style={styles.checkListSubTitle}>
                   <DefaultText style={styles.emoji}>📘 </DefaultText>
                   <View style={styles.textWrapWrapper}>
-                    {checkList.rule.split(' ').map((word) => (
-                      <DefaultText style={[styles.checkListGrayText, styles.textWrap]}>
+                    {checkList.rule.split(' ').map((word, index) => (
+                      <DefaultText key={index} style={[styles.checkListGrayText, styles.textWrap]}>
                         {word}&nbsp;
                       </DefaultText>
                     ))}
@@ -119,8 +119,8 @@ function CheckListComponent({
                   <DefaultText style={styles.emoji}>👀 </DefaultText>
 
                   <View style={styles.textWrapWrapper}>
-                    {checkList.description.split(' ').map((word) => (
-                      <DefaultText style={[styles.checkListGrayText, styles.textWrap]}>
+                    {checkList.description.split(' ').map((word, index) => (
+                      <DefaultText key={index} style={[styles.checkListGrayText, styles.textWrap]}>
                         {word}&nbsp;
                       </DefaultText>
                     ))}

diff --git a/components/CheckListComponent/CheckListSummaryComponenet.tsx b/components/CheckListComponent/CheckListSummaryComponenet.tsx
@@ -20,7 +20,7 @@ function CheckListSummaryComponenet({ checkListSummary }: IProps) {
   return (
     <>
       <View style={styles.summaryWrapper}>
-        <Pressable onPress={pinCheckListHandler}>
+        <Pressable onPress={pinCheckListHandler} style={styles.summaryImageWrapper}>
           <Image
             style={styles.summaryPinImg}
             source={
@@ -35,7 +35,7 @@ function CheckListSummaryComponenet({ checkListSummary }: IProps) {
             source={
               checkListSummary.imgUri
                 ? { uri: checkListSummary.imgUri }
-                : require('../../assets/images/home/homeMainImg.png')
+                : require('../../assets/images/checkList/checkLIstDefaultImg.png')
             }
           />
         </Pressable>

diff --git 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 (
-    <View style={styles.myItemElementsOfBottomSheets}>
+    <View key={clickedMyItem.categoryId} style={styles.myItemElementsOfBottomSheets}>
       {clickedMyItemElements.checked ? (
         <Image source={require('../../../assets/images/checkList/checkedCheckBox.png')} />
       ) : (
@@ -46,11 +47,11 @@ function MyItemElementOfBottomSheets({
       {clickedMyItemElements && (
         <BottomSheetTextInput
           editable={isEdit}
+          placeholder={clickedMyItemElements.content || '+ 항목 추가'}
+          placeholderTextColor={'#999999'}
           style={styles.myItemEachElementOfBottomSheets}
-          value={clickedMyItemElements.content}
-          onChangeText={(onChangedQuestionElement) =>
-            onChangeQuestionElementHandler(onChangedQuestionElement)
-          }
+          onChangeText={(onChangText: string) => setOnChangedQuestionElement(onChangText)}
+          onEndEditing={onChangeQuestionElementHandler}
         />
       )}
     </View>

diff --git a/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx b/components/CheckListComponent/myItem/MyItemOfBottomSheets.tsx
@@ -1,17 +1,18 @@
-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, 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';
 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 (
@@ -80,11 +78,11 @@ function MyItemOfBottomSheets({
       <View style={[styles.myItemBottomSheetWrapper]}>
         <BottomSheetTextInput
           style={styles.myItemCategoryName}
-          value={clickedMyItem?.categoryName}
+          placeholder={clickedMyItem?.categoryName || '새 그룹'}
           placeholderTextColor={'#D6D4D4'}
-          placeholder={'새 그룹'}
           editable={isEdit}
-          onChangeText={(newCategoryName) => onCategoryNameHandler(newCategoryName)}
+          onChangeText={(newCategoryName) => setNewCategory(newCategoryName)}
+          onEndEditing={onCategoryNameHandler}
         />
         <ScrollView>
           {clickedMyItem?.questions?.map((clickedMyItemElements) => (
@@ -96,15 +94,26 @@ function MyItemOfBottomSheets({
               clickedMyItemElements={clickedMyItemElements}
             />
           ))}
-          <BottomSheetTextInput
-            style={styles.addMyItemEachElementOfBottomSheets}
-            placeholder={'+ 항목 추가'}
-            placeholderTextColor={'#999999'}
-            value={newElement}
-            editable={isEdit}
-            onChangeText={(elementText) => onCreateQuestionElementTextHandler(elementText)}
-            onEndEditing={onCreateQuestionElementHandler}
-          />
+          {newElement ? (
+            <BottomSheetTextInput
+              style={styles.addMyItemEachElementOfBottomSheets}
+              placeholder={'+ 항목 추가'}
+              placeholderTextColor={'#999999'}
+              editable={isEdit}
+              onChangeText={(elementText) => setNewElement(elementText)}
+              onEndEditing={onCreateQuestionElementHandler}
+            />
+          ) : (
+            <BottomSheetTextInput
+              style={styles.addMyItemEachElementOfBottomSheets}
+              placeholder={'+ 항목 추가'}
+              placeholderTextColor={'#999999'}
+              editable={isEdit}
+              value={''}
+              onChangeText={(elementText) => setNewElement(elementText)}
+              onEndEditing={onCreateQuestionElementHandler}
+            />
+          )}
         </ScrollView>
         <CreateMyItemButtonOfBottomSheets
           clickedMyItem={clickedMyItem}

diff --git a/components/CheckListComponent/styles.tsx b/components/CheckListComponent/styles.tsx
@@ -4,13 +4,23 @@ import { mainBlue, mainLightBlue, mainOrange } from '../../color';
 const windowWidth = Dimensions.get('window').width;
 
 const styles = StyleSheet.create({
+  summaryImageWrapper: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    backgroundColor: '#CFCFCF',
+    width: windowWidth - 34,
+    height: 260,
+    borderRadius: 10,
+    marginTop: 15,
+    marginBottom: 15,
+  },
   textWrap: {
     flexDirection: 'row',
     flexWrap: 'wrap',
   },
   textWrapWrapper: { flexDirection: 'row', flexWrap: 'wrap' },
   summaryPinImg: { position: 'absolute', zIndex: 1000, top: 30, right: 15 },
-  summaryMainImg: { width: windowWidth - 34, height: 260, borderRadius: 10, marginTop: 15 },
+  summaryMainImg: { marginBottom: 25 },
   summaryContentImg: { marginRight: 5 },
   distanceImg: { marginRight: 9 },
   summaryRightContents: { flexDirection: 'row' },

diff --git a/components/Home/CheckListHome.tsx b/components/Home/CheckListHome.tsx
@@ -24,8 +24,9 @@ function CheckListHome({ homeCheckList, refreshing, onRefresh }: IProps) {
         <ScrollView
           refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh} />}
         >
-          <DefaultText style={[styles.pinnedText]}>📌 고정된 리스트</DefaultText>
-
+          {homeCheckList.some((item) => item.pinned) ? (
+            <DefaultText style={[styles.pinnedText]}>📌 고정된 리스트</DefaultText>
+          ) : null}
           <ScrollView horizontal={true}>
             {homeCheckList
               .filter((item) => item.pinned)

diff --git a/components/Home/PinnedCheckList.tsx b/components/Home/PinnedCheckList.tsx
@@ -33,11 +33,12 @@ function PinnedCheckList({ pinnedCheckList }: iProps) {
               resizeMode="cover"
             />
           ) : (
-            <Image
-              style={[styles.pinnedChecklistImg]}
-              source={require('../../assets/images/home/mainLogo.png')}
-              resizeMode="contain"
-            />
+            <View style={styles.pinnedDefaultImgWrapper}>
+              <Image
+                style={styles.pinnedDefaultImg}
+                source={require('../../assets/images/checkList/checkLIstDefaultImg.png')}
+              />
+            </View>
           )}
           <View style={styles.pinnedChecklistSummaryCard}>
             <View>