diff --git a/src/components/Dashboard/DriverShift/VehiclePicker.tsx b/src/components/Dashboard/DriverShift/VehiclePicker.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..db7092582d1349ef4a398ca9cf841de098859b54
--- /dev/null
+++ b/src/components/Dashboard/DriverShift/VehiclePicker.tsx
@@ -0,0 +1,54 @@
+import React, { FC, useState } from 'react';
+import { useVehicle } from 'hooks/useVehicle';
+import { Button } from '@material-ui/core';
+import { VehicleType } from 'types/VehicleType';
+
+export const VehiclePicker: FC<{
+  setChosenVehicle: React.Dispatch<
+    React.SetStateAction<VehicleType | undefined>
+  >;
+}> = ({ setChosenVehicle }) => {
+  const vehicleList: VehicleType[] = [
+    {
+      owner: 122,
+      user: null,
+      plateNumber: '21133£',
+      carModel: 'Xadsa',
+      wheelchair: false,
+    },
+    {
+      owner: 121,
+      user: null,
+      plateNumber: '21133',
+      carModel: 'Xadsa',
+      wheelchair: false,
+    },
+
+    {
+      owner: 123,
+      user: null,
+      plateNumber: '21133',
+      carModel: 'Xadsa',
+      wheelchair: false,
+    },
+  ];
+
+  const vehicles = useVehicle();
+  return (
+    <div data-testid="VehiclePicker">
+      {vehicleList.length !== 0 ? (
+        vehicleList.map((vehicle, index) => (
+          <Button
+            fullWidth
+            onClick={() => setChosenVehicle(vehicle)}
+            key={vehicle.plateNumber}
+          >
+            🚗{vehicle.carModel} {vehicle.plateNumber}
+          </Button>
+        ))
+      ) : (
+        <h1>No vehicles. Create a vehicle in the vehicle page.</h1>
+      )}
+    </div>
+  );
+};