diff --git a/src/components/introduce/ModeratorViewButton.jsx b/src/components/introduce/ModeratorViewButton.jsx new file mode 100644 index 0000000..e1dbe30 --- /dev/null +++ b/src/components/introduce/ModeratorViewButton.jsx @@ -0,0 +1,24 @@ +import React from 'react'; + +import StyledApplyStatusButton from '../../styles/StyledApplyStatusButton'; + +const ModeratorViewButton = ({ group, user }) => { + const { moderatorId } = group; + + if (moderatorId !== user) { + return null; + } + + return ( + <> + + 스터디 참여 승인하기 + + + ); +}; + +export default ModeratorViewButton; diff --git a/src/components/introduce/ModeratorViewButton.test.jsx b/src/components/introduce/ModeratorViewButton.test.jsx new file mode 100644 index 0000000..76a4f26 --- /dev/null +++ b/src/components/introduce/ModeratorViewButton.test.jsx @@ -0,0 +1,42 @@ +import React from 'react'; + +import { render } from '@testing-library/react'; + +import ModeratorViewButton from './ModeratorViewButton'; + +import STUDY_GROUP from '../../../fixtures/study-group'; + +describe('ModeratorViewButton', () => { + const renderModeratorViewButton = ({ group, user }) => render(( + + )); + + context('When the organizer and the logged-in user are different', () => { + const group = { + ...STUDY_GROUP, + moderatorId: 'user', + }; + + it('nothing renders', () => { + const { container } = renderModeratorViewButton({ group, user: 'user1' }); + + expect(container).toBeEmptyDOMElement(); + }); + }); + + context('When the host and logged in user are the same', () => { + const group = { + ...STUDY_GROUP, + moderatorId: 'user', + }; + + it('nothing renders', () => { + const { container } = renderModeratorViewButton({ group, user: 'user' }); + + expect(container).toHaveTextContent('스터디 참여 승인하기'); + }); + }); +});