diff --git a/src/components/write/WriteButtons.jsx b/src/components/write/WriteButtons.jsx
index 7a23c0b..30a9aa1 100644
--- a/src/components/write/WriteButtons.jsx
+++ b/src/components/write/WriteButtons.jsx
@@ -4,7 +4,7 @@ import styled from '@emotion/styled';
const WriteButtonsWrapper = styled.div``;
-const WriteButtons = ({ onSubmit }) => (
+const WriteButtons = ({ onSubmit, onCancel }) => (
-
+
);
diff --git a/src/containers/write/WriteButtonsContainer.jsx b/src/containers/write/WriteButtonsContainer.jsx
index a0f1caa..367def1 100644
--- a/src/containers/write/WriteButtonsContainer.jsx
+++ b/src/containers/write/WriteButtonsContainer.jsx
@@ -1,7 +1,6 @@
import React, { useEffect, useCallback } from 'react';
import { useDispatch, useSelector } from 'react-redux';
-
import { useHistory } from 'react-router-dom';
import { get } from '../../util/utils';
@@ -28,10 +27,15 @@ const WriteButtonsContainer = () => {
}
}, [history, group]);
+ const onCancel = () => {
+ history.push('/');
+ };
+
return (
);
};
diff --git a/src/containers/write/WriteButtonsContainer.test.jsx b/src/containers/write/WriteButtonsContainer.test.jsx
index 0fe07ad..7188890 100644
--- a/src/containers/write/WriteButtonsContainer.test.jsx
+++ b/src/containers/write/WriteButtonsContainer.test.jsx
@@ -47,10 +47,23 @@ describe('WriteButtonsContainer', () => {
expect(container).toHaveTextContent('취소');
});
+ describe('when click cancel button', () => {
+ given('group', () => (null));
+
+ it('Go to the main page', () => {
+ const { getByText } = renderWriteButtonsContainer();
+
+ fireEvent.click(getByText('취소'));
+
+ expect(mockPush).toBeCalledWith('/');
+ });
+ });
+
describe('when click submit button', () => {
context('with group', () => {
given('group', () => (STUDY_GROUP));
- it('dispatch action submit event', () => {
+
+ it('dispatch action writeStudyGroup event', () => {
const { getByText } = renderWriteButtonsContainer();
fireEvent.click(getByText('등록하기'));
@@ -63,6 +76,7 @@ describe('WriteButtonsContainer', () => {
context('without group', () => {
given('group', () => (null));
+
it('dispatch action submit event', () => {
const { getByText } = renderWriteButtonsContainer();
diff --git a/src/containers/write/WriteFormContainer.jsx b/src/containers/write/WriteFormContainer.jsx
index abeb93e..843194d 100644
--- a/src/containers/write/WriteFormContainer.jsx
+++ b/src/containers/write/WriteFormContainer.jsx
@@ -1,11 +1,11 @@
-import React from 'react';
+import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { get } from '../../util/utils';
import WriteForm from '../../components/write/WriteForm';
-import { changeWriteField } from '../../reducers/slice';
+import { changeWriteField, clearWriteFields } from '../../reducers/slice';
const WriteFormContainer = () => {
const dispatch = useDispatch();
@@ -21,6 +21,10 @@ const WriteFormContainer = () => {
);
};
+ useEffect(() => () => {
+ dispatch(clearWriteFields());
+ }, [dispatch]);
+
return (