Add page to allow selection of which variables to show in the overlay…

… subtitles log

src/components/ConfigurationMenu.vue

@@ -41,6 +41,7 @@ import ConfigurationAlertsView from '../views/ConfigurationAlertsView.vue'
 import ConfigurationDevelopmentView from '../views/ConfigurationDevelopmentView.vue'
 import ConfigurationGeneralView from '../views/ConfigurationGeneralView.vue'
 import ConfigurationJoystickView from '../views/ConfigurationJoystickView.vue'
+import ConfigurationLogsView from '../views/ConfigurationLogsView.vue'
 
 const store = useMainVehicleStore()
 
@@ -58,6 +59,11 @@ const menus = [
     title: 'Joystick',
     component: ConfigurationJoystickView,
   },
+  {
+    icon: 'mdi-script',
+    title: 'Logs',
+    component: ConfigurationLogsView,
+  },
   {
     icon: 'mdi-bell-ring',
     title: 'Alerts',

src/views/ConfigurationLogsView.vue

@@ -0,0 +1,23 @@
+<template>
+  <BaseConfigurationView>
+    <template #title>Logs configuration</template>
+    <template #content>
+      <h1 class="text-lg font-bold text-slate-600">Variables to be show in the overlay subtitles log:</h1>
+      <div class="flex w-[60%] flex-wrap">
+        <v-checkbox
+          v-for="variable in DatalogVariable"
+          :key="variable"
+          v-model="datalogger.selectedVariablesToShow.value"
+          :label="variable"
+          :value="variable"
+        ></v-checkbox>
+      </div>
+    </template>
+  </BaseConfigurationView>
+</template>
+
+<script setup lang="ts">
+import { datalogger, DatalogVariable } from '@/libs/logging'
+
+import BaseConfigurationView from './BaseConfigurationView.vue'
+</script>