fix: long headers values #76

saxumcordis · 2023-08-08T11:47:39Z

Fix long headers value with ellipsis

Before

After

gravity-ui-bot · 2023-08-08T11:50:45Z

NasgulNexus · 2023-08-10T09:51:29Z

src/lib/kit/components/Card/Card.tsx

@@ -24,6 +24,9 @@ export interface CardProps {
    checkEmptyBody?: boolean;
 }

+const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];


there is a separate file of constants you need to take out there

NasgulNexus · 2023-08-10T10:07:52Z

src/lib/kit/components/Card/Card.tsx

@@ -112,7 +120,9 @@ export const Card: React.FC<CardProps> = ({
                className={b('header', {interactive: Boolean(handleHeaderToggle)})}
                onClick={handleHeaderToggle}
            >
-                <div className={b('header-left')}>{title}</div>
+                <div ref={titleRef} className={b('header-left')}>


ref should be on another div
right here
<div className={b('title')}>{propsTitle}</div>
otherwise it will be like this

NasgulNexus · 2023-08-10T10:08:37Z

src/lib/kit/components/Layouts/Section/Section.tsx

-    LayoutProps,
-    Spec,
-    ViewLayoutProps,
+    type FieldRenderProps,


do not change code that is not related to the current task

NasgulNexus · 2023-08-10T10:09:01Z

src/lib/kit/components/Layouts/Section/Section.tsx

@@ -27,6 +28,9 @@ interface SectionProps {
    descriptionAsSubtitle?: boolean;
 }

+const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];
+const MAX_TITLE_WIDTH = 533;


move to common constants

NasgulNexus · 2023-08-10T10:09:40Z

src/lib/kit/components/Layouts/Section/Section.tsx

@@ -76,15 +81,26 @@ const SectionBase = <D extends FieldValue, T extends FormValue, S extends Spec>(
        }
    }

+    const layoutTitle = spec.viewSpec.layoutTitle;
+    const layoutTitlePopoverDisabled = (titleRef.current?.offsetWidth || 0) < MAX_TITLE_WIDTH;


const layoutTitlePopoverDisabled = (titleRef.current?.offsetWidth || 0) <= MAX_TITLE_WIDTH;

NasgulNexus · 2023-08-10T10:10:49Z

src/lib/kit/components/SimpleVerticalAccordeon/SimpleVerticalAccordeon.tsx

+                                qa={`${name}-accordeon-toggler`}
+                                width="auto"
+                            >
+                                {' '}


remove the extra space

NasgulNexus · 2023-08-10T10:11:49Z

src/lib/kit/components/Views/MultiSelectView/MultiSelectView.tsx

@@ -9,6 +9,8 @@ import './MultiSelectView.scss';

 const b = block('multiselect-view');

+const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];


these changes do not apply to the current task, you should remove them, if you want to change imports and parameters, it is better to do it in a separate task

NasgulNexus · 2023-08-10T10:11:54Z

src/lib/kit/components/Views/NumberWithScaleView/NumberWithScaleView.tsx

@@ -10,14 +10,16 @@ import './NumberWithScaleView.scss';

 const b = block('number-with-scale-view');

+const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];


these changes do not apply to the current task, you should remove them, if you want to change imports and parameters, it is better to do it in a separate task

NasgulNexus · 2023-08-10T10:12:13Z

src/lib/kit/components/SimpleVerticalAccordeon/SimpleVerticalAccordeon.tsx

@@ -97,19 +101,38 @@ export class SimpleVerticalAccordeon extends React.Component<
            return null;
        }

+        const title = this.getTitle();
+        const titlePopoverDisabled =
+            (this.titleRef.current?.offsetWidth || 0) < MAX_TITLE_TEXT_WIDTH;


const titlePopoverDisabled = (this.titleRef.current?.offsetWidth || 0) <= MAX_TITLE_TEXT_WIDTH;

NasgulNexus · 2023-08-10T10:14:06Z

src/lib/kit/components/Card/Card.tsx

@@ -66,22 +70,26 @@ export const Card: React.FC<CardProps> = ({
        [],
    );

+    const titlePopoverDisabled = (titleRef.current?.offsetWidth || 0) < MAX_TITLE_WIDTH;


const titlePopoverDisabled = (this.titleRef.current?.offsetWidth || 0) <= MAX_TITLE_TEXT_WIDTH;

…orms into fix_headers

fix: long headers values

8eb531f

saxumcordis marked this pull request as ready for review August 8, 2023 11:49

saxumcordis requested review from bocembocem and NasgulNexus as code owners August 8, 2023 11:49

Viktor Fedoseev added 3 commits August 9, 2023 17:49

fix: add long title popover to accordeon & fix placement usage

7af5521

fix: add long title popover to card & section

c229b1f

fix: constants

64db05e

NasgulNexus reviewed Aug 10, 2023

View reviewed changes

Viktor Fedoseev and others added 10 commits August 10, 2023 14:09

fix: review updates

807997e

Merge branch 'main' into fix_headers

bf43df5

fix: long headers values

ec3b257

fix: add long title popover to accordeon & fix placement usage

e035e1e

fix: add long title popover to card & section

737b8c3

fix: constants

3e2d318

fix: review updates

3dfa2cd

fix: fixed array type for default values (#72)

180516e

Merge branch 'fix_headers' of https://github.com/gravity-ui/dynamic-f…

183c98c

…orms into fix_headers

fix: imports

3c6c2de

NasgulNexus approved these changes Aug 14, 2023

View reviewed changes

Merge branch 'main' into fix_headers

7b7056f

saxumcordis merged commit 37f3c6e into main Aug 14, 2023

saxumcordis deleted the fix_headers branch August 14, 2023 08:25

gravity-ui-bot mentioned this pull request Aug 11, 2023

chore(main): release 2.1.0 #74

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix: long headers values #76

fix: long headers values #76

saxumcordis commented Aug 8, 2023

gravity-ui-bot commented Aug 8, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

NasgulNexus Aug 10, 2023

		@@ -9,6 +9,8 @@ import './MultiSelectView.scss';

		const b = block('multiselect-view');

		const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];

		@@ -10,14 +10,16 @@ import './NumberWithScaleView.scss';

		const b = block('number-with-scale-view');

		const POPOVER_PLACEMENT: PopoverProps['placement'] = ['bottom', 'top'];

fix: long headers values #76

fix: long headers values #76

Conversation

saxumcordis commented Aug 8, 2023

gravity-ui-bot commented Aug 8, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment