React Switch no está exportado desde ‘react-router-dom’.

Quiero agregar un enrutador en mi página para cambiar entre componentes. Estoy usando Switch para cambiar entre rutas, pero está lanzando un error ya que Switch no está exportado a react-router-dom. Si este es el problema con la versión de React, quiero saber cómo cambiar el código para poder cambiar entre los componentes.

// import React from 'react';
// import Products from './components/Products/Products';

import { commerce } from './lib/commerce';

import { Products, Navbar, Cart } from './components';
import { useState , useEffect } from 'react';
import { BrowserRouter as Router, Switch , Route } from 'react-router-dom';
// import { Cart } from '@chec/commerce.js/features/cart';

const App = () => {

  const [products, setProducts] = useState([]);
  const [cart, setCart] = useState({});

  const fetchProducts = async () => {
    const { data } = await commerce.products.list();
    setProducts(data);
  };

  const fetchCart = async () => {
    setCart(await commerce.cart.retrieve());
  };

  const handleAddToCart = async (productId, quantity) => {
    const item = await commerce.cart.add(productId, quantity);
    setCart(item.cart);
  };

  useEffect(() => {
    fetchProducts();
    fetchCart();
  }, []);

  console.log(cart)

  // console.log(products);
  return (
    <router>
      <div>
        <navbar totalitems="{cart.total_items}/">
        <switch>
          <route exact="" path="/">
            <products products="{products}" onaddtocart="{handleAddToCart}/">
          </products></route>
          <route exact="" path="/cart">
            <cart cart="{cart}/">
          </cart></route>
        </switch>
      </navbar></div>
    </router>
  );
}

export default App;