diff --git a/photon-client/.eslintrc.json b/photon-client/.eslintrc.json
index 0940f4827f..4c789adacc 100644
--- a/photon-client/.eslintrc.json
+++ b/photon-client/.eslintrc.json
@@ -9,6 +9,7 @@
     "quotes": ["error", "double"],
     "comma-dangle": ["error", "never"],
     "semi": ["error", "always"],
-    "eol-last": "error"
+    "eol-last": "error",
+    "object-curly-spacing": ["error", "always"]
   }
 }
diff --git a/photon-client/src/App.vue b/photon-client/src/App.vue
index 1d4d7b744f..6a9d44a655 100644
--- a/photon-client/src/App.vue
+++ b/photon-client/src/App.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import {useStateStore} from "@/stores/StateStore";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {AutoReconnectingWebsocket} from "@/lib/AutoReconnectingWebsocket";
-import {inject, onMounted} from "vue";
+import { useStateStore } from "@/stores/StateStore";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { AutoReconnectingWebsocket } from "@/lib/AutoReconnectingWebsocket";
+import { inject, onMounted } from "vue";
 import PhotonSidebar from "@/components/app/photon-sidebar.vue";
 import PhotonLogView from "@/components/app/photon-log-view.vue";
 import PhotonErrorSnackbar from "@/components/app/photon-error-snackbar.vue";
diff --git a/photon-client/src/components/app/photon-camera-stream.vue b/photon-client/src/components/app/photon-camera-stream.vue
index ce6e24dc67..f0f8fa0c3c 100644
--- a/photon-client/src/components/app/photon-camera-stream.vue
+++ b/photon-client/src/components/app/photon-camera-stream.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import {computed, inject} from "vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {useStateStore} from "@/stores/StateStore";
+import { computed, inject } from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { useStateStore } from "@/stores/StateStore";
 import loadingImage from "@/assets/images/loading.svg";
