From 5ccb28dc648f21368b5d148600b9f9f04c2d8c51 Mon Sep 17 00:00:00 2001
From: Aoife <aoife@spinlock.icu>
Date: Fri, 2 Apr 2021 04:05:08 -0400
Subject: [PATCH] Rename timbre to editor, remove outdated tabs

---
 public/index.html                             |  7 +---
 src/App.js                                    |  4 +-
 src/app/store.js                              | 12 +++---
 src/features/{timbre => editor}/Arpeggio.js   |  0
 src/features/{timbre => editor}/Effects.js    |  0
 src/features/{timbre => editor}/Timbre.js     |  0
 src/features/{timbre => editor}/Vocoder.js    |  0
 src/features/editor/index.js                  | 20 ++++++++++
 .../{timbre => editor}/parameters/Amp.js      |  0
 .../parameters/Arpeggios.js                   |  0
 .../{timbre => editor}/parameters/EG.js       |  0
 .../{timbre => editor}/parameters/Filter.js   |  0
 .../{timbre => editor}/parameters/LFO.js      |  0
 .../{timbre => editor}/parameters/Levels.js   |  0
 .../{timbre => editor}/parameters/Mixer.js    |  0
 .../{timbre => editor}/parameters/ModFX.js    |  0
 .../{timbre => editor}/parameters/Pans.js     |  0
 .../{timbre => editor}/parameters/Patches.js  |  0
 .../{timbre => editor}/parameters/Pitch.js    |  0
 .../{timbre => editor}/parameters/VCO.js      |  0
 .../parameters/parameterSlice.js              |  8 ++--
 .../{timbre => editor}/timbreSlice.js         |  0
 src/features/menu/index.js                    | 14 +++----
 src/features/timbre/timbreSwitcher.js         | 40 -------------------
 24 files changed, 40 insertions(+), 65 deletions(-)
 rename src/features/{timbre => editor}/Arpeggio.js (100%)
 rename src/features/{timbre => editor}/Effects.js (100%)
 rename src/features/{timbre => editor}/Timbre.js (100%)
 rename src/features/{timbre => editor}/Vocoder.js (100%)
 create mode 100644 src/features/editor/index.js
 rename src/features/{timbre => editor}/parameters/Amp.js (100%)
 rename src/features/{timbre => editor}/parameters/Arpeggios.js (100%)
 rename src/features/{timbre => editor}/parameters/EG.js (100%)
 rename src/features/{timbre => editor}/parameters/Filter.js (100%)
 rename src/features/{timbre => editor}/parameters/LFO.js (100%)
 rename src/features/{timbre => editor}/parameters/Levels.js (100%)
 rename src/features/{timbre => editor}/parameters/Mixer.js (100%)
 rename src/features/{timbre => editor}/parameters/ModFX.js (100%)
 rename src/features/{timbre => editor}/parameters/Pans.js (100%)
 rename src/features/{timbre => editor}/parameters/Patches.js (100%)
 rename src/features/{timbre => editor}/parameters/Pitch.js (100%)
 rename src/features/{timbre => editor}/parameters/VCO.js (100%)
 rename src/features/{timbre => editor}/parameters/parameterSlice.js (98%)
 rename src/features/{timbre => editor}/timbreSlice.js (100%)
 delete mode 100644 src/features/timbre/timbreSwitcher.js

diff --git a/public/index.html b/public/index.html
index c8d00fa..e549d31 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,12 +4,7 @@
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <meta name="description" content="Alapatch - A microKORG patch editor" />
     <link rel="preconnect" href="https://fonts.gstatic.com" />
     <link
       href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;0,900;1,400&display=swap"
diff --git a/src/App.js b/src/App.js
index e1a4170..be3b5fd 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,12 +1,12 @@
 import React from 'react';
 import Menu from './features/menu';
-import TimbreSwitcher from './features/timbre/timbreSwitcher';
+import Editor from './features/editor';
 
 function App() {
   return (
     <div className='grid grid-cols-6 grid-rows-1 gap-4 h-screen'>
       <Menu className='col-span-1' />
-      <TimbreSwitcher className='col-span-5' />
+      <Editor className='col-span-5' />
     </div>
   );
 }
diff --git a/src/app/store.js b/src/app/store.js
index e6b2f88..d3a2eb3 100644
--- a/src/app/store.js
+++ b/src/app/store.js
@@ -1,10 +1,10 @@
 import { configureStore } from '@reduxjs/toolkit';
-import timbreReducer from '../features/timbre/timbreSlice';
-import parameterReducer from '../features/timbre/parameters/parameterSlice';
+import timbreReducer from '../features/editor/timbreSlice';
+import parameterReducer from '../features/editor/parameters/parameterSlice';
 
 export default configureStore({
-    reducer: {
-        timbres: timbreReducer,
-        parameters: parameterReducer,
-    },
+  reducer: {
+    timbres: timbreReducer,
+    parameters: parameterReducer,
+  },
 });
