컴포넌트를 다 만들었으면 PostActionButtons 내부에서 사용해 봅시다.
components/post/PostActionButtons.js
import React, { useState, useCallback } from 'react'; import styled from 'styled-components'; import palette from '../../lib/styles/palette'; import AskRemoveModal from './AskRemoveModal'; (...) const PostActionButtons = ({ onEdit, onRemove }) => { const [modal, setModal] = useState(false); const onRemoveClick = () => { setModal(true); }; const onCancel = () => { setModal(false); }; const onConfirm = () => { setModal(false); onRemove(); }; return ( <> <PostActionButtonsBlock> <ActionButton onClick={onEdit}>수정</ActionButton> <ActionButton onClick={onRemoveClick}>삭제</ActionButton> </PostActionButtonsBlock> <AskRemoveModal visible={modal} onConfirm={onConfirm} onCancel={onCancel} /> </> ); }; export default PostActionButtons;