Как перенаправить на другой URL после функции Onclick или OnDelete в Chips?

Question

Как добавить две ссылки от React-router к одному элементу HTML detail Подробно, после того, как пользователь щелкнет по чипу, веб-страница может получить данные со стороны сервера и изменить свой URL. После того, как пользователь нажмет кнопку «Удалить»,веб-страница может показать все данные и восстановить их URL.

<Provider store={store}>
      <BrowserRouter>
        <>
          <CssBaseline />
          <Header />

          <Route path='/' exact component={Home}></Route>
          <Route path='/people' exact component={People}></Route>
          <Route path='/projects' exact component={Projects}></Route>
          <Route path='/publications' exact component={Publications}></Route>

          <Route path='/codeData' component={CodeData}></Route>
          <Route path='/codeData/:category' component={CodeData}></Route>

          <Route path='/classes' exact component={Classes}></Route>
          <Route path='/contact' exact component={Contact}></Route>

          <Footer />
        </>
      </BrowserRouter>
    </Provider>

Я пытался использовать BrowserRouter и Route в App.js

const handleDelete = chipToDelete => () => {
    let count = 0;
    setChipData(chips =>
      chips.map(chip => {
        chip.selected = !chip.key === chipToDelete.key;
        count++;
        if (count === chips.length) {
          props.handleSetInitialCodeData()
        }
        return chip;
      })
    );
  };

  const handleClick = chipToClick => () => {
    setChipData(chips =>
      chips.map(chip => {
        chip.selected = chip.key === chipToClick.key;
        if (chip.selected) {
          props.handleChangeCodeData(chip.label)
        }
        return chip;
      })
    );
  }

  const containerStyles = container()
  const categoriesTypographyStyles = categoriesTypography()
  const chipsStyles = chips()

  return (
    <Box>

      <Box bgcolor={'rgba(0,0,0,.075)'} pt='1rem' pb='1rem' mb='2.5rem'>
        <Container maxWidth="lg" className={containerStyles.root}>
          <Box pt={1} pb={1}>

            <Typography
              className={categoriesTypographyStyles.root} variant='button' display='block'>Categories
          </Typography>


            <Box display="flex" flexWrap="wrap" m='0 0 1em' flexDirection='row'>
              {chipData.map(data => {
                return (
                  <Chip
                    key={data.key}
                    label={data.label}
                    onClick={handleClick(data)}
                    onDelete={data.selected ? handleDelete(data) : null}
                    className={chipsStyles.root}
                  />
                );
              })}
            </Box>

Как настроить не только получение данных с серверастороны, но также изменить URL?