core: frontend: vehicle setup: allow filtering setup tabs

core/frontend/src/components/vehiclesetup/Configure.vue

@@ -7,15 +7,15 @@
     >
       <v-tabs-slider />
       <v-tab
-        v-for="page in pages"
+        v-for="page in filtered_pages"
         :key="`title-${page.title}`"
       >
         {{ page.title }}
       </v-tab>
     </v-tabs>
     <v-tabs-items v-model="page_selected">
       <v-tab-item
-        v-for="page in pages"
+        v-for="page in filtered_pages"
         :key="`item-${page.title}`"
       >
         <component :is="page.component" />
@@ -27,13 +27,16 @@
 <script lang="ts">
 import Vue from 'vue'
 
+import autopilot from '@/store/autopilot_manager'
+
 import LightsConfigration from './configuration/lights.vue'
 import ParamSets from './overview/ParamSets.vue'
 
 export interface Item {
   title: string,
   icon: string,
   component: unknown,
+  filter?: () => boolean,
 }
 
 export default Vue.extend({
@@ -51,10 +54,16 @@ export default Vue.extend({
         { title: 'Compass', component: undefined },
         { title: 'Baro', component: undefined },
         { title: 'Gripper', component: undefined },
-        { title: 'Lights', component: LightsConfigration },
+        { title: 'Lights', component: LightsConfigration, filter: () => autopilot.vehicle_type === 'Submarine' },
         { title: 'Camera Mount', component: undefined },
       ] as Item[],
     }
   },
+  computed: {
+    filtered_pages() {
+      // eslint-disable-next-line no-extra-parens
+      return this.pages.filter((page) => (page.filter ? page.filter() : true))
+    },
+  },
 })
 </script>