From 8652d4c4ae314b4e0ef860efbe36e6b2b9153798 Mon Sep 17 00:00:00 2001
From: Harpo <harpo@harpo.me>
Date: Fri, 13 Sep 2024 17:51:49 -0700
Subject: [PATCH] Fixes transpose indicator

---
 src/Control.js | 11 +----------
 src/ireal.ts   |  2 +-
 2 files changed, 2 insertions(+), 11 deletions(-)

diff --git a/src/Control.js b/src/Control.js
index 0e393c8..ef7f5c0 100644
--- a/src/Control.js
+++ b/src/Control.js
@@ -92,12 +92,6 @@ export const TransposeDown = ({ getState, update }) =>
     '▼'
   )
 
-export const TransposeIndicator = ({ state: { transpose } }) =>
-  m(
-    '.control__indicator',
-    transpose > 0 ? `+${transpose}` : transpose == 0 ? null : transpose
-  )
-
 export const TransposeReset = ({ state: { transpose }, update }) =>
   m(
     'button.control__reset.control__transpose',
@@ -148,11 +142,8 @@ export const Controls = cell =>
   m('.control', {}, [
     PrevSong(cell),
     TransposeUp(cell),
+    TransposeReset(cell),
     TransposeDown(cell),
-    cell.state.transpose != 0 && [
-      TransposeIndicator(cell),
-      TransposeReset(cell),
-    ],
     NextSong(cell),
     // m(
     //   'button.mode',
diff --git a/src/ireal.ts b/src/ireal.ts
index 60cd35e..7b22908 100644
--- a/src/ireal.ts
+++ b/src/ireal.ts
@@ -26,7 +26,7 @@ export const Style = ({ state }) => m('.page__header__style', state.song?.style)
 export const Composer = ({ state }) =>
   m('.page__header__composer', state.song? reverseComposerName(state.song.composer): '')
 
-export const Key = ({ state }) => m('.page__header__key', state.key)
+export const Key = ({ state }) => m('.page__header__key', [state.key, state.transpose ? ` (${state.transpose})` : ''])
 
 export const Bpm = ({ state }) =>
   state.song && state.song.bpm != 0