컴포넌트를 다 만들었으면 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;

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.