fix: review

Author: Raubzeug

src/components/Drawer/Drawer.scss

@@ -8,7 +8,7 @@
     }
 
     &__item {
-        z-index: 11;
+        z-index: 4;
 
         height: 100%;
     }

src/components/Drawer/Drawer.tsx

@@ -32,7 +32,7 @@ interface DrawerPaneContentWrapperProps {
     detectClickOutside?: boolean;
     defaultWidth?: number;
     isPercentageWidth?: boolean;
-    showVeil?: boolean;
+    hideVeil?: boolean;
 }
 
 const DrawerPaneContentWrapper = ({
@@ -46,7 +46,7 @@ const DrawerPaneContentWrapper = ({
     className,
     detectClickOutside = false,
     isPercentageWidth,
-    showVeil,
+    hideVeil = true,
 }: DrawerPaneContentWrapperProps) => {
     const [drawerWidth, setDrawerWidth] = React.useState(() => {
         const savedWidth = localStorage.getItem(storageKey);
@@ -115,7 +115,7 @@ const DrawerPaneContentWrapper = ({
             <GravityDrawer
                 onEscape={onClose}
                 onVeilClick={onClose}
-                hideVeil={!showVeil}
+                hideVeil={hideVeil}
                 className={b('container', className)}
             >
                 <DrawerItem
@@ -158,7 +158,7 @@ interface DrawerPaneProps {
     drawerControls?: DrawerControl[];
     title?: React.ReactNode;
     headerClassName?: string;
-    showVeil?: boolean;
+    hideVeil?: boolean;
 }
 
 export const DrawerWrapper = ({
@@ -176,7 +176,7 @@ export const DrawerWrapper = ({
     drawerControls = [],
     title,
     headerClassName,
-    showVeil,
+    hideVeil,
 }: DrawerPaneProps) => {
     React.useEffect(() => {
         return () => {
@@ -224,7 +224,7 @@ export const DrawerWrapper = ({
         <React.Fragment>
             {children}
             <DrawerPaneContentWrapper
-                showVeil={showVeil}
+                hideVeil={hideVeil}
                 isVisible={isDrawerVisible}
                 onClose={onCloseDrawer}
                 drawerId={drawerId}

src/components/EmptyState/EmptyState.scss

@@ -19,7 +19,7 @@
             width: 321px;
             height: 100px;
             #{$block}__image {
-                margin-right: 20px;
+                margin-right: var(--g-spacing-5);
             }
         }
         &_size_s {

src/components/EnableFullscreenButton/EnableFullscreenButton.tsx

@@ -5,6 +5,8 @@ import {ActionTooltip, Button, Icon} from '@gravity-ui/uikit';
 import {enableFullscreen} from '../../store/reducers/fullscreen';
 import {useTypedDispatch} from '../../utils/hooks';
 
+import i18n from './i18n';
+
 interface EnableFullscreenButtonProps {
     disabled?: boolean;
     view?: ButtonView;
@@ -16,7 +18,7 @@ function EnableFullscreenButton({disabled, view = 'flat-secondary'}: EnableFulls
         dispatch(enableFullscreen());
     };
     return (
-        <ActionTooltip title="Fullscreen">
+        <ActionTooltip title={i18n('title_fullscreen')}>
             <Button onClick={onEnableFullscreen} view={view} disabled={disabled}>
                 <Icon data={SquareDashed} />
             </Button>

src/components/EnableFullscreenButton/i18n/en.json

@@ -0,0 +1,3 @@
+{
+  "title_fullscreen": "Fullscreen"
+}

src/components/EnableFullscreenButton/i18n/index.ts

@@ -0,0 +1,7 @@
+import {registerKeysets} from '../../../utils/i18n';
+
+import en from './en.json';
+
+const COMPONENT = 'ydb-fullscreen-button';
+
+export default registerKeysets(COMPONENT, {en});

src/components/ProgressViewer/ProgressViewer.tsx

@@ -35,7 +35,7 @@ Props description:
 6) inverseColorize - invert the colors of the progress bar
 7) warningThreshold - the percentage of fullness at which the color of the progress bar changes to yellow
 8) dangerThreshold - the percentage of fullness at which the color of the progress bar changes to red
-9) overflow - parcents may be more that 100%
+9) withOverflow - percents may be more that 100%
 */
 
 export interface ProgressViewerProps {
@@ -50,15 +50,15 @@ export interface ProgressViewerProps {
     warningThreshold?: number;
     dangerThreshold?: number;
     hideCapacity?: boolean;
-    overflow?: boolean;
+    withOverflow?: boolean;
 }
 
 export function ProgressViewer({
     value,
     capacity,
     formatValues = defaultFormatValues,
     percents,
-    overflow,
+    withOverflow,
     className,
     size = 'xs',
     colorizeProgress,
@@ -77,7 +77,7 @@ export function ProgressViewer({
         capacityText: number | string | undefined = capacity,
         divider = '/';
     if (percents) {
-        valueText = (overflow ? rawFillWidth : fillWidth) + '%';
+        valueText = (withOverflow ? rawFillWidth : fillWidth) + '%';
         capacityText = '';
         divider = '';
     } else if (formatValues) {

src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/i18n/en.json

@@ -1,6 +1,6 @@
 {
   "description_problems": [
-    "There is {{count}} issues.",
+    "There is {{count}} issue.",
     "There are {{count}} issues.",
     "There are {{count}} issues.",
     "There are {{count}} issues."

src/containers/Tenant/Diagnostics/TenantOverview/MetricsCards/MetricsCards.tsx

@@ -239,7 +239,7 @@ function NetworkCard({networkStats}: NetworkCardProps) {
             value: used,
             capacity: limit,
             percents: true,
-            overflow: true,
+            withOverflow: true,
         };
     });
 

src/containers/Tenant/Healthcheck/Healthcheck.scss

@@ -8,7 +8,7 @@
     &__controls {
         position: sticky;
         z-index: 1;
-        top: 0px;
+        top: 0;
         left: 0;
 
         padding: var(--g-spacing-4);