From 60d49536f87480c60f6e7b768452d3c0a9331f02 Mon Sep 17 00:00:00 2001
From: svetlagasheva <svetulka_24@mail.bg>
Date: Wed, 27 Nov 2019 13:32:57 +0200
Subject: [PATCH] dataset attribute instead of data-name used for
 Multiselect/ColorInput

---
 src/routes/Settings/SectionsList/SectionsList.js | 8 ++++----
 src/routes/Settings/Settings.js                  | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/routes/Settings/SectionsList/SectionsList.js b/src/routes/Settings/SectionsList/SectionsList.js
index d56de298a..8ff5fe581 100644
--- a/src/routes/Settings/SectionsList/SectionsList.js
+++ b/src/routes/Settings/SectionsList/SectionsList.js
@@ -165,11 +165,11 @@ const SectionsList = React.forwardRef(({ className, sections, preferences, onPre
                                             <React.Fragment>
                                                 <div className={classnames(styles['input-container'], styles['select-container'])}>
                                                     <div className={styles['input-header']}>Caching</div>
-                                                    <Multiselect options={cachingOptions} selected={[preferences.streaming.cacheSize]} data-name={'cacheSize'} className={styles['dropdown']} onSelect={updateStreamingDropdown} />
+                                                    <Multiselect options={cachingOptions} selected={[preferences.streaming.cacheSize]} dataset={{ name: 'cacheSize' }} className={styles['dropdown']} onSelect={updateStreamingDropdown} />
                                                 </div>
                                                 <div className={classnames(styles['input-container'], styles['select-container'])}>
                                                     <div className={styles['input-header']}>Torrent Profile</div>
-                                                    <Multiselect options={streamingProfiles} selected={[preferences.streaming.profile]} data-name={'profile'} className={styles['dropdown']} onSelect={updateStreamingDropdown} />
+                                                    <Multiselect options={streamingProfiles} selected={[preferences.streaming.profile]} dataset={{ name: 'profile' }} className={styles['dropdown']} onSelect={updateStreamingDropdown} />
                                                 </div>
                                             </React.Fragment>
                                     }
@@ -193,7 +193,7 @@ const SectionsList = React.forwardRef(({ className, sections, preferences, onPre
                         return (
                             <div key={input.id} className={classnames(styles['input-container'], styles['select-container'])}>
                                 {input.header ? <div className={styles['input-header']}>{input.header}</div> : null}
-                                <Multiselect options={input.options} selected={[preferences[input.id]]} data-name={input.id} key={input.id} className={styles['dropdown']} onSelect={updateDropdown} />
+                                <Multiselect options={input.options} selected={[preferences[input.id]]} dataset={{ name: input.id }} key={input.id} className={styles['dropdown']} onSelect={updateDropdown} />
                             </div>
                         );
                     } else if (input.type === 'link') {
@@ -238,7 +238,7 @@ const SectionsList = React.forwardRef(({ className, sections, preferences, onPre
                         return (
                             <div key={input.id} className={classnames(styles['input-container'], styles['color-container'])}>
                                 {input.header ? <div className={styles['input-header']}>{input.header}</div> : null}
-                                <ColorInput className={styles['color-picker']} data-id={input.id} value={preferences[input.id]} onChange={colorChanged} />
+                                <ColorInput className={styles['color-picker']} dataset={{ id: input.id }} value={preferences[input.id]} onChange={colorChanged} />
                             </div>
                         );
                     } else if (input.type === 'info') {
diff --git a/src/routes/Settings/Settings.js b/src/routes/Settings/Settings.js
index 90d3a725d..a8d216b20 100644
--- a/src/routes/Settings/Settings.js
+++ b/src/routes/Settings/Settings.js
@@ -10,7 +10,7 @@ const Settings = () => {
     const [preferences, setPreferences] = useSettings();
     const [dynamicSections, setDynamicSections] = React.useState(settingsSections);
     // TODO: The Streaming section should be handled separately
-    const sections = React.useMemo(()=>Object.keys(dynamicSections)
+    const sections = React.useMemo(() => Object.keys(dynamicSections)
         .map((section) => ({
             id: section,
             inputs: dynamicSections[section],
@@ -39,7 +39,7 @@ const Settings = () => {
         if (scrollContainer.scrollTop + scrollContainer.clientHeight === scrollContainer.scrollHeight) {
             setSelectedSectionId(sections[sections.length - 1].id);
         } else {
-            for (let i = sections.length - 1;i >= 0;i--) {
+            for (let i = sections.length - 1; i >= 0; i--) {
                 if (sections[i].ref.current.offsetTop <= scrollContainer.scrollTop) {
                     setSelectedSectionId(sections[i].id);
                     break;