diff --git a/src/features/timbre/Arpeggio.js b/src/features/editor/Arpeggio.js
similarity index 100%
rename from src/features/timbre/Arpeggio.js
rename to src/features/editor/Arpeggio.js
diff --git a/src/features/timbre/Effects.js b/src/features/editor/Effects.js
similarity index 100%
rename from src/features/timbre/Effects.js
rename to src/features/editor/Effects.js
diff --git a/src/features/timbre/Timbre.js b/src/features/editor/Timbre.js
similarity index 100%
rename from src/features/timbre/Timbre.js
rename to src/features/editor/Timbre.js
diff --git a/src/features/timbre/Vocoder.js b/src/features/editor/Vocoder.js
similarity index 100%
rename from src/features/timbre/Vocoder.js
rename to src/features/editor/Vocoder.js
diff --git a/src/features/editor/index.js b/src/features/editor/index.js
new file mode 100644
index 0000000..2d610f7
--- /dev/null
+++ b/src/features/editor/index.js
@@ -0,0 +1,20 @@
+import Timbre from './Timbre';
+import Vocoder from './Vocoder';
+import Effects from './Effects';
+import Arpeggio from './Arpeggio';
+import { useSelector } from 'react-redux';
+
+const Editor = () => {
+  const activeTab = useSelector((state) => state.parameters.activeTab);
+  return (
+    <div>
+      {activeTab === 'Timbre1' ? <Timbre id='timbre1' /> : null}
+      {activeTab === 'Timbre2' ? <Timbre id='timbre2' /> : null}
+      {activeTab === 'Vocoder' ? <Vocoder id='vocoder' /> : null}
+      {activeTab === 'Effects' ? <Effects id='effects' /> : null}
+      {activeTab === 'Arpeggio' ? <Arpeggio id='arpeggio' /> : null}
+    </div>
+  );
+};
+
+export default Editor;
diff --git a/src/features/timbre/parameters/Amp.js b/src/features/editor/parameters/Amp.js
similarity index 100%
rename from src/features/timbre/parameters/Amp.js
rename to src/features/editor/parameters/Amp.js
diff --git a/src/features/timbre/parameters/Arpeggios.js b/src/features/editor/parameters/Arpeggios.js
similarity index 100%
rename from src/features/timbre/parameters/Arpeggios.js
rename to src/features/editor/parameters/Arpeggios.js
diff --git a/src/features/timbre/parameters/EG.js b/src/features/editor/parameters/EG.js
similarity index 100%
rename from src/features/timbre/parameters/EG.js
rename to src/features/editor/parameters/EG.js
diff --git a/src/features/timbre/parameters/Filter.js b/src/features/editor/parameters/Filter.js
similarity index 100%
rename from src/features/timbre/parameters/Filter.js
rename to src/features/editor/parameters/Filter.js
diff --git a/src/features/timbre/parameters/LFO.js b/src/features/editor/parameters/LFO.js
similarity index 100%
rename from src/features/timbre/parameters/LFO.js
rename to src/features/editor/parameters/LFO.js
diff --git a/src/features/timbre/parameters/Levels.js b/src/features/editor/parameters/Levels.js
similarity index 100%
rename from src/features/timbre/parameters/Levels.js
rename to src/features/editor/parameters/Levels.js
diff --git a/src/features/timbre/parameters/Mixer.js b/src/features/editor/parameters/Mixer.js
similarity index 100%
rename from src/features/timbre/parameters/Mixer.js
rename to src/features/editor/parameters/Mixer.js
diff --git a/src/features/timbre/parameters/ModFX.js b/src/features/editor/parameters/ModFX.js
similarity index 100%
rename from src/features/timbre/parameters/ModFX.js
rename to src/features/editor/parameters/ModFX.js
diff --git a/src/features/timbre/parameters/Pans.js b/src/features/editor/parameters/Pans.js
similarity index 100%
rename from src/features/timbre/parameters/Pans.js
rename to src/features/editor/parameters/Pans.js
diff --git a/src/features/timbre/parameters/Patches.js b/src/features/editor/parameters/Patches.js
similarity index 100%
rename from src/features/timbre/parameters/Patches.js
rename to src/features/editor/parameters/Patches.js
diff --git a/src/features/timbre/parameters/Pitch.js b/src/features/editor/parameters/Pitch.js
similarity index 100%
rename from src/features/timbre/parameters/Pitch.js
rename to src/features/editor/parameters/Pitch.js
diff --git a/src/features/timbre/parameters/VCO.js b/src/features/editor/parameters/VCO.js
similarity index 100%
rename from src/features/timbre/parameters/VCO.js
rename to src/features/editor/parameters/VCO.js
diff --git a/src/features/timbre/parameters/parameterSlice.js b/src/features/editor/parameters/parameterSlice.js
similarity index 98%
rename from src/features/timbre/parameters/parameterSlice.js
rename to src/features/editor/parameters/parameterSlice.js
index ebd75f5..9e2c3db 100644
--- a/src/features/timbre/parameters/parameterSlice.js
+++ b/src/features/editor/parameters/parameterSlice.js
@@ -425,7 +425,7 @@ const defaultState = {
     },
   },
   unsaved: false,
