Refactor camera configuration and overview snapshot hooks; update environment variables and changed camera names to A and B

src/hooks/useGetOverviewSnapshot.ts

@@ -4,8 +4,8 @@ import { CAM_BASE } from "../utils/config";
 
 const apiUrl = CAM_BASE;
 
-async function fetchSnapshot() {
-  const response = await fetch(`${apiUrl}/CameraRear-preview`);
+async function fetchSnapshot(cameraSide: string) {
+  const response = await fetch(`${apiUrl}/${cameraSide}-preview`);
   if (!response.ok) {
     throw new Error("Cannot reach endpoint");
   }
@@ -13,7 +13,7 @@ async function fetchSnapshot() {
   return await response.blob();
 }
 
-export function useGetOverviewSnapshot() {
+export function useGetOverviewSnapshot(side: string) {
   const latestUrlRef = useRef<string | null>(null);
   const canvasRef = useRef<HTMLCanvasElement | null>(null);
   const imageRef = useRef<HTMLImageElement | null>(null);
@@ -38,7 +38,7 @@ export function useGetOverviewSnapshot() {
     isPending,
   } = useQuery({
     queryKey: ["overviewSnapshot"],
-    queryFn: () => fetchSnapshot(),
+    queryFn: () => fetchSnapshot(side),
     refetchOnWindowFocus: false,
     refetchInterval: 250,
   });