fix(navigation): corrected the description change form [YTFRONT-4083]

packages/ui/src/ui/components/EditAnnotationWithPreview/EditAnnotationWithPreview.tsx

@@ -1,11 +1,8 @@
 import React from 'react';
 
-import {DialogControlProps} from '../../components/Dialog/Dialog.types';
-import {
-    EditTextWithPreview,
-    EditTextWithPreviewProps,
-} from '../../components/EditTextWithPreview/EditTextWithPreview';
-import {Markdown} from '../../components/Markdown/Markdown';
+import {DialogControlProps} from '../Dialog/Dialog.types';
+import {EditTextWithPreviewProps, EditTextWithPreviewWithState} from '../EditTextWithPreview';
+import {Markdown} from '../Markdown/Markdown';
 
 export type EditAnnotationProps = DialogControlProps<
     EditTextWithPreviewProps['value'],
@@ -82,7 +79,7 @@ export function EditAnnotationWithPreview(props: EditAnnotationProps) {
     }
 
     return (
-        <EditTextWithPreview
+        <EditTextWithPreviewWithState
             className={className}
             value={valueProp}
             onChange={onChange}

packages/ui/src/ui/components/EditTextWithPreview/EditTextWithPreview.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'bem-cn-lite';
 import SplitPane from 'react-split-pane';
 
-import {DialogControlProps} from '../../components/Dialog/Dialog.types';
+import {DialogControlProps} from '../Dialog/Dialog.types';
 import MonacoEditor from '../../components/MonacoEditor';
 import Icon from '../../components/Icon/Icon';
 

packages/ui/src/ui/components/EditTextWithPreview/EditTextWithPreviewWithState.tsx

@@ -0,0 +1,17 @@
+import React, {FC, useState} from 'react';
+import {EditTextWithPreview, EditTextWithPreviewProps} from './EditTextWithPreview';
+
+export const EditTextWithPreviewWithState: FC<EditTextWithPreviewProps> = ({
+    onChange,
+    value,
+    ...props
+}) => {
+    const [editorValue, setEditorValue] = useState(value);
+
+    const handleChange = (newValue: {value: string | undefined}) => {
+        setEditorValue(newValue);
+        onChange(newValue);
+    };
+
+    return <EditTextWithPreview {...props} value={editorValue} onChange={handleChange} />;
+};

packages/ui/src/ui/components/EditTextWithPreview/index.ts

@@ -0,0 +1,3 @@
+export {EditTextWithPreview} from './EditTextWithPreview';
+export type {EditTextWithPreviewProps} from './EditTextWithPreview';
+export {EditTextWithPreviewWithState} from './EditTextWithPreviewWithState';

packages/ui/src/ui/components/ExpandButton/ExpandButton.tsx

@@ -18,7 +18,7 @@ export const ExpandButton: FC<Props> = ({expanded, toggleExpanded}) => {
             title={expanded ? 'Collapse' : 'Expand'}
             onClick={toggleExpanded}
         >
-            <Icon className={block('expand', {expanded})} data={expandedIcon} />
+            <Icon className={block('expand', {expanded})} data={expandedIcon} size={16} />
         </Button>
     );
 };