Render Segment Labels as Value + 1 (to start from 1 instead 0)

LedFx · Apr 17, 2023 · 19dc1d2 · 19dc1d2
1 parent 86fb90c
commit 19dc1d2
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/src/pages/Devices/EditVirtuals/PixelSlider.tsx b/src/pages/Devices/EditVirtuals/PixelSlider.tsx
@@ -29,17 +29,18 @@ const PixelSlider = ({ s, handleRangeSegment }: any) => {
   };
 
   const marks = [
-    { value: 0, label: 0 },
+    { value: 0, label: 1 },
     {
       value: devices[s[0]].config.pixel_count - 1,
-      label: devices[s[0]].config.pixel_count - 1,
+      label: devices[s[0]].config.pixel_count,
     },
   ];
 
   return (
     <Slider
       value={range}
       marks={marks}
+      valueLabelFormat={(e) => e + 1}
       min={0}
       max={devices[s[0]].config.pixel_count - 1}
       onChange={(_event: any, n: any) => setRange(n)}

diff --git a/src/pages/Devices/EditVirtuals/Segment.tsx b/src/pages/Devices/EditVirtuals/Segment.tsx
@@ -101,7 +101,7 @@ const Segment = ({ s, i, virtual, segments }: any) => {
           <div style={{ minWidth: '120px' }}>
             <Typography color="textSecondary">{title}</Typography>
             <Typography color="textSecondary">
-              {s[1] === s[2] ? s[1] : `[ ${s[1]} - ${s[2]} ]`}
+              {s[1] === s[2] ? s[1] + 1 : `[ ${s[1] + 1} - ${s[2] + 1} ]`}
             </Typography>
           </div>
         </div>