-import type {StyleValue} from "vue/types/jsx";
+import type { StyleValue } from "vue/types/jsx";
 
 const props = defineProps<{
   streamType: "Raw" | "Processed"
diff --git a/photon-client/src/components/app/photon-error-snackbar.vue b/photon-client/src/components/app/photon-error-snackbar.vue
index b5496cf4b5..6cc42392b2 100644
--- a/photon-client/src/components/app/photon-error-snackbar.vue
+++ b/photon-client/src/components/app/photon-error-snackbar.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {useStateStore} from "@/stores/StateStore";
+import { useStateStore } from "@/stores/StateStore";
 </script>
 
 <template>
diff --git a/photon-client/src/components/app/photon-log-view.vue b/photon-client/src/components/app/photon-log-view.vue
index 5ab294ffd1..454673f74e 100644
--- a/photon-client/src/components/app/photon-log-view.vue
+++ b/photon-client/src/components/app/photon-log-view.vue
@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import {computed, ref, inject} from "vue";
-import {LogLevel, type LogMessage} from "@/types/SettingTypes";
-import {useStateStore} from "@/stores/StateStore";
+import { computed, ref, inject } from "vue";
+import { LogLevel, type LogMessage } from "@/types/SettingTypes";
+import { useStateStore } from "@/stores/StateStore";
 
 const selectedLogLevels = ref<LogLevel[]>([LogLevel.ERROR, LogLevel.WARN, LogLevel.INFO]);
 
 const logs = computed<LogMessage[]>(() => useStateStore().logMessages.filter(message => selectedLogLevels.value.includes(message.level)));
 const showLogModal = computed<boolean>({
   get: () => useStateStore().showLogModal,
-  set: v => useStateStore().$patch({showLogModal: v})
+  set: v => useStateStore().$patch({ showLogModal: v })
 });
 
 const backendAddress = inject<string>("backendAddress");
diff --git a/photon-client/src/components/app/photon-sidebar.vue b/photon-client/src/components/app/photon-sidebar.vue
index 4a69b0ef9a..633ba088e8 100644
--- a/photon-client/src/components/app/photon-sidebar.vue
+++ b/photon-client/src/components/app/photon-sidebar.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import {computed, getCurrentInstance, ref} from "vue";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
-import {useStateStore} from "@/stores/StateStore";
+import { computed, getCurrentInstance, ref } from "vue";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
+import { useStateStore } from "@/stores/StateStore";
 
 const getSidebarFoldedFromLocalStorage = () => {
   const localValue = localStorage.getItem("sidebarFolded");
diff --git a/photon-client/src/components/cameras/CalibrationCard.vue b/photon-client/src/components/cameras/CalibrationCard.vue
index d0d1823369..65ad44d39a 100644
--- a/photon-client/src/components/cameras/CalibrationCard.vue
+++ b/photon-client/src/components/cameras/CalibrationCard.vue
@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import {computed, ref} from "vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {CalibrationBoardTypes} from "@/types/SettingTypes";
+import { computed, ref } from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { CalibrationBoardTypes } from "@/types/SettingTypes";
 import JsPDF from "jspdf";
-import {font as PromptRegular} from "@/assets/fonts/PromptRegular";
+import { font as PromptRegular } from "@/assets/fonts/PromptRegular";
 import MonoLogo from "@/assets/images/logoMono.png";
 import CvSlider from "@/components/common/cv-slider.vue";
-import {useStateStore} from "@/stores/StateStore";
+import { useStateStore } from "@/stores/StateStore";
 import CvSwitch from "@/components/common/cv-switch.vue";
 import CvSelect from "@/components/common/cv-select.vue";
 import CvNumberInput from "@/components/common/cv-number-input.vue";
@@ -27,7 +27,7 @@ const boardType = ref<CalibrationBoardTypes>(CalibrationBoardTypes.Chessboard);
 const importCalibrationFromCalibDB = ref();
 
 const downloadCalibBoard = () => {
-  const doc = new JsPDF({unit: "in", format: "letter"});
+  const doc = new JsPDF({ unit: "in", format: "letter" });
 
   doc.addFileToVFS("Prompt-Regular.tff", PromptRegular);
   doc.addFont("Prompt-Regular.tff", "Prompt-Regular", "normal");
@@ -106,7 +106,7 @@ const openCalibUploadPrompt = () => {
 };
 const readImportedCalibration = (event) => {
   event.target.files[0].text().then(text => {
-    useCameraSettingsStore().importCalibDB({payload: text, filename: event.target.files[0].name})
+    useCameraSettingsStore().importCalibDB({ payload: text, filename: event.target.files[0].name })
         .then((response) => {
           useStateStore().showSnackbarMessage({
             message:  response.data.text || response.data,
diff --git a/photon-client/src/components/cameras/CameraSettingsCard.vue b/photon-client/src/components/cameras/CameraSettingsCard.vue
index d8d5d86444..785c76f285 100644
--- a/photon-client/src/components/cameras/CameraSettingsCard.vue
+++ b/photon-client/src/components/cameras/CameraSettingsCard.vue
@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import CvSelect from "@/components/common/cv-select.vue";
 import CvNumberInput from "@/components/common/cv-number-input.vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {useStateStore} from "@/stores/StateStore";
-import {ref} from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { useStateStore } from "@/stores/StateStore";
+import { ref } from "vue";
 
 const currentFov = ref(useCameraSettingsStore().currentCameraSettings.fov.value);
 
 const saveCameraSettings = () => {
-  useCameraSettingsStore().updateCameraSettings({fov: currentFov.value}, true)
+  useCameraSettingsStore().updateCameraSettings({ fov: currentFov.value }, true)
       .then((response) => {
         useStateStore().showSnackbarMessage({
           color: "success",
diff --git a/photon-client/src/components/common/cv-input.vue b/photon-client/src/components/common/cv-input.vue
index 9f82796f53..e4b2976d01 100644
--- a/photon-client/src/components/common/cv-input.vue
+++ b/photon-client/src/components/common/cv-input.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import TooltippedLabel from "@/components/common/cv-tooltipped-label.vue";
 
 const props = withDefaults(defineProps<{
@@ -30,7 +30,7 @@ const localValue = computed({
 });
 
 
-const handleKeydown = ({key}) => {
+const handleKeydown = ({ key }) => {
   switch (key) {
     case "Enter":
       if(!(props.rules || []).some(v => v(localValue.value) === false || typeof v(localValue.value) === "string")) {
diff --git a/photon-client/src/components/common/cv-radio.vue b/photon-client/src/components/common/cv-radio.vue
index 55cccff121..be5289f7cd 100644
--- a/photon-client/src/components/common/cv-radio.vue
+++ b/photon-client/src/components/common/cv-radio.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import TooltippedLabel from "@/components/common/cv-tooltipped-label.vue";
 
 const props = withDefaults(defineProps<{
diff --git a/photon-client/src/components/common/cv-range-slider.vue b/photon-client/src/components/common/cv-range-slider.vue
index 287ad660c2..a5706fe9fb 100644
--- a/photon-client/src/components/common/cv-range-slider.vue
+++ b/photon-client/src/components/common/cv-range-slider.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import TooltippedLabel from "@/components/common/cv-tooltipped-label.vue";
 
 const props = withDefaults(defineProps<{
diff --git a/photon-client/src/components/common/cv-select.vue b/photon-client/src/components/common/cv-select.vue
index 5bed0a0572..0db58182ff 100644
--- a/photon-client/src/components/common/cv-select.vue
+++ b/photon-client/src/components/common/cv-select.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import TooltippedLabel from "@/components/common/cv-tooltipped-label.vue";
 
 interface SelectItem {
@@ -36,7 +36,7 @@ const items = computed<SelectItem[]>(() => {
   if((props.items[0] as SelectItem).name) {
     return props.items as SelectItem[];
   }
-  return props.items.map((v, i) => ({name: v, value: i}));
+  return props.items.map((v, i) => ({ name: v, value: i }));
 });
 </script>
 
diff --git a/photon-client/src/components/common/cv-slider.vue b/photon-client/src/components/common/cv-slider.vue
index 05acd90599..c31ac04281 100644
--- a/photon-client/src/components/common/cv-slider.vue
+++ b/photon-client/src/components/common/cv-slider.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import TooltippedLabel from "@/components/common/cv-tooltipped-label.vue";
 
 const props = withDefaults(defineProps<{
diff --git a/photon-client/src/components/dashboard/CameraAndPipelineSelectCard.vue b/photon-client/src/components/dashboard/CameraAndPipelineSelectCard.vue
index 5f2c1779d7..6775354875 100644
--- a/photon-client/src/components/dashboard/CameraAndPipelineSelectCard.vue
+++ b/photon-client/src/components/dashboard/CameraAndPipelineSelectCard.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import CvSelect from "@/components/common/cv-select.vue";
-import {useStateStore} from "@/stores/StateStore";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {WebsocketPipelineType} from "@/types/WebsocketDataTypes";
-import {computed, ref} from "vue";
+import { useStateStore } from "@/stores/StateStore";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { WebsocketPipelineType } from "@/types/WebsocketDataTypes";
+import { computed, ref } from "vue";
 import CvIcon from "@/components/common/cv-icon.vue";
 import CvInput from "@/components/common/cv-input.vue";
 
@@ -54,13 +54,13 @@ const cancelCameraNameEdit = () => {
 };
 
 const pipelineNamesWrapper = computed<{name: string, value: number}[]>(() => {
-  const pipelineNames = useCameraSettingsStore().pipelineNames.map((name, index) => ({name: name, value: index}));
+  const pipelineNames = useCameraSettingsStore().pipelineNames.map((name, index) => ({ name: name, value: index }));
 
   if(useCameraSettingsStore().isDriverMode) {
-    pipelineNames.push({name: "Driver Mode", value: WebsocketPipelineType.DriverMode});
+    pipelineNames.push({ name: "Driver Mode", value: WebsocketPipelineType.DriverMode });
   }
   if(useCameraSettingsStore().isCalibrationMode) {
-    pipelineNames.push({name: "3D Calibration Mode", value: WebsocketPipelineType.Calib3d});
+    pipelineNames.push({ name: "3D Calibration Mode", value: WebsocketPipelineType.Calib3d });
   }
 
   return pipelineNames;
diff --git a/photon-client/src/components/dashboard/CamerasCard.vue b/photon-client/src/components/dashboard/CamerasCard.vue
index ab6c0d433e..72a1e9edac 100644
--- a/photon-client/src/components/dashboard/CamerasCard.vue
+++ b/photon-client/src/components/dashboard/CamerasCard.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import {computed} from "vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
-import {useStateStore} from "@/stores/StateStore";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
-import {PipelineType} from "@/types/PipelineTypes";
+import { computed } from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
+import { useStateStore } from "@/stores/StateStore";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
+import { PipelineType } from "@/types/PipelineTypes";
 import PhotonCameraStream from "@/components/app/photon-camera-stream.vue";
 
 defineProps<{
diff --git a/photon-client/src/components/dashboard/PipelineConfigCard.vue b/photon-client/src/components/dashboard/PipelineConfigCard.vue
index aeb8c260e4..7ef6cac3b0 100644
--- a/photon-client/src/components/dashboard/PipelineConfigCard.vue
+++ b/photon-client/src/components/dashboard/PipelineConfigCard.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import type {Component} from "vue";
-import {computed, ref} from "vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
+import type { Component } from "vue";
+import { computed, ref } from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
 
 import InputTab from "@/components/dashboard/PipelineConfigTabs/InputTab.vue";
 import ThresholdTab from "@/components/dashboard/PipelineConfigTabs/ThresholdTab.vue";
@@ -12,7 +12,7 @@ import OutputTab from "@/components/dashboard/PipelineConfigTabs/OutputTab.vue";
 import TargetsTab from "@/components/dashboard/PipelineConfigTabs/TargetsTab.vue";
 import PnPTab from "@/components/dashboard/PipelineConfigTabs/PnPTab.vue";
 import Map3DTab from "@/components/dashboard/PipelineConfigTabs/Map3DTab.vue";
-import {WebsocketPipelineType} from "@/types/WebsocketDataTypes";
+import { WebsocketPipelineType } from "@/types/WebsocketDataTypes";
 
 interface ConfigOption {
   tabName: string,
diff --git a/photon-client/src/components/dashboard/PipelineConfigTabs/InputTab.vue b/photon-client/src/components/dashboard/PipelineConfigTabs/InputTab.vue
index 65db0cc211..f24c04a3d8 100644
--- a/photon-client/src/components/dashboard/PipelineConfigTabs/InputTab.vue
+++ b/photon-client/src/components/dashboard/PipelineConfigTabs/InputTab.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import CvSlider from "@/components/common/cv-slider.vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
 import CvSwitch from "@/components/common/cv-switch.vue";
 import CvSelect from "@/components/common/cv-select.vue";
-import {computed} from "vue";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
+import { computed } from "vue";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
 
 // Due to something with libcamera or something else IDK much about, the 90° rotations need to be disabled if the libcamera drivers are being used.
-const cameraRotations = computed(() => ["Normal","90° CW","180°","90° CCW"].map((v, i) => ({name: v, value: i, disabled: useSettingsStore().gpuAccelerationEnabled ?  [1, 3].includes(i) : false})));
+const cameraRotations = computed(() => ["Normal","90° CW","180°","90° CCW"].map((v, i) => ({ name: v, value: i, disabled: useSettingsStore().gpuAccelerationEnabled ?  [1, 3].includes(i) : false })));
 
 const streamDivisors = [1, 2, 4, 6];
 const getFilteredStreamDivisors = (): number[] => {
@@ -22,13 +22,13 @@ const getNumberOfSkippedDivisors = () => streamDivisors.length - getFilteredStre
 
 const cameraResolutions = computed(() => useCameraSettingsStore().currentCameraSettings.validVideoFormats.map(f => `${f.resolution.width} X ${f.resolution.height} at ${f.fps} FPS, ${f.pixelFormat}`));
 const handleResolutionChange = (value: number) => {
-  useCameraSettingsStore().changeCurrentPipelineSetting({cameraVideoModeIndex: value}, false);
+  useCameraSettingsStore().changeCurrentPipelineSetting({ cameraVideoModeIndex: value }, false);
 
-  useCameraSettingsStore().changeCurrentPipelineSetting({streamingFrameDivisor: getNumberOfSkippedDivisors()}, false);
+  useCameraSettingsStore().changeCurrentPipelineSetting({ streamingFrameDivisor: getNumberOfSkippedDivisors() }, false);
   useCameraSettingsStore().currentPipelineSettings.streamingFrameDivisor = 0;
 
   if(!useCameraSettingsStore().isCurrentVideoFormatCalibrated) {
-    useCameraSettingsStore().changeCurrentPipelineSetting({solvePNPEnabled: false}, true);
+    useCameraSettingsStore().changeCurrentPipelineSetting({ solvePNPEnabled: false }, true);
   }
 };
 
@@ -39,7 +39,7 @@ const streamResolutions = computed(() => {
       .map(x => `${Math.floor(currentResolution.width / x)} X ${Math.floor(currentResolution.height / x)}`);
 });
 const handleStreamResolutionChange = (value: number) => {
-  useCameraSettingsStore().changeCurrentPipelineSetting({streamingFrameDivisor: value + getNumberOfSkippedDivisors()}, false);
+  useCameraSettingsStore().changeCurrentPipelineSetting({ streamingFrameDivisor: value + getNumberOfSkippedDivisors() }, false);
 };
 </script>
 
diff --git a/photon-client/src/components/dashboard/StreamConfigCard.vue b/photon-client/src/components/dashboard/StreamConfigCard.vue
index ef7b76717e..413c54d9fd 100644
--- a/photon-client/src/components/dashboard/StreamConfigCard.vue
+++ b/photon-client/src/components/dashboard/StreamConfigCard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import {computed} from "vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
+import { computed } from "vue";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
 
 const props = defineProps<{
   // TODO fully update v-model usage in custom components on Vue3 update
@@ -21,7 +21,7 @@ const processingMode = computed<number>({
   get: () => useCameraSettingsStore().currentPipelineSettings.solvePNPEnabled ? 1: 0,
   set: v => {
     if(useCameraSettingsStore().isCurrentVideoFormatCalibrated) {
-      useCameraSettingsStore().changeCurrentPipelineSetting({solvePNPEnabled: v === 1}, true);
+      useCameraSettingsStore().changeCurrentPipelineSetting({ solvePNPEnabled: v === 1 }, true);
     }
   }
 });
diff --git a/photon-client/src/components/settings/DeviceControlCard.vue b/photon-client/src/components/settings/DeviceControlCard.vue
index 35eedf50c4..5b54ccd06f 100644
--- a/photon-client/src/components/settings/DeviceControlCard.vue
+++ b/photon-client/src/components/settings/DeviceControlCard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import {inject, ref} from "vue";
-import {useStateStore} from "@/stores/StateStore";
+import { inject, ref } from "vue";
+import { useStateStore } from "@/stores/StateStore";
 import CvSelect from "@/components/common/cv-select.vue";
 import axios from "axios";
 
@@ -62,14 +62,14 @@ const openOfflineUpdatePrompt = () => {
   offlineUpdate.value.click();
 };
 const handleOfflineUpdate = (event) => {
-  useStateStore().showSnackbarMessage({message: "New Software Upload in Progress...", color: "secondary", timeout: -1});
+  useStateStore().showSnackbarMessage({ message: "New Software Upload in Progress...", color: "secondary", timeout: -1 });
 
   const formData = new FormData();
   formData.append("jarData", event.target.files[0]);
 
   axios.post("/utils/offlineUpdate", formData, {
     headers: { "Content-Type": "multipart/form-data" },
-    onUploadProgress: function({progress})  {
+    onUploadProgress: function({ progress })  {
       const uploadPercentage = ((progress || 0) * 100.0);
       if (uploadPercentage < 99.5) {
         useStateStore().showSnackbarMessage({
diff --git a/photon-client/src/components/settings/LightingControlCard.vue b/photon-client/src/components/settings/LightingControlCard.vue
index 7fe351b11f..02f850d121 100644
--- a/photon-client/src/components/settings/LightingControlCard.vue
+++ b/photon-client/src/components/settings/LightingControlCard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import CvSlider from "@/components/common/cv-slider.vue";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
 </script>
 
 <template>
diff --git a/photon-client/src/components/settings/MetricsCard.vue b/photon-client/src/components/settings/MetricsCard.vue
index 9e782de770..72edbb0c7a 100644
--- a/photon-client/src/components/settings/MetricsCard.vue
+++ b/photon-client/src/components/settings/MetricsCard.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
 import { onMounted } from "vue";
-import {useStateStore} from "@/stores/StateStore";
+import { useStateStore } from "@/stores/StateStore";
 
 onMounted(() => {
   // TODO should this be silent?
diff --git a/photon-client/src/components/settings/NetworkingCard.vue b/photon-client/src/components/settings/NetworkingCard.vue
index 3fd00758bb..c3b69b3273 100644
--- a/photon-client/src/components/settings/NetworkingCard.vue
+++ b/photon-client/src/components/settings/NetworkingCard.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
-import {ref} from "vue";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
+import { ref } from "vue";
 import CvInput from "@/components/common/cv-input.vue";
 import CvRadio from "@/components/common/cv-radio.vue";
 import CvSwitch from "@/components/common/cv-switch.vue";
-import {NetworkConnectionType} from "@/types/SettingTypes";
-import {useStateStore} from "@/stores/StateStore";
+import { NetworkConnectionType } from "@/types/SettingTypes";
+import { useStateStore } from "@/stores/StateStore";
 
 const settingsValid = ref(true);
 const isValidNetworkTablesIP = (v: string | undefined): boolean => {
diff --git a/photon-client/src/lib/AutoReconnectingWebsocket.ts b/photon-client/src/lib/AutoReconnectingWebsocket.ts
index feb7ee309f..5674b08bd6 100644
--- a/photon-client/src/lib/AutoReconnectingWebsocket.ts
+++ b/photon-client/src/lib/AutoReconnectingWebsocket.ts
@@ -1,5 +1,5 @@
-import {decode, encode} from "@msgpack/msgpack";
-import type {IncomingWebsocketData} from "@/types/WebsocketDataTypes";
+import { decode, encode } from "@msgpack/msgpack";
+import type { IncomingWebsocketData } from "@/types/WebsocketDataTypes";
 
 /**
  * {@link WebSocket} wrapper class that automatically reconnects to the provided host address if the connection was closed by the remote host or a connection failure.
diff --git a/photon-client/src/plugins/vuetify.ts b/photon-client/src/plugins/vuetify.ts
index 4c0e651656..6345670ff8 100644
--- a/photon-client/src/plugins/vuetify.ts
+++ b/photon-client/src/plugins/vuetify.ts
@@ -2,7 +2,7 @@ import Vue from "vue";
 import Vuetify from "vuetify";
 import "vuetify/dist/vuetify.min.css";
 import "@mdi/font/css/materialdesignicons.css";
-import type {VuetifyThemeVariant} from "vuetify/types/services/theme";
+import type { VuetifyThemeVariant } from "vuetify/types/services/theme";
 
 Vue.use(Vuetify);
 
diff --git a/photon-client/src/stores/StateStore.ts b/photon-client/src/stores/StateStore.ts
index a2ab20c756..a124d12b7d 100644
--- a/photon-client/src/stores/StateStore.ts
+++ b/photon-client/src/stores/StateStore.ts
@@ -1,7 +1,7 @@
-import {defineStore} from "pinia";
-import type {LogMessage} from "@/types/SettingTypes";
-import type {AutoReconnectingWebsocket} from "@/lib/AutoReconnectingWebsocket";
-import type {PipelineResult} from "@/types/PhotonTrackingTypes";
+import { defineStore } from "pinia";
+import type { LogMessage } from "@/types/SettingTypes";
+import type { AutoReconnectingWebsocket } from "@/lib/AutoReconnectingWebsocket";
+import type { PipelineResult } from "@/types/PhotonTrackingTypes";
 import type {
     WebsocketCalibrationData,
     WebsocketLogMessage,
@@ -112,7 +112,7 @@ export const useStateStore = defineStore("state", {
             }
         },
         hideSnackbarMessage() {
-            this.snackbarData = {show: false, timeout: 0, color: "error", message: ""};
+            this.snackbarData = { show: false, timeout: 0, color: "error", message: "" };
         }
     }
 });
diff --git a/photon-client/src/stores/settings/CameraSettingsStore.ts b/photon-client/src/stores/settings/CameraSettingsStore.ts
index c1333077a9..f077a06e94 100644
--- a/photon-client/src/stores/settings/CameraSettingsStore.ts
+++ b/photon-client/src/stores/settings/CameraSettingsStore.ts
@@ -1,4 +1,4 @@
-import {defineStore} from "pinia";
+import { defineStore } from "pinia";
 import type {
     CalibrationBoardTypes,
     CameraCalibrationResult,
@@ -6,17 +6,17 @@ import type {
     RobotOffsetType,
     VideoFormat
 } from "@/types/SettingTypes";
-import {PlaceholderCameraSettings} from "@/types/SettingTypes";
-import {useStateStore} from "@/stores/StateStore";
-import type {WebsocketCameraSettingsUpdate} from "@/types/WebsocketDataTypes";
-import {WebsocketPipelineType} from "@/types/WebsocketDataTypes";
+import { PlaceholderCameraSettings } from "@/types/SettingTypes";
+import { useStateStore } from "@/stores/StateStore";
+import type { WebsocketCameraSettingsUpdate } from "@/types/WebsocketDataTypes";
+import { WebsocketPipelineType } from "@/types/WebsocketDataTypes";
 import type {
     ActivePipelineSettings,
     ConfigurableAprilTagPipelineSettings,
     ConfigurableColoredShapePipelineSettings,
     ConfigurableReflectivePipelineSettings
 } from "@/types/PipelineTypes";
-import {PipelineType} from "@/types/PipelineTypes";
+import { PipelineType } from "@/types/PipelineTypes";
 import axios from "axios";
 
 interface CameraSettingsStore {
@@ -83,7 +83,7 @@ export const useCameraSettingsStore = defineStore("cameraSettings", {
                 },
                 validVideoFormats: Object.keys(d.videoFormatList)
                     .sort((a, b) => parseInt(a) - parseInt(b)) // TODO, does the backend already return this sorted
-                    .map<VideoFormat>((k, i) => ({...d.videoFormatList[k], index: i})),
+                    .map<VideoFormat>((k, i) => ({ ...d.videoFormatList[k], index: i })),
                 completeCalibrations: d.calibrations.map<CameraCalibrationResult>(calib => ({
                     resolution: {
                         height: calib.height,
@@ -292,7 +292,7 @@ export const useCameraSettingsStore = defineStore("cameraSettings", {
          * @return HTTP request promise to the backend
          */
         endPnPCalibration(cameraIndex: number = useStateStore().currentCameraIndex) {
-           return axios.post("/calibration/end", {index: cameraIndex});
+           return axios.post("/calibration/end", { index: cameraIndex });
         },
         /**
          * Import calibration data that was computed using CalibDB.
@@ -305,7 +305,7 @@ export const useCameraSettingsStore = defineStore("cameraSettings", {
                 ...data,
                 cameraIndex: cameraIndex
             };
-            return axios.post("/calibration/importFromCalibDB", payload, { headers: { "Content-Type": "text/plain" }});
+            return axios.post("/calibration/importFromCalibDB", payload, { headers: { "Content-Type": "text/plain" } });
         },
         /**
          * Take a snapshot for the calibration processes
diff --git a/photon-client/src/stores/settings/GeneralSettingsStore.ts b/photon-client/src/stores/settings/GeneralSettingsStore.ts
index beedd49fcb..bcf648c7dc 100644
--- a/photon-client/src/stores/settings/GeneralSettingsStore.ts
+++ b/photon-client/src/stores/settings/GeneralSettingsStore.ts
@@ -1,14 +1,14 @@
-import {defineStore} from "pinia";
+import { defineStore } from "pinia";
 import type {
     GeneralSettings,
     LightingSettings,
     MetricData,
     NetworkSettings
 } from "@/types/SettingTypes";
-import {NetworkConnectionType} from "@/types/SettingTypes";
-import {useStateStore} from "@/stores/StateStore";
+import { NetworkConnectionType } from "@/types/SettingTypes";
+import { useStateStore } from "@/stores/StateStore";
 import axios from "axios";
-import type {WebsocketSettingsUpdate} from "@/types/WebsocketDataTypes";
+import type { WebsocketSettingsUpdate } from "@/types/WebsocketDataTypes";
 
 interface GeneralSettingsStore {
     general: GeneralSettings,
diff --git a/photon-client/src/types/PipelineTypes.ts b/photon-client/src/types/PipelineTypes.ts
index d22ad7f48b..2f2bba1904 100644
--- a/photon-client/src/types/PipelineTypes.ts
+++ b/photon-client/src/types/PipelineTypes.ts
@@ -61,17 +61,17 @@ export const DefaultPipelineSettings: PipelineSettings = {
     streamingFrameDivisor: 0,
     offsetDualPointBArea: 0,
     contourGroupingMode: 0,
-    hsvValue: {"first": 50, "second": 255},
+    hsvValue: { "first": 50, "second": 255 },
     cameraBlueGain: 20,
     cameraRedGain: 11,
     cornerDetectionSideCount: 4,
-    contourRatio: {"first": 0, "second": 20},
+    contourRatio: { "first": 0, "second": 20 },
     contourTargetOffsetPointEdge: 0,
     pipelineNickname: "Placeholder Pipeline",
     inputImageRotationMode: 0,
-    contourArea: {"first": 0, "second": 100},
+    contourArea: { "first": 0, "second": 100 },
     solvePNPEnabled: false,
-    contourFullness: {"first": 0, "second": 100},
+    contourFullness: { "first": 0, "second": 100 },
     pipelineIndex: 0,
     inputShouldShow: false,
     cameraAutoExposure: false,
@@ -80,19 +80,19 @@ export const DefaultPipelineSettings: PipelineSettings = {
     cornerDetectionUseConvexHulls: true,
     outputShouldShow: true,
     outputShouldDraw: true,
-    offsetDualPointA: {"x": 0, "y": 0},
-    offsetDualPointB: {"x": 0, "y": 0},
-    hsvHue: {"first": 50, "second": 180},
+    offsetDualPointA: { "x": 0, "y": 0 },
+    offsetDualPointB: { "x": 0, "y": 0 },
+    hsvHue: { "first": 50, "second": 180 },
     hueInverted: false,
     contourSortMode: 0,
-    offsetSinglePoint: {"x": 0, "y": 0},
+    offsetSinglePoint: { "x": 0, "y": 0 },
     cameraBrightness: 50,
     offsetDualPointAArea: 0,
     cornerDetectionExactSideCount: false,
     cameraVideoModeIndex: 0,
     cornerDetectionStrategy: 0,
     cornerDetectionAccuracyPercentage: 10,
-    hsvSaturation: {"first": 50, "second": 255},
+    hsvSaturation: { "first": 50, "second": 255 },
     contourIntersection: 1,
 
     // These settings will be overridden by different pipeline types
@@ -151,11 +151,11 @@ export const DefaultColoredShapePipelineSettings: ColoredShapePipelineSettings =
     cameraCalibration: null,
     dilate: false,
     circleAccuracy: 20,
-    contourRadius: {"first": 0, "second": 100},
+    contourRadius: { "first": 0, "second": 100 },
     circleDetectThreshold: 5,
     accuracyPercentage: 10,
     contourShape: 2,
-    contourPerimeter: {"first": 0, "second": 1.7976931348623157e+308},
+    contourPerimeter: { "first": 0, "second": 1.7976931348623157e+308 },
     minDist: 20,
     maxCannyThresh: 90
 };
diff --git a/photon-client/src/types/SettingTypes.ts b/photon-client/src/types/SettingTypes.ts
index ff3f94b520..87e5731076 100644
--- a/photon-client/src/types/SettingTypes.ts
+++ b/photon-client/src/types/SettingTypes.ts
@@ -1,4 +1,4 @@
-import {type ActivePipelineSettings, DefaultAprilTagPipelineSettings} from "@/types/PipelineTypes";
+import { type ActivePipelineSettings, DefaultAprilTagPipelineSettings } from "@/types/PipelineTypes";
 
 export interface GeneralSettings {
     version?: string
@@ -115,17 +115,17 @@ export const PlaceholderCameraSettings: CameraSettings = {
     },
     validVideoFormats: [
         {
-            resolution: {width: 1920, height: 1080},
+            resolution: { width: 1920, height: 1080 },
             fps: 60,
             pixelFormat: "RGB"
         },
         {
-            resolution: {width: 1280, height: 720},
+            resolution: { width: 1280, height: 720 },
             fps: 60,
             pixelFormat: "RGB"
         },
         {
-            resolution: {width: 640, height: 480},
+            resolution: { width: 640, height: 480 },
             fps: 30,
             pixelFormat: "RGB"
         }
diff --git a/photon-client/src/types/WebsocketDataTypes.ts b/photon-client/src/types/WebsocketDataTypes.ts
index ddfeb4a451..b21b1a4f5f 100644
--- a/photon-client/src/types/WebsocketDataTypes.ts
+++ b/photon-client/src/types/WebsocketDataTypes.ts
@@ -1,5 +1,5 @@
-import type {GeneralSettings, LightingSettings, MetricData, NetworkSettings} from "@/types/SettingTypes";
-import type {ActivePipelineSettings} from "@/types/PipelineTypes";
+import type { GeneralSettings, LightingSettings, MetricData, NetworkSettings } from "@/types/SettingTypes";
+import type { ActivePipelineSettings } from "@/types/PipelineTypes";
 
 export interface WebsocketLogMessage {
     logMessage: {
diff --git a/photon-client/src/views/DashboardView.vue b/photon-client/src/views/DashboardView.vue
index e18260cece..96c9478ff3 100644
--- a/photon-client/src/views/DashboardView.vue
+++ b/photon-client/src/views/DashboardView.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import {computed} from "vue";
+import { computed } from "vue";
 import CamerasCard from "@/components/dashboard/CamerasCard.vue";
 import PipelineConfigCard from "@/components/dashboard/CameraAndPipelineSelectCard.vue";
 import StreamConfigCard from "@/components/dashboard/StreamConfigCard.vue";
 import OperationConfigCard from "@/components/dashboard/PipelineConfigCard.vue";
-import {useCameraSettingsStore} from "@/stores/settings/CameraSettingsStore";
+import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
 
 const cameraViewType = computed<number[]>({
   get: (): number[] => {
diff --git a/photon-client/src/views/GeneralSettingsView.vue b/photon-client/src/views/GeneralSettingsView.vue
index b2aff730a3..f88de44aa7 100644
--- a/photon-client/src/views/GeneralSettingsView.vue
+++ b/photon-client/src/views/GeneralSettingsView.vue
@@ -3,7 +3,7 @@ import MetricsCard from "@/components/settings/MetricsCard.vue";
 import DeviceControlCard from "@/components/settings/DeviceControlCard.vue";
 import NetworkingCard from "@/components/settings/NetworkingCard.vue";
 import LightingControlCard from "@/components/settings/LightingControlCard.vue";
-import {useSettingsStore} from "@/stores/settings/GeneralSettingsStore";
+import { useSettingsStore } from "@/stores/settings/GeneralSettingsStore";
 </script>
 
 <template>
diff --git a/photon-client/vite.config.ts b/photon-client/vite.config.ts
index 3cd7065bdd..127f388f7a 100644
--- a/photon-client/vite.config.ts
+++ b/photon-client/vite.config.ts
@@ -3,7 +3,7 @@ import { fileURLToPath, URL } from "node:url";
 import { defineConfig } from "vite";
 import Vue2 from "@vitejs/plugin-vue2";
 import Components from "unplugin-vue-components/vite";
-import {VuetifyResolver} from "unplugin-vue-components/resolvers";
+import { VuetifyResolver } from "unplugin-vue-components/resolvers";
 
 export default defineConfig({
   base: "./",