From 3770134ffee11b05c7470bcadb6258064a9a203b Mon Sep 17 00:00:00 2001
From: Muganwa <stevenmuganwa@live.com>
Date: Fri, 8 Apr 2022 00:44:34 +0300
Subject: [PATCH] Fixed custom sounds list issue

When a custom sound was uploaded a long list of unrecognisable sounds.
---
 src/audio-engine/Instruments.js               | 21 ++++++++++++-------
 src/components/dialogs/CreateRoundModal.js    |  1 +
 .../play/layer-settings/LayerInstrument.js    |  6 ++++--
 src/utils/defaultData.js                      |  3 ++-
 4 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/src/audio-engine/Instruments.js b/src/audio-engine/Instruments.js
index 6eee591..21f2332 100644
--- a/src/audio-engine/Instruments.js
+++ b/src/audio-engine/Instruments.js
@@ -96,7 +96,7 @@ const Instruments = {
         options = _.sortBy(options, "label");
         return options;
     },
-    getInstrumentArticulationOptions(instrumentName, userId) {
+    getInstrumentArticulationOptions(instrumentName, userId, instrument) {
         // console.log('getInstrumentArticulationOptions()', instrumentName);
         if (instrumentName !== 'custom') {
             let options = [];
@@ -114,13 +114,20 @@ const Instruments = {
         } else {
             let options = []
             //   console.log('CustomSamples.samples', CustomSamples.samples);
-            for (let [id, sample] of Object.entries(CustomSamples.samples)) {
-                if (sample.createdBy === userId) {
-                    options.push({
-                        name: sample.name,
-                        value: id
-                    })
+            if (instrumentName !== 'custom' && !instrument.sampleId)
+                for (let [id, sample] of Object.entries(CustomSamples.samples)) {
+                    if (sample.createdBy === userId) {
+                        options.push({
+                            name: sample.name,
+                            value: id
+                        })
+                    }
                 }
+            else {
+                options.push({
+                    name: instrument.displayName,
+                    value: instrument.displayName
+                })
             }
             //   console.log('got sample options', options);
             return options
diff --git a/src/components/dialogs/CreateRoundModal.js b/src/components/dialogs/CreateRoundModal.js
index 8f7f1c3..102860a 100644
--- a/src/components/dialogs/CreateRoundModal.js
+++ b/src/components/dialogs/CreateRoundModal.js
@@ -260,6 +260,7 @@ const CreateRoundModal = ({
             urls && Array.isArray(urls) && urls.forEach(async url => {
                 let sample = getDefaultSample(user.id)
                 sample.remoteURL = url
+                sample.displayName = 'Custom'
                 await firebase.createSample(sample)
                 newSamples.push(sample)
                 if (newSamples.length === urls.length) {
diff --git a/src/components/play/layer-settings/LayerInstrument.js b/src/components/play/layer-settings/LayerInstrument.js
index 70eab55..9d2acb5 100644
--- a/src/components/play/layer-settings/LayerInstrument.js
+++ b/src/components/play/layer-settings/LayerInstrument.js
@@ -33,9 +33,10 @@ const LayerInstrument = ({
 }) => {
     const [selectedInstrument, setSelectedInstrument] = React.useState(selectedLayer.instrument.sampler)
     const [selectedArticulation, setSelectedArticulation] = React.useState(selectedLayer.instrument.sample)
+    const [selectedInstrumentFull, setSelectedInstrumentFull] = React.useState(selectedLayer.instrument)
     const dispatch = useDispatch();
     const instrumentOptions = Instruments.getInstrumentOptions(false)
-    const articulationOptions = Instruments.getInstrumentArticulationOptions(selectedInstrument, user.id)
+    const articulationOptions = Instruments.getInstrumentArticulationOptions(selectedInstrument, user.id, selectedInstrumentFull)
     const firebase = useContext(FirebaseContext);
 
     const onInstrumentSelect = async (instrument) => {
@@ -56,9 +57,10 @@ const LayerInstrument = ({
     }
 
     useEffect(() => {
+        setSelectedInstrumentFull(selectedLayer.instrument)
         setSelectedInstrument(selectedLayer.instrument.sampler)
         setSelectedArticulation(selectedLayer.instrument.sample)
-        hideAllLayerInspectorModals();
+        hideAllLayerInspectorModals()
     }, [selectedLayer, hideAllLayerInspectorModals])
 
     const onArticulationSelect = async (articulation) => {
diff --git a/src/utils/defaultData.js b/src/utils/defaultData.js
index 56159a5..aefeeb9 100644
--- a/src/utils/defaultData.js
+++ b/src/utils/defaultData.js
@@ -66,7 +66,8 @@ export const generateLayers = async (samples, userId) => {
                 "instrument": "Sampler",
                 "sampler": 'custom',
                 "sample": articulation.name,
-                "sampleId": sample.id
+                "sampleId": sample.id,
+                "displayName": sample.displayName
             })
             layers.push(layer)
             if (layers.length === samples.length)