diff --git a/src/panel/ESCSettings.vue b/src/panel/ESCSettings.vue
index 708426ef..3011432f 100644
--- a/src/panel/ESCSettings.vue
+++ b/src/panel/ESCSettings.vue
@@ -18,11 +18,11 @@
                 <h6>{{ m.label }}</h6>
               </div>
               <div class="column is-8">
-                {{ trim(motor.settings[m.pin].LAYOUT) }}
+                {{ trim(motor.settings[mapPin(m)].LAYOUT) }}
                 -
-                {{ trim(motor.settings[m.pin].NAME) }},
-                {{ motor.settings[m.pin].MAIN_REVISION }}.{{
-                  motor.settings[m.pin].SUB_REVISION
+                {{ trim(motor.settings[mapPin(m)].NAME) }},
+                {{ motor.settings[mapPin(m)].MAIN_REVISION }}.{{
+                  motor.settings[mapPin(m)].SUB_REVISION
                 }}
               </div>
 
@@ -32,7 +32,7 @@
               <div class="column is-8 pt-0 mt-0">
                 <input-select
                   :id="'motor-direction-' + m.index"
-                  v-model.number="motor.settings[m.pin].MOTOR_DIRECTION"
+                  v-model.number="motor.settings[mapPin(m)].MOTOR_DIRECTION"
                   :options="motor_direction_options"
                 ></input-select>
               </div>
@@ -71,12 +71,15 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 import { useMotorStore } from "@/store/motor";
+import { useInfoStore } from "@/store/info";
+import semver from "semver";
 
 export default defineComponent({
   name: "ESCSettings",
   setup() {
     return {
       motor: useMotorStore(),
+      info: useInfoStore(),
     };
   },
   data() {
@@ -93,6 +96,12 @@ export default defineComponent({
     trim(str) {
       return str.replace(/#/g, "").replace(/\$/g, " ");
     },
+    mapPin(m) {
+      if (semver.gt(this.info.quic_protocol_semver, "0.2.0")) {
+        return m.index;
+      }
+      return m.pin;
+    },
   },
 });
 </script>