Added vehicle and owner pages/routes.

client/src/pages/vehicles-detail/vehicles-detail.page.component.jsx

@@ -0,0 +1,9 @@
+import React from "react";
+
+export default function VehicleDetailComponent({ vehicle }) {
+  return (
+    <div>
+      Veh detail <span>{vehicle.v_vin}</span>
+    </div>
+  );
+}

client/src/pages/vehicles-detail/vehicles-detail.page.container.jsx

@@ -0,0 +1,28 @@
+import React from "react";
+import VehicleDetailComponent from "./vehicles-detail.page.component";
+import { useQuery } from "react-apollo";
+import { QUERY_VEHICLE_BY_ID } from "../../graphql/vehicles.queries";
+import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
+import AlertComponent from "../../components/alert/alert.component";
+import { useTranslation } from "react-i18next";
+
+export default function VehicleDetailContainer({ match }) {
+  const { vehId } = match.params;
+  const { t } = useTranslation();
+  const { loading, data, error, refetch } = useQuery(QUERY_VEHICLE_BY_ID, {
+    variables: { id: vehId },
+    fetchPolicy: "network-only"
+  });
+
+  if (loading) return <LoadingSpinner />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
+
+  console.log("vehId", vehId);
+
+  if (data.vehicles[0])
+    return <VehicleDetailComponent vehicle={data.vehicles[0]} />;
+  else
+    return (
+      <AlertComponent message={t("vehicles.errors.noaccess")} type="error" />
+    );
+}