diff --git a/app/(tabs)/inboxView.jsx b/app/(tabs)/inboxView.jsx
index 1877007..41dcadf 100644
--- a/app/(tabs)/inboxView.jsx
+++ b/app/(tabs)/inboxView.jsx
@@ -35,7 +35,7 @@ const InboxView = () => {
const renderCategoriesTodo = ({ item }) => {
return (
-
+
);
@@ -61,6 +61,7 @@ const InboxView = () => {
item.id}
/>
diff --git a/app/(tabs)/index.jsx b/app/(tabs)/index.jsx
index 5784ead..5fd1f90 100644
--- a/app/(tabs)/index.jsx
+++ b/app/(tabs)/index.jsx
@@ -43,7 +43,7 @@ const TodayView = () => {
const renderCategoriesTodo = ({ item }) => {
return (
-
+
);
diff --git a/components/InboxSubTodo.jsx b/components/InboxSubTodo.jsx
index a693fab..2a1033d 100644
--- a/components/InboxSubTodo.jsx
+++ b/components/InboxSubTodo.jsx
@@ -1,11 +1,10 @@
+import { TextInputContext } from '@/contexts/textInputContext';
import { useSubTodoUpdateMutation } from '@/hooks/api/useSubTodoMutations';
import { Icon, Input, ListItem } from '@ui-kitten/components';
-import { useContext, useState } from 'react';
+import React, { useContext, useState } from 'react';
import { Text, TouchableOpacity } from 'react-native';
import { useTheme } from 'react-native-elements';
import TodoModal from './TodoModal';
-import React from 'react';
-import { TextInputContext } from '@/contexts/textInputContext';
const InboxSubTodo = ({ item }) => {
const [isEditing, setIsEditing] = useState(false);
@@ -13,11 +12,11 @@ const InboxSubTodo = ({ item }) => {
const theme = useTheme();
const [modalVisible, setModalVisible] = useState(false);
const { mutate: updateInboxSubTodo } = useSubTodoUpdateMutation();
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setInboxTextInputOpen } = useContext(TextInputContext);
const handleEdit = () => {
setIsEditing(true);
- setTextInputOpen(false);
+ setInboxTextInputOpen(false);
setModalVisible(false);
};
@@ -66,7 +65,7 @@ const InboxSubTodo = ({ item }) => {
onSubmitEditing={() => {
handleInboxSubTodoUpdate();
setIsEditing(false);
- setTextInputOpen(true);
+ setInboxTextInputOpen(true);
}}
autoFocus={true}
/>
diff --git a/components/InboxTodo.jsx b/components/InboxTodo.jsx
deleted file mode 100644
index 69ef327..0000000
--- a/components/InboxTodo.jsx
+++ /dev/null
@@ -1,173 +0,0 @@
-import { LoginContext } from '@/contexts/LoginContext';
-import { TextInputContext } from '@/contexts/textInputContext';
-import { useSubTodoAddMutation } from '@/hooks/api/useSubTodoMutations';
-import { useTodoUpdateMutation } from '@/hooks/api/useTodoMutations';
-import '@/locales/index';
-import {
- handleLogEvent,
- INBOXTODO_LIST_CLICK_EVENT,
- INBOXTODO_MEATBALLMENU_CLICK_EVENT,
-} from '@/utils/logEvent';
-import { Icon, Input, List, ListItem, useTheme } from '@ui-kitten/components';
-import React, { useContext, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Pressable, StyleSheet, Text, TouchableOpacity } from 'react-native';
-import InboxSubTodo from './InboxSubTodo';
-import TodoModal from './TodoModal';
-
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const InboxTodo = ({ item, drag, isActive }) => {
- const theme = useTheme();
- const [content, setContent] = useState(item.content);
- const [isEditing, setIsEditing] = useState(false);
- const [subTodoInput, setSubTodoInput] = useState('');
- const [modalVisible, setModalVisible] = useState(false);
- const [subTodoInputActivated, setSubTodoInputActivated] = useState(false);
- const { mutate: updateInboxTodo } = useTodoUpdateMutation();
- const { mutate: addInboxSubTodo } = useSubTodoAddMutation();
- const { userId } = useContext(LoginContext);
- const { t } = useTranslation();
- const { setTextInputOpen } = useContext(TextInputContext);
-
- const handleEdit = () => {
- setIsEditing(true);
- setTextInputOpen(false);
- setModalVisible(false);
- };
-
- const handleTodoUpdate = () => {
- const updatedData = {
- todoId: item.id,
- content: content,
- };
- updateInboxTodo(updatedData);
- };
-
- const handleSubtodoSubmit = () => {
- if (subTodoInput !== '') {
- const subTodoData = [
- {
- todoId: item.id,
- content: subTodoInput,
- },
- ];
- addInboxSubTodo({ todoData: subTodoData });
- setSubTodoInput('');
- setSubTodoInputActivated(false);
- }
- };
-
- const handleSubTodoCreate = () => {
- setModalVisible(false);
- setSubTodoInputActivated(true);
- };
-
- const renderSubTodo = ({ item: subTodoItem, index }) => {
- return ;
- };
-
- const outlineIcon = props => {
- return (
- setModalVisible(true)}>
-
-
- );
- };
-
- const settingIcon = props => {
- return (
- {
- handleLogEvent(INBOXTODO_MEATBALLMENU_CLICK_EVENT, {
- time: new Date().toISOString(),
- userId: userId,
- todoId: item.id,
- });
- setModalVisible(true);
- }}
- >
-
-
- );
- };
-
- return (
- <>
- setContent(value)}
- onSubmitEditing={() => {
- handleTodoUpdate();
- setIsEditing(false);
- setTextInputOpen(true);
- }}
- autoFocus={true}
- />
- ) : (
- {item.content}
- )
- }
- key={item.id}
- accessoryLeft={props => outlineIcon(props)}
- accessoryRight={props => settingIcon(props)}
- onPress={() => {
- handleLogEvent(INBOXTODO_LIST_CLICK_EVENT, {
- time: new Date().toISOString(),
- userId: userId,
- todoId: item.id,
- });
- setModalVisible(true);
- }}
- onLongPress={drag}
- />
- {
- setSubTodoInput(nextInput);
- }}
- autoFocus={true}
- onSubmitEditing={handleSubtodoSubmit}
- />
- ) : null
- }
- />
-
-
- );
-};
-
-const styles = StyleSheet.create({
- input: {
- paddingLeft: 40,
- },
-});
-
-export default InboxTodo;
diff --git a/components/InboxTodos.jsx b/components/InboxTodos.jsx
deleted file mode 100644
index 8be87cf..0000000
--- a/components/InboxTodos.jsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import { CategoryContext } from '@/contexts/CategoryContext';
-import { LoginContext } from '@/contexts/LoginContext';
-import useTodoStore from '@/contexts/TodoStore';
-import useInboxTodoQuery from '@/hooks/api/useInboxTodoQuery';
-import { useTodoAddMutation } from '@/hooks/api/useTodoMutations';
-import '@/locales/index';
-import {
- DEFAULT_SCROLL_EVENT_THROTTLE,
- handleScroll,
-} from '@/utils/handleScroll';
-import { INBOXVIEW_SCROLL_EVENT } from '@/utils/logEvent';
-import { Input } from '@ui-kitten/components';
-import { LexoRank } from 'lexorank';
-import { useContext, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { StyleSheet, Text } from 'react-native';
-import DraggableFlatList, {
- ScaleDecorator,
-} from 'react-native-draggable-flatlist';
-import { GestureHandlerRootView } from 'react-native-gesture-handler';
-import InboxTodo from './InboxTodo';
-
-const InboxTodos = () => {
- const [input, setInput] = useState('');
- const { userId } = useContext(LoginContext);
- const { selectedCategory } = useContext(CategoryContext);
- const {
- isLoading,
- error,
- data: inboxTodoData,
- isSuccess: isInboxTodoQuerySuccess,
- } = useInboxTodoQuery(userId);
- const setInboxTodos = useTodoStore(state => state.setInboxTodos);
- const inboxCurrentTodos = useTodoStore(state => state.inboxCurrentTodos);
- const setInboxCurrentTodos = useTodoStore(
- state => state.setInboxCurrentTodos,
- );
- const { mutate: addInboxTodo } = useTodoAddMutation();
- const { mutate: updateTodo } = useTodoAddMutation();
- const { t } = useTranslation();
- const renderTodo = ({ item, drag, isActive }) => {
- return (
-
-
-
- );
- };
-
- const handleDragEnd = async ({ data }) => {
- const updatedData = data.map(item => {
- return {
- todoId: item.id,
- order: LexoRank.parse(item.order).toString(),
- };
- });
- updateTodo(updatedData);
- };
- //TODO: order 순서 생각해보니까 이제 서버에서 하잖아? 일단 전체 투두에서 계속 마지막으로 붙이는 식으로 구현
- const handleSubmit = async () => {
- const newTodoData = {
- content: input,
- categoryId: selectedCategory,
- };
-
- addInboxTodo({ todoData: newTodoData });
- setInput('');
- };
-
- useEffect(() => {
- if (isInboxTodoQuerySuccess) {
- setInboxTodos(inboxTodoData);
- let filteredTodos = inboxTodoData.filter(
- todo => todo.categoryId === selectedCategory,
- );
- setInboxCurrentTodos(filteredTodos);
- }
- // eslint-disable-next-line react-hooks/exhaustive-deps
- }, [isInboxTodoQuerySuccess, inboxTodoData, selectedCategory]);
-
- if (isLoading) return Loading...;
- if (error) return Error: {error.message};
-
- return (
-
- item.id.toString()}
- onScroll={() => handleScroll(INBOXVIEW_SCROLL_EVENT, userId)}
- scrollEventThrottle={DEFAULT_SCROLL_EVENT_THROTTLE}
- />
- {
- setInput(nextInput);
- }}
- autoFocus={false}
- onSubmitEditing={handleSubmit}
- />
-
- );
-};
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- justifyContent: 'space-between',
- backgroundColor: 'white',
- },
-});
-
-export default InboxTodos;
diff --git a/components/categoryView/CategoryBottomSheet.tsx b/components/categoryView/CategoryBottomSheet.tsx
index f46512b..d51a00d 100644
--- a/components/categoryView/CategoryBottomSheet.tsx
+++ b/components/categoryView/CategoryBottomSheet.tsx
@@ -49,7 +49,7 @@ const CategoryBottomSheet = () => {
title: categoryName,
color: 1,
};
- addCategory({ addCategoryData });
+ addCategory(addCategoryData);
};
const handleEditCategory = () => {
diff --git a/components/categoryView/CategoryMainItem.jsx b/components/categoryView/CategoryMainItem.jsx
index ecdd8c4..e26fbba 100644
--- a/components/categoryView/CategoryMainItem.jsx
+++ b/components/categoryView/CategoryMainItem.jsx
@@ -3,15 +3,24 @@ import colors from '@/theme/theme.json';
import { Icon } from '@ui-kitten/components';
import { useContext } from 'react';
import { Pressable, StyleSheet, View } from 'react-native';
-import CategoryButton from './CategoryButton';
import { scale, verticalScale } from 'react-native-size-matters';
+import CategoryButton from './CategoryButton';
-const CategoryMainItem = ({ item }) => {
- const { setTextInputOpen, setActivatedCategoryId } =
- useContext(TextInputContext);
+const CategoryMainItem = ({ item, isToday = true }) => {
+ const {
+ setTodayTextInputOpen,
+ setTodayActivatedCategoryId,
+ setInboxTextInputOpen,
+ setInboxActivatedCategoryId,
+ } = useContext(TextInputContext);
const handlePress = () => {
- setTextInputOpen(true);
- setActivatedCategoryId(item.id);
+ if (isToday) {
+ setTodayTextInputOpen(true);
+ setTodayActivatedCategoryId(item.id);
+ } else {
+ setInboxTextInputOpen(true);
+ setInboxActivatedCategoryId(item.id);
+ }
};
return (
diff --git a/components/inboxView/inboxTodos/InboxTodos.tsx b/components/inboxView/inboxTodos/InboxTodos.tsx
index 86c543f..088076e 100644
--- a/components/inboxView/inboxTodos/InboxTodos.tsx
+++ b/components/inboxView/inboxTodos/InboxTodos.tsx
@@ -1,11 +1,7 @@
-import CalendarBottomSheetProvider from '@/contexts/CalendarBottomSheetProvider';
-import { CategoryContext } from '@/contexts/CategoryContext';
import { LoginContext } from '@/contexts/LoginContext';
import { TextInputContext } from '@/contexts/textInputContext';
-import {
- useTodoAddMutation,
- useTodoUpdateMutation,
-} from '@/hooks/api/useTodoMutations';
+import { useTodoUpdateMutation } from '@/hooks/api/useTodoMutations';
+import useCreateInboxTodo from '@/hooks/todo/useCreateInboxTodo';
import useFilteredInboxTodos from '@/hooks/todo/useFilteredInboxTodo';
import '@/locales/index';
import colors from '@/theme/theme.json';
@@ -13,11 +9,14 @@ import {
DEFAULT_SCROLL_EVENT_THROTTLE,
handleScroll,
} from '@/utils/handleScroll';
-import { INBOXVIEW_SCROLL_EVENT } from '@/utils/logEvent';
-import { heightPercentage, widthPercentage } from '@/utils/responsiveSize';
+import {
+ handleLogEvent,
+ INBOXVIEW_SCROLL_EVENT,
+ TODAYVIEW_TEXTINPUT_SUBMIT_EVENT,
+} from '@/utils/logEvent';
import { Icon } from '@ui-kitten/components';
import { LexoRank } from 'lexorank';
-import React, { Fragment, useContext, useState } from 'react';
+import React, { Fragment, useContext } from 'react';
import { useTranslation } from 'react-i18next';
import {
KeyboardAvoidingView,
@@ -30,24 +29,24 @@ import DraggableFlatList, {
} from 'react-native-draggable-flatlist';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { KeyboardAccessoryView } from 'react-native-keyboard-accessory';
+import { moderateScale, scale, verticalScale } from 'react-native-size-matters';
import InboxTodo from './inboxTodo/InboxTodo';
-interface InboxTodosProps {
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- todosData: any;
- categoryId: number;
-}
-
-const InboxTodos: React.FC = ({ todosData, categoryId }) => {
+const InboxTodos = ({ todosData, categoryId }) => {
const { t } = useTranslation();
const { userId } = useContext(LoginContext);
- const { selectedCategory, setSelectedCategory } = useContext(CategoryContext);
- setSelectedCategory(categoryId);
+
const inboxCurrentTodos = useFilteredInboxTodos(todosData, categoryId);
- const { mutate: addInboxTodo } = useTodoAddMutation();
const { mutate: updateInboxTodo } = useTodoUpdateMutation();
- const { isTextInputOpen, activatedCategoryId } = useContext(TextInputContext);
- const [input, setInput] = useState('');
+ const {
+ isInboxTextInputOpen,
+ inboxActivatedCategoryId,
+ setInboxTextInputOpen,
+ } = useContext(TextInputContext);
+ const { input, setInput, handleSubmit } = useCreateInboxTodo(
+ userId,
+ categoryId,
+ );
const renderTodo = ({ item, drag, isActive }) => {
return (
@@ -68,82 +67,103 @@ const InboxTodos: React.FC = ({ todosData, categoryId }) => {
};
//TODO: order 순서 생각해보니까 이제 서버에서 하잖아? 일단 전체 투두에서 계속 마지막으로 붙이는 식으로 구현
const handleInputSubmit = async () => {
- const newTodoData = {
- content: input,
- categoryId: selectedCategory,
- };
+ handleLogEvent(TODAYVIEW_TEXTINPUT_SUBMIT_EVENT, {
+ time: new Date().toISOString(),
+ userId: userId,
+ });
- addInboxTodo({ todoData: newTodoData });
- setInput('');
+ handleSubmit();
+ setInboxTextInputOpen(false);
};
return (
-
-
+ item.id.toString()}
+ onScroll={() => handleScroll(INBOXVIEW_SCROLL_EVENT, userId)}
+ scrollEventThrottle={DEFAULT_SCROLL_EVENT_THROTTLE}
+ />
+
+ {isInboxTextInputOpen && categoryId === inboxActivatedCategoryId ? (
+
- item.id.toString()}
- onScroll={() => handleScroll(INBOXVIEW_SCROLL_EVENT, userId)}
- scrollEventThrottle={DEFAULT_SCROLL_EVENT_THROTTLE}
- />
-
- {isTextInputOpen && categoryId === activatedCategoryId ? (
-
-
-
-
-
-
- ) : null}
-
+
+
+
+
+
+ ) : null}
);
};
const styles = StyleSheet.create({
- touchableCheck: {
- paddingTop: 0,
- justifyContent: 'center',
+ container: {
+ flex: 1,
},
- checkIcon: {
- width: widthPercentage(20),
- height: heightPercentage(20),
+ keyboardInputContainer: {
+ backgroundColor: 'white',
+ borderTopWidth: 0,
+ },
+ mainContainer: {
+ flex: 1,
+ backgroundColor: 'white',
+ },
+ flatListContainer: {
+ flex: 1,
+ },
+ keyboardAvoidingView: {
+ width: '100%',
+ position: 'absolute',
+ bottom: 0,
+ backgroundColor: 'white',
+ },
+ inputWrapper: {
+ width: '100%',
+ borderTopWidth: StyleSheet.hairlineWidth,
+ borderTopColor: colors.Gray02,
+ backgroundColor: 'white',
},
inputContainer: {
flexDirection: 'row',
+ alignItems: 'center',
+ paddingHorizontal: scale(7),
+ paddingVertical: verticalScale(8),
+ },
+ checkIcon: {
+ width: scale(24),
+ height: verticalScale(24),
},
textInput: {
- backgroundColor: colors.Gray02,
flex: 1,
- borderRadius: widthPercentage(4),
- marginLeft: widthPercentage(2),
- paddingHorizontal: widthPercentage(4),
- },
- keyboardInputContainer: {
- backgroundColor: 'white',
- borderTopWidth: 0,
+ backgroundColor: colors.Gray02,
+ borderRadius: moderateScale(4),
+ marginLeft: scale(4),
+ paddingHorizontal: scale(8),
+ height: scale(24),
+ fontSize: moderateScale(14),
},
});
diff --git a/components/inboxView/inboxTodos/inboxTodo/InboxTodo.jsx b/components/inboxView/inboxTodos/inboxTodo/InboxTodo.jsx
index 07bce6f..4082d04 100644
--- a/components/inboxView/inboxTodos/inboxTodo/InboxTodo.jsx
+++ b/components/inboxView/inboxTodos/inboxTodo/InboxTodo.jsx
@@ -22,7 +22,7 @@ const InboxTodo = ({ item, drag, isActive }) => {
setGeneratedSubTodos,
} = useInboxTodo();
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setInboxTextInputOpen } = useContext(TextInputContext);
const {
isVisible: isSubTodoGenerateModalVisible,
@@ -33,7 +33,7 @@ const InboxTodo = ({ item, drag, isActive }) => {
const handleEdit = () => {
setIsEditing(true);
- setTextInputOpen(false);
+ setInboxTextInputOpen(false);
setIsTodoModalVisible(false);
};
diff --git a/components/inboxView/inboxTodos/inboxTodo/subTodoList/InboxSubTodo.jsx b/components/inboxView/inboxTodos/inboxTodo/subTodoList/InboxSubTodo.jsx
index d0ee342..226b07c 100644
--- a/components/inboxView/inboxTodos/inboxTodo/subTodoList/InboxSubTodo.jsx
+++ b/components/inboxView/inboxTodos/inboxTodo/subTodoList/InboxSubTodo.jsx
@@ -17,11 +17,11 @@ const InboxSubTodo = ({ item }) => {
const theme = useTheme();
const { mutate: updateSubTodo } = useSubTodoUpdateMutation();
const { userId } = useContext(LoginContext);
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setInboxTextInputOpen } = useContext(TextInputContext);
const handleEdit = () => {
setIsEditing(true);
- setTextInputOpen(false);
+ setInboxTextInputOpen(false);
};
const handleSubTodoUpdate = () => {
@@ -69,7 +69,7 @@ const InboxSubTodo = ({ item }) => {
onSubmitEditing={() => {
handleSubTodoUpdate();
setIsEditing(false);
- setTextInputOpen(true);
+ setInboxTextInputOpen(true);
}}
autoFocus={true}
/>
diff --git a/components/inboxView/inboxTodos/inboxTodo/subTodoList/SubTodoList.tsx b/components/inboxView/inboxTodos/inboxTodo/subTodoList/SubTodoList.tsx
index fd4fcb2..2232de2 100644
--- a/components/inboxView/inboxTodos/inboxTodo/subTodoList/SubTodoList.tsx
+++ b/components/inboxView/inboxTodos/inboxTodo/subTodoList/SubTodoList.tsx
@@ -36,16 +36,6 @@ const SubTodoList: React.FC = ({
contentContainerStyle={{ marginLeft: 40, paddingLeft: 40 }}
ListFooterComponent={
subTodoInputActivated ? (
- // {
- // setSubtodoInput(nextInput);
- // }}
- // autoFocus={true}
- // onSubmitEditing={handleSubtodoSubmit}
- // />
onPress={() => {
handleEditPress();
+ setVisible(false);
}}
style={styles.topMenuItem}
/>
@@ -98,6 +99,7 @@ const TodoMoreMenu = ({
title=
onPress={() => {
handleDeletePress();
+ setVisible(false);
}}
style={styles.middleMenuItem}
/>
diff --git a/components/inboxView/inboxTodos/inboxTodo/todoListItem/useTodoListItem.ts b/components/inboxView/inboxTodos/inboxTodo/todoListItem/useTodoListItem.ts
index 90c835e..b454cc4 100644
--- a/components/inboxView/inboxTodos/inboxTodo/todoListItem/useTodoListItem.ts
+++ b/components/inboxView/inboxTodos/inboxTodo/todoListItem/useTodoListItem.ts
@@ -19,7 +19,7 @@ const useTodoListItem = ({
const { mutate: updateTodo } = useTodoUpdateMutation();
const { userId } = useContext(LoginContext);
const theme = useTheme();
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setInboxTextInputOpen } = useContext(TextInputContext);
const checkIconlogPressEvent = () => {
handleLogEvent(DAILYTODO_TODOCOMPLETE_CLICK_EVENT, {
@@ -59,7 +59,7 @@ const useTodoListItem = ({
const handleTodoListItemSubmitEditing = content => {
handleTodoContentUpdate(content);
setIsEditing(false);
- setTextInputOpen(true);
+ setInboxTextInputOpen(false);
};
const handleGenerateIconPress = () => {
diff --git a/components/todayView/dailyTodos/DailyTodos.tsx b/components/todayView/dailyTodos/DailyTodos.tsx
index d33cf12..c5162dd 100644
--- a/components/todayView/dailyTodos/DailyTodos.tsx
+++ b/components/todayView/dailyTodos/DailyTodos.tsx
@@ -21,8 +21,8 @@ import { useTranslation } from 'react-i18next';
import { StyleSheet, TextInput, View } from 'react-native';
import DraggableFlatList from 'react-native-draggable-flatlist';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
-import DailyTodo from './dailyTodo/DailyTodo';
import { moderateScale, scale, verticalScale } from 'react-native-size-matters';
+import DailyTodo from './dailyTodo/DailyTodo';
const DailyTodos = ({ todosData, categoryId }) => {
const { userId } = useContext(LoginContext);
@@ -36,8 +36,11 @@ const DailyTodos = ({ todosData, categoryId }) => {
selectedDate,
);
- const { isTextInputOpen, activatedCategoryId, setTextInputOpen } =
- useContext(TextInputContext);
+ const {
+ isTodayTextInputOpen,
+ todayActivatedCategoryId,
+ setTodayTextInputOpen,
+ } = useContext(TextInputContext);
const handleDragEnd = useHandleDrag();
@@ -47,7 +50,7 @@ const DailyTodos = ({ todosData, categoryId }) => {
userId: userId,
});
handleSubmit();
- setTextInputOpen(false);
+ setTodayTextInputOpen(false);
};
const renderTodo = ({ item, drag, isActive }) => {
@@ -69,7 +72,7 @@ const DailyTodos = ({ todosData, categoryId }) => {
containerStyle={styles.flatListContainer}
/>
- {isTextInputOpen && categoryId === activatedCategoryId && (
+ {isTodayTextInputOpen && categoryId === todayActivatedCategoryId && (
{
setGeneratedSubTodos,
} = useDailyTodo();
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setTodayTextInputOpen } = useContext(TextInputContext);
const {
isVisible: isSubTodoGenerateModalVisible,
setIsVisible: setIsSubTodoGenerateModalVisible,
@@ -32,7 +32,7 @@ const DailyTodo = ({ item, drag, isActive }) => {
const handleEdit = () => {
setIsEditing(true);
- setTextInputOpen(false);
+ setTodayTextInputOpen(false);
setIsTodoModalVisible(false);
};
diff --git a/components/todayView/dailyTodos/dailyTodo/subTodoList/DailySubTodo.jsx b/components/todayView/dailyTodos/dailyTodo/subTodoList/DailySubTodo.jsx
index 4d0349a..ddb437e 100644
--- a/components/todayView/dailyTodos/dailyTodo/subTodoList/DailySubTodo.jsx
+++ b/components/todayView/dailyTodos/dailyTodo/subTodoList/DailySubTodo.jsx
@@ -1,3 +1,4 @@
+import EditableTextField from '@/components/common/molecules/EditableTextField';
import { LoginContext } from '@/contexts/LoginContext';
import { TextInputContext } from '@/contexts/textInputContext';
import { useSubTodoUpdateMutation } from '@/hooks/api/useSubTodoMutations';
@@ -6,24 +7,22 @@ import {
DAILYTODO_SUBTODOCOMPLETE_CLICK_EVENT,
handleLogEvent,
} from '@/utils/logEvent';
-import { Icon } from '@ui-kitten/components';
+import { Icon, ListItem } from '@ui-kitten/components';
import { useContext, useState } from 'react';
+import { Pressable, StyleSheet } from 'react-native';
import { moderateScale, scale, verticalScale } from 'react-native-size-matters';
import SubTodoMoreMenu from './subTodoMoreMenu/SubTodoMoreMenu';
-import EditableTextField from '@/components/common/molecules/EditableTextField';
-import { ListItem } from '@ui-kitten/components';
-import { Pressable, StyleSheet } from 'react-native';
const DailySubTodo = ({ item }) => {
const [completed, setCompleted] = useState(item.isCompleted);
const [isEditing, setIsEditing] = useState(false);
const { mutate: updateSubTodo } = useSubTodoUpdateMutation();
const { userId } = useContext(LoginContext);
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setTodayTextInputOpen } = useContext(TextInputContext);
const handleEdit = () => {
setIsEditing(true);
- setTextInputOpen(false);
+ setTodayTextInputOpen(false);
};
const handleCheck = () => {
diff --git a/components/todayView/dailyTodos/dailyTodo/todoListItem/todoMoreMenu/TodoMoreMenu.tsx b/components/todayView/dailyTodos/dailyTodo/todoListItem/todoMoreMenu/TodoMoreMenu.tsx
index 49fc2ce..f6c8fa6 100644
--- a/components/todayView/dailyTodos/dailyTodo/todoListItem/todoMoreMenu/TodoMoreMenu.tsx
+++ b/components/todayView/dailyTodos/dailyTodo/todoListItem/todoMoreMenu/TodoMoreMenu.tsx
@@ -1,4 +1,14 @@
+import AddIcon from '@/components/icons/AddIcon';
+import ChangeDateIcon from '@/components/icons/ChangeDateIcon';
+import DeleteIcon from '@/components/icons/DeleteIcon';
+import EditIcon from '@/components/icons/EditIcon';
+import FolderIcon from '@/components/icons/FolderIcon';
+import GenerateSubtodoIcon from '@/components/icons/GenerateSubtodoIcon';
+import { AIBottomSheetContext } from '@/contexts/AIBottomSheetProvider';
+import { CalendarBottomSheetContext } from '@/contexts/CalendarBottomSheetProvider';
+import useTodoStore from '@/contexts/TodoStore';
import '@/locales/index';
+import theme from '@/theme/theme.json';
import {
Icon,
Layout,
@@ -9,19 +19,9 @@ import {
import React, { useCallback, useContext, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { StyleSheet, TouchableOpacity } from 'react-native';
+import { moderateScale, scale } from 'react-native-size-matters/extend';
import fontStyles from '../../../../../../theme/fontStyles';
-import { scale, moderateScale } from 'react-native-size-matters/extend';
-import EditIcon from '@/components/icons/EditIcon';
-import DeleteIcon from '@/components/icons/DeleteIcon';
-import ChangeDateIcon from '@/components/icons/ChangeDateIcon';
-import GenerateSubtodoIcon from '@/components/icons/GenerateSubtodoIcon';
-import AddIcon from '@/components/icons/AddIcon';
-import FolderIcon from '@/components/icons/FolderIcon';
-import theme from '@/theme/theme.json';
import useTodoMoreMenu from './useTodoMoreMenu';
-import { CalendarBottomSheetContext } from '@/contexts/CalendarBottomSheetProvider';
-import useTodoStore from '@/contexts/TodoStore';
-import { AIBottomSheetContext } from '@/contexts/AIBottomSheetProvider';
const TodoText = ({ titleText, disabled = false }) => {
return (
diff --git a/components/todayView/dailyTodos/dailyTodo/todoListItem/useTodoListItem.ts b/components/todayView/dailyTodos/dailyTodo/todoListItem/useTodoListItem.ts
index 1827bcb..cb309ca 100644
--- a/components/todayView/dailyTodos/dailyTodo/todoListItem/useTodoListItem.ts
+++ b/components/todayView/dailyTodos/dailyTodo/todoListItem/useTodoListItem.ts
@@ -1,3 +1,4 @@
+import { TextInputContext } from '@/contexts/textInputContext';
import { useTheme } from '@ui-kitten/components';
import { useContext } from 'react';
import { LoginContext } from '../../../../../contexts/LoginContext';
@@ -8,7 +9,6 @@ import {
DAILYTODO_TODOCOMPLETE_CLICK_EVENT,
handleLogEvent,
} from '../../../../../utils/logEvent';
-import { TextInputContext } from '@/contexts/textInputContext';
const useTodoListItem = ({
item,
@@ -19,7 +19,7 @@ const useTodoListItem = ({
const { mutate: updateTodo } = useTodoUpdateMutation();
const { userId } = useContext(LoginContext);
const theme = useTheme();
- const { setTextInputOpen } = useContext(TextInputContext);
+ const { setTodayTextInputOpen } = useContext(TextInputContext);
const checkIconlogPressEvent = () => {
handleLogEvent(DAILYTODO_TODOCOMPLETE_CLICK_EVENT, {
@@ -59,7 +59,7 @@ const useTodoListItem = ({
const handleTodoListItemSubmitEditing = content => {
handleTodoContentUpdate(content);
setIsEditing(false);
- setTextInputOpen(false);
+ setTodayTextInputOpen(false);
};
const handleGenerateIconPress = () => {
diff --git a/contexts/textInputContext.js b/contexts/textInputContext.js
index 50eab23..bfc925c 100644
--- a/contexts/textInputContext.js
+++ b/contexts/textInputContext.js
@@ -3,16 +3,24 @@ import { createContext, useState } from 'react';
export const TextInputContext = createContext();
const TextInputProvider = ({ children }) => {
- const [isTextInputOpen, setTextInputOpen] = useState(false);
- const [activatedCategoryId, setActivatedCategoryId] = useState(null);
+ const [isTodayTextInputOpen, setTodayTextInputOpen] = useState(false);
+ const [todayActivatedCategoryId, setTodayActivatedCategoryId] =
+ useState(null);
+ const [isInboxTextInputOpen, setInboxTextInputOpen] = useState(false);
+ const [inboxActivatedCategoryId, setInboxActivatedCategoryId] =
+ useState(null);
return (
{children}
diff --git a/hooks/api/useCategoryMutation.js b/hooks/api/useCategoryMutation.js
index 3e350e6..f237142 100644
--- a/hooks/api/useCategoryMutation.js
+++ b/hooks/api/useCategoryMutation.js
@@ -2,7 +2,7 @@ import { api as Api } from '@/utils/api';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { QUERY_KEY } from './useCategoriesQuery';
-const addCategoryFetcher = async ({ addCategoryData }) => {
+const addCategoryFetcher = async addCategoryData => {
const data = await Api.addCategory(addCategoryData);
return data;
};
diff --git a/hooks/api/useInboxTodoQuery.js b/hooks/api/useInboxTodoQuery.js
index 1930e72..faa94a6 100644
--- a/hooks/api/useInboxTodoQuery.js
+++ b/hooks/api/useInboxTodoQuery.js
@@ -13,8 +13,7 @@ const useInboxTodoQuery = userId => {
return useQuery({
queryKey: [INBOX_QUERY_KEY],
queryFn: () => fetcher(userId),
- // refetchInterval: 30000,
- // refetchIntervalInBackground: true,
+ suspense: true,
});
};
diff --git a/hooks/api/useSubTodoMutations.js b/hooks/api/useSubTodoMutations.js
index 4068057..041bf7a 100644
--- a/hooks/api/useSubTodoMutations.js
+++ b/hooks/api/useSubTodoMutations.js
@@ -1,5 +1,6 @@
import { api as Api } from '@/utils/api';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { INBOX_QUERY_KEY } from './useInboxTodoQuery';
import { TODO_QUERY_KEY } from './useTodoQuery';
const addSubTodoFetcher = async ({ todoData }) => {
@@ -11,10 +12,14 @@ export const useSubTodoAddMutation = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: addSubTodoFetcher,
- onSuccess: () =>
+ onSuccess: () => {
queryClient.invalidateQueries({
queryKey: [TODO_QUERY_KEY],
- }),
+ });
+ queryClient.invalidateQueries({
+ queryKey: [INBOX_QUERY_KEY],
+ });
+ },
});
};
@@ -27,10 +32,14 @@ export const useSubTodoUpdateMutation = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: updateSubTodoFetcher,
- onSuccess: () =>
+ onSuccess: () => {
queryClient.invalidateQueries({
queryKey: [TODO_QUERY_KEY],
- }),
+ });
+ queryClient.invalidateQueries({
+ queryKey: [INBOX_QUERY_KEY],
+ });
+ },
});
};
@@ -43,9 +52,13 @@ export const useSubTodoDeleteMutation = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: deleteSubTodoFetcher,
- onSuccess: () =>
+ onSuccess: () => {
queryClient.invalidateQueries({
queryKey: [TODO_QUERY_KEY],
- }),
+ });
+ queryClient.invalidateQueries({
+ queryKey: [INBOX_QUERY_KEY],
+ });
+ },
});
};
diff --git a/hooks/api/useTodoMutations.js b/hooks/api/useTodoMutations.js
index 642cc7c..3ef1b5a 100644
--- a/hooks/api/useTodoMutations.js
+++ b/hooks/api/useTodoMutations.js
@@ -1,9 +1,10 @@
import { api as Api } from '@/utils/api';
import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { INBOX_QUERY_KEY } from './useInboxTodoQuery';
import { TODO_QUERY_KEY } from './useTodoQuery';
// 생성 (Add Todo)
-const addTodoFetcher = async ({ todoData }) => {
+const addTodoFetcher = async todoData => {
const data = await Api.addTodo(todoData);
return data;
};
@@ -14,6 +15,7 @@ export const useTodoAddMutation = () => {
mutationFn: addTodoFetcher,
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: [TODO_QUERY_KEY] });
+ queryClient.invalidateQueries({ queryKey: [INBOX_QUERY_KEY] });
},
});
};
@@ -30,6 +32,7 @@ export const useTodoUpdateMutation = () => {
mutationFn: updateTodoFetcher,
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: [TODO_QUERY_KEY] });
+ queryClient.invalidateQueries({ queryKey: [INBOX_QUERY_KEY] });
},
});
};
@@ -44,7 +47,9 @@ export const useTodoDeleteMutation = () => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: deleteTodoFetcher,
- onSuccess: () =>
- queryClient.invalidateQueries({ queryKey: [TODO_QUERY_KEY] }),
+ onSuccess: () => {
+ queryClient.invalidateQueries({ queryKey: [TODO_QUERY_KEY] });
+ queryClient.invalidateQueries({ queryKey: [INBOX_QUERY_KEY] });
+ },
});
};
diff --git a/hooks/todo/useCreateInboxTodo.js b/hooks/todo/useCreateInboxTodo.js
new file mode 100644
index 0000000..5dcfa2a
--- /dev/null
+++ b/hooks/todo/useCreateInboxTodo.js
@@ -0,0 +1,22 @@
+import { useTodoAddMutation } from '@/hooks/api/useTodoMutations';
+import { useState } from 'react';
+
+const useCreateInboxTodo = (userId, selectedCategory) => {
+ const [input, setInput] = useState('');
+ const { mutate: addTodo } = useTodoAddMutation();
+
+ //TODO: react query와 zustand를 합쳐서 todo 상태관리를 하도록 수정해야 함
+ const handleSubmit = () => {
+ const newTodoData = {
+ content: input,
+ categoryId: selectedCategory,
+ };
+
+ addTodo(newTodoData);
+ setInput('');
+ };
+
+ return { input, setInput, handleSubmit };
+};
+
+export default useCreateInboxTodo;
diff --git a/hooks/todo/useCreateTodo.js b/hooks/todo/useCreateTodo.js
index b4ba2d3..3a2ea3b 100644
--- a/hooks/todo/useCreateTodo.js
+++ b/hooks/todo/useCreateTodo.js
@@ -12,7 +12,7 @@ const useCreateTodo = (userId, selectedCategory, selectedDate) => {
categoryId: selectedCategory,
};
- addTodo({ todoData: newTodoData });
+ addTodo(newTodoData);
setInput('');
};