code adaptation for API changes; tons changed to kilos

src/components/sections/InputsSection.vue

@@ -80,7 +80,7 @@
           </option>
           <option :value="null" v-else>{{ $t('inputs.cargo-empty') }}</option>
 
-          <option v-for="cargo in store.chosenCar?.cargoList" :value="cargo" :key="cargo.id">
+          <option v-for="cargo in store.chosenCar?.cargoTypes" :value="cargo" :key="cargo.id">
             {{ cargo.id }}
           </option>
         </select>
@@ -216,7 +216,7 @@ export default defineComponent({
 
         this.store.chosenVehicle = type == 'loco' ? this.store.chosenLoco : this.store.chosenCar;
 
-        this.store.chosenCargo = this.store.chosenCar?.cargoList.find((cargo) => cargo.id == this.store.chosenCargo?.id) || null;
+        this.store.chosenCargo = this.store.chosenCar?.cargoTypes.find((cargo) => cargo.id == this.store.chosenCargo?.id) || null;
       });
     },
   },

src/components/sections/StockSection.vue

@@ -23,22 +23,27 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, onMounted, ref } from 'vue';
-import { useStore } from '../../store';
-import StockListTab from '../tabs/StockListTab.vue';
-import StockGeneratorTab from '../tabs/StockGeneratorTab.vue';
-import NumberGeneratorTab from '../tabs/NumberGeneratorTab.vue';
-import WikiListTab from '../tabs/WikiListTab.vue';
+import { computed, onMounted, ref } from "vue";
+import { useStore } from "../../store";
+import StockListTab from "../tabs/StockListTab.vue";
+import StockGeneratorTab from "../tabs/StockGeneratorTab.vue";
+import NumberGeneratorTab from "../tabs/NumberGeneratorTab.vue";
+import WikiListTab from "../tabs/WikiListTab.vue";
 
 const sectionButtonRefs = ref([]);
 
 const store = useStore();
 type SectionMode = typeof store.stockSectionMode;
 
-const sectionModes: SectionMode[] = ['stock-list', 'wiki-list', 'number-generator', 'stock-generator'];
+const sectionModes: SectionMode[] = [
+  "stock-list",
+  "wiki-list",
+  "number-generator",
+  "stock-generator",
+];
 
 onMounted(() => {
-  window.addEventListener('keydown', (e) => {
+  window.addEventListener("keydown", (e) => {
     if (e.target instanceof HTMLInputElement) return;
 
     if (/[1234]/.test(e.key)) {
@@ -51,16 +56,16 @@ onMounted(() => {
 
 const chosenSectionComponent = computed(() => {
   switch (store.stockSectionMode) {
-    case 'stock-list':
+    case "stock-list":
       return StockListTab;
 
-    case 'wiki-list':
+    case "wiki-list":
       return WikiListTab;
 
-    case 'stock-generator':
+    case "stock-generator":
       return StockGeneratorTab;
 
-    case 'number-generator':
+    case "number-generator":
       return NumberGeneratorTab;
 
     default:
@@ -74,7 +79,7 @@ function chooseSection(sectionId: SectionMode) {
 </script>
 
 <style lang="scss">
-@import '../../styles/global.scss';
+@import "../../styles/global.scss";
 
 // Tab change animation
 .tab-change {
@@ -116,14 +121,14 @@ function chooseSection(sectionId: SectionMode) {
       left: 50%;
       transform: translateX(-50%);
 
-      content: '';
+      content: "";
       width: 0;
       height: 2px;
       transition: all 100ms;
       background-color: $accentColor;
     }
 
-    &[data-selected='true']::after {
+    &[data-selected="true"]::after {
       width: 100%;
     }
   }

src/components/sections/TrainImageSection.vue

@@ -18,7 +18,7 @@
       </b>
 
       <div style="color: #ccc">
-        <div>{{ store.chosenVehicle.length }}m | {{ store.chosenVehicle.mass }}t | {{ store.chosenVehicle.maxSpeed }} km/h</div>
+        <div>{{ store.chosenVehicle.length }}m | {{ (store.chosenVehicle.weight / 1000).toFixed(1) }}t | {{ store.chosenVehicle.maxSpeed }} km/h</div>
 
         <div v-if="isLocomotive(store.chosenVehicle)">{{ $t('preview.cabin') }} {{ store.chosenVehicle.cabinType }}</div>