How to redirect to a gatsby-react page with an onclick event of a component?

Instead of using Link or window.location as mentioned in the question we can use navigate from gatsby. As shown below

import React from  'react';
import { OverflowMenu, OverflowMenuItem } from '../Overflow';
import {navigate} from 'gatsby'; //import navigate from gatsby

class  OverflowComponent extends React.Component {

editPage(index) {
  navigate('/edit'); //navigate to edit page

deletePage() {
  console.log("Delete clicked");

    return (
        <OverflowMenu flipped={true}>
            <OverflowMenuItem  itemText="Edit" primaryFocus onClick={() => this.editPage()} />
            <OverflowMenuItem  itemText="Delete" onClick={() => this.deletePaget()} />

export default OverflowComponent;