Dmitriy Dyatlov

1. Вам надо в элементах списка рендерить ссылку роутера с параметром, по которому будет осуществляться поиск по json. Например:
<Link to={`/tasks/${item.id}`}>Open</Link>

2. Далее надо добавить Route для детализации:

<Route exact path="tasks/:id" component={TaskDetails} />

3. В компоненте TaskDetails получаем нужную задачу с помощью параметра перехваченного роутером:

import React from 'react';
import tasks from '../data/tasks';

const TaskDetails = ({ match }) => {
  const { id } = match.params;
  const task = tasks.find(item => item.id === id);

  return ( /* ... */ );
}

export default TaskDetails;

import React, { Component } from 'react'

export default class App extends Component {

  render() {
    const data = [
      {'name': 'Education', 'number': 33},
      {'name': 'Promotion', 'number': 10},
      {'name': 'Events', 'number': 55 }
     ]

    let tableTemplate;

    function makeColumns(row) {
      return <td>{row.name} {row.number}</td>
    }

    tableTemplate = data.map((row, i) => {
      return <tr key={i}>{makeColumns(row)}</tr>
    })

    return (
      <table>
        <tbody>
          {tableTemplate}
        </tbody>
      </table>
    )
  }
}

ES5 код ниже

import React, { Component } from 'react'

export default class App extends Component {

  render() {
    var data = [
      {'name': 'Education', 'number': 33},
      {'name': 'Promotion', 'number': 10},
      {'name': 'Events', 'number': 55 }
     ];

    var tableTemplate;

    function makeColumns(row) {
      return <td>{row.name} {row.number}</td>
    }

    tableTemplate = data.map(function(row, i) {
      return <tr key={i}>{makeColumns(row)}</tr>
    });

    return (
      <table>
        <tbody>
          {tableTemplate}
        </tbody>
      </table>
    )
  }
}