NavButton.tsx

import React, {useContext} from 'react';
import usePoetry from "./usePoetry";
import {PageContext} from "./MainPage";

type props = {
  direction: string;
}

const NavButton = (props: props) => {
  const changePage = useContext(PageContext);

  const onClick = () => {
    const increment: boolean = props.direction == "right";
    changePage(increment);
  };

  return (
    <button onClick={onClick}>{props.direction}</button>
  )
};

export default NavButton;