diff --git a/src/components/common/DateTimeChange.jsx b/src/components/common/DateTimeChange.jsx
index 725e356..190d09c 100644
--- a/src/components/common/DateTimeChange.jsx
+++ b/src/components/common/DateTimeChange.jsx
@@ -4,7 +4,7 @@ import 'moment/locale/ko';
import moment from 'moment';
import Moment from 'react-moment';
-import { authorizedUsersNumber, isCheckedTimeStatus } from '../../util/utils';
+import { authorizedUsersNumber, changeDateToTime, isCheckedTimeStatus } from '../../util/utils';
import DateTimeStatus from '../../styles/DateTimeStatus';
@@ -13,7 +13,7 @@ moment.locale('ko');
const DateTimeChange = ({ group, page, time }) => {
const { participants, personnel, applyEndDate } = group;
- const applyEndTime = new Date(applyEndDate).getTime();
+ const applyEndTime = changeDateToTime(applyEndDate);
const valid = {
time, applyEndTime, participants, personnel,
diff --git a/src/components/introduce/StudyReviewForm.jsx b/src/components/introduce/StudyReviewForm.jsx
index e559d3d..5feaf7b 100644
--- a/src/components/introduce/StudyReviewForm.jsx
+++ b/src/components/introduce/StudyReviewForm.jsx
@@ -4,6 +4,8 @@ import styled from '@emotion/styled';
import StarRatings from 'react-star-ratings';
+import { changeDateToTime, isCheckedTimeStatus } from '../../util/utils';
+
import palette from '../../styles/palette';
import Textarea from '../../styles/Textarea';
import Button from '../../styles/Button';
@@ -39,7 +41,24 @@ const StudyReviewFormButton = styled(Button)`
margin: 1px 0 0.8rem 0.5rem;
`;
-const StudyReviewForm = () => {
+const isValidateUserInfo = (user) => (moderator) => !user || (moderator === user);
+
+const StudyReviewForm = ({ group, user, time }) => {
+ const {
+ participants, personnel, applyEndDate, moderatorId,
+ } = group;
+
+ const applyEndTime = changeDateToTime(applyEndDate);
+
+ const valid = {
+ time, applyEndTime, participants, personnel,
+ };
+
+ // TODO: 수정하자.
+ if (isValidateUserInfo(user)(moderatorId) || !isCheckedTimeStatus(valid)) {
+ return null;
+ }
+
const [rating, setRating] = useState(0);
const changeRating = (newRating) => {
diff --git a/src/components/introduce/StudyReviewForm.test.jsx b/src/components/introduce/StudyReviewForm.test.jsx
index 8962d75..edaa5c3 100644
--- a/src/components/introduce/StudyReviewForm.test.jsx
+++ b/src/components/introduce/StudyReviewForm.test.jsx
@@ -4,16 +4,68 @@ import { render } from '@testing-library/react';
import StudyReviewForm from './StudyReviewForm';
+import { yesterday } from '../../util/utils';
+import STUDY_GROUP from '../../../fixtures/study-group';
+
describe('StudyReviewForm', () => {
- const renderStudyReviewForm = () => render((
-
+ const renderStudyReviewForm = ({ group, time, user }) => render((
+
));
- it('renders study review form text', () => {
- const { container, getByPlaceholderText } = renderStudyReviewForm();
+ context('with user', () => {
+ describe('User is not moderator and applyEndDate is Deadline', () => {
+ const info = {
+ group: {
+ ...STUDY_GROUP,
+ applyEndDate: yesterday,
+ },
+ time: Date.now(),
+ user: 'user1',
+ };
+
+ it('renders study review form', () => {
+ const { container } = renderStudyReviewForm(info);
+
+ expect(container).toHaveTextContent('스터디 후기를 작성해주세요!');
+ });
+ });
+
+ describe('User is moderator', () => {
+ const info = {
+ group: {
+ ...STUDY_GROUP,
+ applyEndDate: yesterday,
+ },
+ time: Date.now(),
+ user: 'user2',
+ };
+
+ it('nothing renders study review form', () => {
+ const { container } = renderStudyReviewForm(info);
+
+ expect(container).toBeEmptyDOMElement();
+ });
+ });
+ });
+
+ context('without user', () => {
+ const info = {
+ group: {
+ ...STUDY_GROUP,
+ applyEndDate: yesterday,
+ },
+ time: Date.now(),
+ user: null,
+ };
+
+ it('nothing renders study review form', () => {
+ const { container } = renderStudyReviewForm(info);
- expect(container).toHaveTextContent('스터디 후기를 작성해주세요!');
- expect(container).toHaveTextContent('후기 등록하기');
- expect(getByPlaceholderText('후기를 입력해주세요!')).not.toBeNull();
+ expect(container).toBeEmptyDOMElement();
+ });
});
});
diff --git a/src/containers/introduce/StudyReviewContainer.jsx b/src/containers/introduce/StudyReviewContainer.jsx
index 2f9ce9d..244aa4c 100644
--- a/src/containers/introduce/StudyReviewContainer.jsx
+++ b/src/containers/introduce/StudyReviewContainer.jsx
@@ -1,9 +1,33 @@
-import React from 'react';
+import React, { useState } from 'react';
+
+import { useSelector } from 'react-redux';
+import { useInterval } from 'react-use';
+
+import { getAuth, getGroup } from '../../util/utils';
import StudyReviewForm from '../../components/introduce/StudyReviewForm';
-const StudyReviewContainer = () => (
-
-);
+const StudyReviewContainer = () => {
+ const [realTime, setRealTime] = useState(Date.now());
+
+ const group = useSelector(getGroup('group'));
+ const user = useSelector(getAuth('user'));
+
+ useInterval(() => {
+ setRealTime(Date.now());
+ }, 1000);
+
+ if (!group) {
+ return null;
+ }
+
+ return (
+
+ );
+};
export default StudyReviewContainer;
diff --git a/src/containers/introduce/StudyReviewContainer.test.jsx b/src/containers/introduce/StudyReviewContainer.test.jsx
index 362f858..ac6cd50 100644
--- a/src/containers/introduce/StudyReviewContainer.test.jsx
+++ b/src/containers/introduce/StudyReviewContainer.test.jsx
@@ -1,18 +1,52 @@
import React from 'react';
+import { useSelector } from 'react-redux';
+
import { render } from '@testing-library/react';
import StudyReviewContainer from './StudyReviewContainer';
+import STUDY_GROUP from '../../../fixtures/study-group';
+import { yesterday } from '../../util/utils';
+
describe('StudyReviewContainer', () => {
+ beforeEach(() => {
+ useSelector.mockImplementation((state) => state({
+ groupReducer: {
+ group: given.group,
+ },
+ authReducer: {
+ user: given.user,
+ },
+ }));
+ });
+
const renderStudyReviewContainer = () => render((
));
- it('renders study group title and contents', () => {
- const { container } = renderStudyReviewContainer();
+ context('with login and group', () => {
+ given('group', () => ({
+ ...STUDY_GROUP,
+ applyEndDate: yesterday,
+ }));
+ given('user', () => ('user1'));
+
+ it('renders study review form', () => {
+ const { container } = renderStudyReviewContainer();
+
+ expect(container).toHaveTextContent('스터디 후기를 작성해주세요!');
+ });
+ });
+
+ context('without login and group', () => {
+ given('user', () => (null));
+ given('group', () => (null));
+
+ it('nothing renders review form', () => {
+ const { container } = renderStudyReviewContainer();
- expect(container).toHaveTextContent('스터디 후기를 작성해주세요!');
- expect(container).toHaveTextContent('후기 등록하기');
+ expect(container).toBeEmptyDOMElement();
+ });
});
});
diff --git a/src/util/utils.js b/src/util/utils.js
index f13c905..af809a5 100644
--- a/src/util/utils.js
+++ b/src/util/utils.js
@@ -29,6 +29,7 @@ export const changeDateToTime = (date) => new Date(date).getTime();
const nowDate = new Date();
export const tomorrow = nowDate.setDate(nowDate.getDate() + 1);
+export const yesterday = nowDate.setDate(nowDate.getDate() - 1);
export const toStringEndDateFormat = (endDate) => moment(new Date(endDate))
.format('YYYY-MM-DDTHH:mm:ss')