refactor(DateRange): make DateRange a separate component

Author: ariser

src/components/DateRange/DateRange.scss

@@ -0,0 +1,11 @@
+.date-range {
+    &__input {
+        min-width: 190px;
+        padding: 5px 8px;
+
+        color: var(--yc-color-text-primary);
+        border: 1px solid var(--yc-color-line-generic);
+        border-radius: var(--yc-border-radius-m);
+        background: transparent;
+    }
+}

src/containers/Tenant/Diagnostics/OverloadedShards/DateRange/DateRange.tsx renamed to src/components/DateRange/DateRange.tsx

@@ -1,9 +1,9 @@
-import cn from 'bem-cn-lite';
 import {ChangeEventHandler} from 'react';
+import cn from 'bem-cn-lite';
 
 import './DateRange.scss';
 
-const b = cn('overloaded-shards');
+const b = cn('date-range');
 
 export interface DateRangeValues {
     /** ms from epoch */
@@ -54,21 +54,21 @@ export const DateRange = ({from, to, className, onChange}: DateRangeProps) => {
     const endISO = toTimezonelessISOString(to);
 
     return (
-        <div className={b('date-range', className)}>
+        <div className={b(null, className)}>
             <input
                 type="datetime-local"
                 value={startISO}
                 max={endISO}
                 onChange={handleFromChange}
-                className={b('date-range-input')}
+                className={b('input')}
             />
             —
             <input
                 type="datetime-local"
                 min={startISO}
                 value={endISO}
                 onChange={handleToChange}
-                className={b('date-range-input')}
+                className={b('input')}
             />
         </div>
     );

src/containers/Tenant/Diagnostics/OverloadedShards/DateRange/index.ts renamed to src/components/DateRange/index.ts

@@ -5,6 +5,7 @@ import cn from 'bem-cn-lite';
 import DataTable, {Column, Settings, SortOrder} from '@yandex-cloud/react-data-table';
 import {Loader} from '@gravity-ui/uikit';
 
+import {DateRange, DateRangeValues} from '../../../../components/DateRange';
 import InternalLink from '../../../../components/InternalLink/InternalLink';
 
 import HistoryContext from '../../../../contexts/HistoryContext';
@@ -30,8 +31,6 @@ import {getDefaultNodePath} from '../../../Node/NodePages';
 
 import {isColumnEntityType} from '../../utils/schema';
 
-import {DateRange, DateRangeValues} from './DateRange';
-
 import i18n from './i18n';
 import './OverloadedShards.scss';