-  tabIndex: 0,
+  activeTab: 'Timbre1',
 };
 
 const parametersAdapter = createEntityAdapter({});
@@ -442,8 +442,8 @@ const parametersSlice = createSlice({
     parameterFlipUnsaved(state) {
       state.unsaved = !state.unsaved;
     },
-    parameterUpdateIndex(state, action) {
-      state.tabIndex = action.payload;
+    parameterUpdateTab(state, action) {
+      state.activeTab = action.payload;
     },
     parameterFromFile(state, action) {
       parametersAdapter.upsertMany(state, action.payload);
@@ -464,7 +464,7 @@ export const {
   parameterRefreshAll,
   parameterFlipUnsaved,
   parameterFromFile,
-  parameterUpdateIndex,
+  parameterUpdateTab,
 } = parametersSlice.actions;
 
 export default parametersSlice.reducer;
diff --git a/src/features/timbre/timbreSlice.js b/src/features/editor/timbreSlice.js
similarity index 100%
rename from src/features/timbre/timbreSlice.js
rename to src/features/editor/timbreSlice.js
diff --git a/src/features/menu/index.js b/src/features/menu/index.js
index 35d6c61..56af300 100644
--- a/src/features/menu/index.js
+++ b/src/features/menu/index.js
@@ -2,12 +2,12 @@ import { useRef, useState, useEffect } from 'react';
 import { Select } from '../utils/components';
 import { useDispatch, useSelector } from 'react-redux';
 import {
-  parameterUpdateIndex,
+  parameterUpdateTab,
   parameterUpdated,
   parameterFromFile,
   parameterRefreshAll,
   selectEntities,
-} from '../timbre/parameters/parameterSlice'; // probably temporarily here
+} from '../editor/parameters/parameterSlice'; // probably temporarily here
 import { return_store_from_file, return_file_from_store } from '../io';
 
 export default function Menu() {
@@ -106,7 +106,7 @@ export default function Menu() {
           disabled={state.patch.mode === 'Vocoder'}
           className='btn'
           onClick={() => {
-            dispatch(parameterUpdateIndex(0));
+            dispatch(parameterUpdateTab('Timbre1'));
           }}>
           Timbre 1
         </button>
@@ -114,7 +114,7 @@ export default function Menu() {
           disabled={state.patch.mode !== 'Multiple'}
           className='btn'
           onClick={() => {
-            dispatch(parameterUpdateIndex(1));
+            dispatch(parameterUpdateTab('Timbre2'));
           }}>
           Timbre 2
         </button>
@@ -122,21 +122,21 @@ export default function Menu() {
           disabled={state.patch.mode !== 'Vocoder'}
           className='btn'
           onClick={() => {
-            dispatch(parameterUpdateIndex(2));
+            dispatch(parameterUpdateTab('Vocoder'));
           }}>
           Vocoder
         </button>
         <button
           className='btn'
           onClick={() => {
-            dispatch(parameterUpdateIndex(3));
+            dispatch(parameterUpdateTab('Effects'));
           }}>
           Effects
         </button>
         <button
           className='btn'
           onClick={() => {
-            dispatch(parameterUpdateIndex(4));
+            dispatch(parameterUpdateTab('Arpeggio'));
           }}>
           Arpeggio
         </button>
diff --git a/src/features/timbre/timbreSwitcher.js b/src/features/timbre/timbreSwitcher.js
deleted file mode 100644
index 3da6862..0000000
--- a/src/features/timbre/timbreSwitcher.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react';
-import Timbre from './Timbre';
-import Vocoder from './Vocoder';
-import Effects from './Effects';
-import Arpeggio from './Arpeggio';
-import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
-import { useSelector } from 'react-redux';
-
-export default function TimbreSwitcher() {
-  const index = useSelector((state) => state.parameters.tabIndex);
-  return (
-    <div>
-      <Tabs selectedIndex={index} onSelect={() => {}}>
-        <TabList>
-          <Tab>Timbre 1</Tab>
-          <Tab>Timbre 2</Tab>
-          <Tab>Vocoder</Tab>
-          <Tab>Effects</Tab>
-          <Tab>Arpeggio</Tab>
-        </TabList>
-
-        <TabPanel>
-          <Timbre id='timbre1' />
-        </TabPanel>
-        <TabPanel>
-          <Timbre id='timbre2' />
-        </TabPanel>
-        <TabPanel>
-          <Vocoder id='vocoder' />
-        </TabPanel>
-        <TabPanel>
-          <Effects id='effects' />
-        </TabPanel>
-        <TabPanel>
-          <Arpeggio id='arpeggio' />
-        </TabPanel>
-      </Tabs>
-    </div>
-  );
-}