refactor(app): move react components to react codebase [EE-3179] (#6971)

app/react/components/form-components/Slider/Slider.tsx

@@ -0,0 +1,42 @@
+import RcSlider from 'rc-slider';
+
+import styles from './Slider.module.css';
+import 'rc-slider/assets/index.css';
+
+export interface Props {
+  min: number;
+  max: number;
+  step: number;
+  value: number;
+  onChange: (value: number) => void;
+}
+
+export function Slider({ min, max, step, value, onChange }: Props) {
+  const SliderWithTooltip = RcSlider.createSliderWithTooltip(RcSlider);
+  const marks = {
+    [min]: translateMinValue(min),
+    [max]: max.toString(),
+  };
+
+  return (
+    <div className={styles.root}>
+      <SliderWithTooltip
+        tipFormatter={translateMinValue}
+        min={min}
+        max={max}
+        step={step}
+        marks={marks}
+        defaultValue={value}
+        onAfterChange={onChange}
+        className={styles.slider}
+      />
+    </div>
+  );
+}
+
+function translateMinValue(value: number) {
+  if (value === 0) {
+    return 'unlimited';
+  }
+  return value.toString();
+}