From 0daaa0459632a89fdc8e390c81f16ee9f896c008 Mon Sep 17 00:00:00 2001
From: Brian Jian Zhao <jian10au@gmail.com>
Date: Fri, 28 Feb 2020 10:20:56 +1100
Subject: [PATCH] fully working; all comments removed; put slider setting into
 content object

---
 .../settings/SessionSettingListItem.tsx       | 24 ++++++++++---------
 .../session/settings/SessionSettings.tsx      | 12 +++++++++-
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/ts/components/session/settings/SessionSettingListItem.tsx b/ts/components/session/settings/SessionSettingListItem.tsx
index 062da0ee3..4820d3287 100644
--- a/ts/components/session/settings/SessionSettingListItem.tsx
+++ b/ts/components/session/settings/SessionSettingListItem.tsx
@@ -88,13 +88,14 @@ export class SessionSettingListItem extends React.Component<Props, State> {
             />
           )}
 
-          {type === SessionSettingType.Slider && title === 'Message TTL' ? (
+          {type === SessionSettingType.Slider &&
+          content.sliderCategory === 'messageTTLSlider' ? (
             <div className="slider-wrapper">
               <Slider
-                dots={true}
-                step={6}
-                min={12}
-                max={96}
+                dots={content.dotsEnable}
+                step={content.step}
+                min={content.min}
+                max={content.max}
                 defaultValue={currentSliderValue}
                 onAfterChange={sliderValue => {
                   this.handleSlider(sliderValue);
@@ -105,13 +106,14 @@ export class SessionSettingListItem extends React.Component<Props, State> {
                 <p>{`${currentSliderValue} Hours`}</p>
               </div>
             </div>
-          ) : type === SessionSettingType.Slider && title === 'Zoom Factor' ? (
+          ) : type === SessionSettingType.Slider &&
+          content.sliderCategory === 'zoomFactorSlider' ? (
             <div>
               <Slider
-                dots={true}
-                step={20}
-                min={60}
-                max={200}
+                dots={content.dotsEnable}
+                step={content.step}
+                min={content.min}
+                max={content.max}
                 defaultValue={currentSliderValue}
                 onChange={sliderValue => {
                   this.handleSlider(sliderValue);
@@ -119,7 +121,7 @@ export class SessionSettingListItem extends React.Component<Props, State> {
               />
 
               <div className="slider-info">
-                <p>{`% ${currentSliderValue} Zoom Level`}</p>
+                <p>{`Zoom Level:   %${currentSliderValue}`}</p>
               </div>
             </div>
           ) : null}
diff --git a/ts/components/session/settings/SessionSettings.tsx b/ts/components/session/settings/SessionSettings.tsx
index 1cae11c29..38bb56b4e 100644
--- a/ts/components/session/settings/SessionSettings.tsx
+++ b/ts/components/session/settings/SessionSettings.tsx
@@ -445,6 +445,11 @@ export class SettingsView extends React.Component<SettingsViewProps, State> {
         comparisonValue: undefined,
         onClick: undefined,
         content: {
+          dotsEnabled: true,
+          step: 6,
+          min: 12,
+          max: 96,
+          sliderCategory: 'messageTTLSlider',
           defaultValue: 24,
         },
         confirmationDialogParams: undefined,
@@ -460,7 +465,12 @@ export class SettingsView extends React.Component<SettingsViewProps, State> {
         comparisonValue: undefined,
         onClick: undefined,
         content: {
-          defaultValue: 24,
+          dotsEnabled: true,
+          step: 20,
+          min: 60,
+          max: 200,
+          sliderCategory: 'zoomFactorSlider',
+          defaultValue: 100,
         },
         confirmationDialogParams: undefined,
       },