fully working; all comments removed; put slider setting into content object

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}
+                dots={content.dotsEnable}
-                step={6}
+                step={content.step}
-                min={12}
+                min={content.min}
-                max={96}
+                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}
+                dots={content.dotsEnable}
-                step={20}
+                step={content.step}
-                min={60}
+                min={content.min}
-                max={200}
+                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}

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,
       },