From c92d82ecb1aa784e377acb539bb57f7823a24165 Mon Sep 17 00:00:00 2001
From: Lumi Pakkanen <lumi.pakkanen@gmail.com>
Date: Fri, 26 Apr 2024 11:16:48 +0300
Subject: [PATCH] Pluralize cents property in virtual keyboard key info

---
 src/components/VirtualKeyInfo.vue  |  6 +++---
 src/components/VirtualKeyboard.vue | 12 ++++++------
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/VirtualKeyInfo.vue b/src/components/VirtualKeyInfo.vue
index 947fc78b..2a1591c7 100644
--- a/src/components/VirtualKeyInfo.vue
+++ b/src/components/VirtualKeyInfo.vue
@@ -3,11 +3,11 @@ import { formatHertz, formatExponential, formatCents } from '@/utils'
 
 const props = defineProps<{
   label: string
-  cent: number
+  cents: number
   ratio: number
   frequency: number
   showLabel: boolean
-  showCent: boolean
+  showCents: boolean
   showRatio: boolean
   showFrequency: boolean
 }>()
@@ -18,7 +18,7 @@ const props = defineProps<{
     <div v-if="props.showLabel">
       <strong>{{ props.label }}</strong>
     </div>
-    <div v-if="props.showCent">{{ formatCents(props.cent, 0) }}</div>
+    <div v-if="props.showCents">{{ formatCents(props.cents, 0) }}</div>
     <div v-if="props.showRatio">{{ formatExponential(props.ratio) }}</div>
     <div v-if="props.showFrequency">{{ formatHertz(props.frequency) }}</div>
   </div>
diff --git a/src/components/VirtualKeyboard.vue b/src/components/VirtualKeyboard.vue
index 8d323ff1..c00295f9 100644
--- a/src/components/VirtualKeyboard.vue
+++ b/src/components/VirtualKeyboard.vue
@@ -21,7 +21,7 @@ const props = defineProps<{
   colorMap: ColorMap
   labelMap: LabelMap
   showLabel: boolean
-  showCent: boolean
+  showCents: boolean
   showRatio: boolean
   showFrequency: boolean
 }>()
@@ -32,7 +32,7 @@ type VirtualKey = {
   index: number
   color: string
   frequency: number
-  cent: number
+  cents: number
   ratio: number
   label: string
 }
@@ -48,7 +48,7 @@ const virtualKeys = computed(() => {
       const index = props.baseIndex + x * horizontal + y * vertical
       const color = props.colorMap(index)
       const frequency = props.frequencies[index]
-      const cent = props.centss[index]
+      const cents = props.centss[index]
       const ratio = frequency * inverseBaseFreq
       const label = props.labelMap(index)
       row.push({
@@ -57,7 +57,7 @@ const virtualKeys = computed(() => {
         index,
         color,
         frequency,
-        cent,
+        cents,
         ratio,
         label
       })
@@ -89,11 +89,11 @@ const isMousePressed = ref(false)
       >
         <VirtualKeyInfo
           :label="key.label"
-          :cent="key.cent"
+          :cents="key.cents"
           :ratio="key.ratio"
           :frequency="key.frequency"
           :showLabel="props.showLabel"
-          :showCent="props.showCent"
+          :showCents="props.showCents"
           :showRatio="props.showRatio"
           :showFrequency="props.showFrequency"
         />