WIP Vendors list table + order parts.

client/src/pages/manage/manage.page.jsx

@@ -40,6 +40,9 @@ const OwnersDetailContainer = lazy(() =>
   import("../owners-detail/owners-detail.page.container")
 );
 const ShopPage = lazy(() => import("../shop/shop.page.component"));
+const ShopVendorPageContainer = lazy(() =>
+  import("../shop-vendor/shop-vendor.page.container")
+);
 
 const { Header, Content, Footer } = Layout;
 
@@ -118,6 +121,11 @@ export default function Manage({ match }) {
               />
 
               <Route exact path={`${match.path}/shop/`} component={ShopPage} />
+              <Route
+                exact
+                path={`${match.path}/shop/vendors`}
+                component={ShopVendorPageContainer}
+              />
             </Suspense>
           </ErrorBoundary>
         </Content>

client/src/pages/shop-vendor/shop-vendor.page.component.jsx

@@ -0,0 +1,10 @@
+import React from "react";
+import VendorsListContainer from "../../components/vendors-list/vendors-list.container";
+
+export default function ShopVendorPageComponent({ selectedVendorState }) {
+  return (
+    <div>
+      <VendorsListContainer selectedVendorState={selectedVendorState} />
+    </div>
+  );
+}

client/src/pages/shop-vendor/shop-vendor.page.container.jsx

@@ -0,0 +1,17 @@
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import ShopVendorPageComponent from "./shop-vendor.page.component";
+
+export default function ShopVendorPageContainer() {
+  const { t } = useTranslation();
+  useEffect(() => {
+    document.title = t("titles.shop_vendors");
+  }, [t]);
+
+  const selectedVendorState = useState({});
+  return (
+    <div>
+      <ShopVendorPageComponent selectedVendorState={selectedVendorState} />
+    </div>
+  );
+}