375-refactor: Subtitle component refactor #401

seygorin · 2024-07-11T04:48:04Z

What type of PR is this? (select all that apply)

Description

Subtitle component refactor
Apply CSS modules \ cva
Update tests

Related Tickets & Documents

Related Issue FSD: Subtitle refactor #375
Closes FSD: Subtitle refactor #375

Screenshots, Recordings

Nothing really changes.
Left - prod; Right - dev.

Added/updated tests?

👌 Yes
🙅‍♂️ No, because they aren't needed
🙋‍♂️ No, because I need help

[optional] What gif best describes this PR or how it makes you feel?

Summary by CodeRabbit

New Features
- Introduced a new Subtitle component for improved semantic structure and flexible styling options.
- Added support for additional styling props in the Subtitle component, enhancing layout control.
Bug Fixes
- Updated the rendering logic for the Subtitle component to utilize a children-based approach, improving clarity.
Style
- Enhanced styles for subtitles by implementing a modular SCSS approach, resulting in a cleaner and more maintainable design.
- Streamlined the layout of components by refining CSS rules, improving visual flow.
- Adjusted styles for subtitle elements across various components, enhancing visual presentation and consistency.
- Removed outdated subtitle styles from specific components for a more cohesive design.
Tests
- Updated test cases for the Subtitle component to reflect the new rendering method and props structure.

…pages

src/shared/__tests__/visualTesting/results/.last-run.json

src/widgets/main/ui/main.tsx

src/shared/ui/subtitle/subtitle.module.scss

…, remove some extra styles

github-actions · 2024-09-12T12:08:27Z

Lighthouse Report:

Performance: 96 / 100
Accessibility: 98 / 100
Best Practices: 100 / 100
SEO: 100 / 100

View detailed report

src/shared/ui/subtitle/subtitle.test.tsx

src/widgets/hero/ui/hero.tsx

SpaNb4 · 2024-09-12T13:25:36Z

run visual now

github-actions · 2024-09-12T13:45:00Z

Lighthouse Report:

Performance: 76 / 100
Accessibility: 98 / 100
Best Practices: 100 / 100
SEO: 100 / 100

View detailed report

github-actions · 2024-09-12T15:51:49Z

Lighthouse Report:

Performance: 43 / 100
Accessibility: 98 / 100
Best Practices: 100 / 100
SEO: 100 / 100

View detailed report

thirdmadman · 2024-09-12T15:44:01Z

src/widgets/merch/ui/merch.tsx

+        <Paragraph fontSize="large">
+          Are you an RS sloth fan and looking for RS merch?
+        </Paragraph>


Could you please tell me why the line is broken in three lines?

thirdmadman · 2024-09-12T15:57:53Z

src/widgets/mentors/ui/mentors.tsx

-          <WidgetTitle size="large" mods="lines">
-            Mentors wanted!
-          </WidgetTitle>


Could you please tell me why these lines are collapsed into one over your version?

thirdmadman · 2024-09-12T16:01:50Z

src/shared/ui/subtitle/subtitle.tsx

+type SubtitleProps = Pick<HTMLAttributes<HTMLHeadingElement>, 'className' | 'children'> &
+  VariantProps<typeof subtitleVariants>;


I have seen the the same problem in our codebase before, but are we sure to use type SubtitleProps, which includes type of variable subtitleVariants, before definition of this variable?

thirdmadman · 2024-09-12T16:07:02Z

dev-data/training-program.data.tsx

+      <Subtitle key="aws cloud dev 03">
+        Course highlights:
+      </Subtitle>,


thirdmadman · 2024-09-12T16:07:22Z

dev-data/training-program.data.tsx

+      <Subtitle key="aws devops 04">
+        What do we offer?
+      </Subtitle>,


thirdmadman · 2024-09-12T16:09:17Z

src/shared/ui/subtitle/subtitle.test.tsx

-    render(<Subtitle text="Test Subtitle" />);
-    const subtitle = screen.getByText('Test Subtitle');
+    render(<Subtitle>Test Subtitle</Subtitle>);
+    const subtitle = screen.getByTestId('subtitle');

    expect(subtitle).toBeInTheDocument();


Suggested change

expect(subtitle).toBeInTheDocument();

expect(subtitle).toBeVisible();

thirdmadman · 2024-09-12T16:21:39Z

src/shared/ui/subtitle/subtitle.test.tsx

+    render(<Subtitle className="custom-class">Custom Class</Subtitle>);
+    const subtitle = screen.getByTestId('subtitle');
+
+    expect(subtitle).toHaveClass('custom-class');


Suggested change

expect(subtitle).toHaveClass('custom-class');

expect(subtitle).toHaveClass('custom-class', cx('gray-600'), cx('medium-font-size'));

seygorin added 4 commits July 10, 2024 21:43

refactor: subtitle component

a02c4de

fix: delete extra size at subtitle component

9673dc1

refactor: test for subtitle component and change prop to children in …

75279cf

…pages

fix: update extected heading conut in for study-with-us section

a297a85

github-actions bot added the preview label Jul 11, 2024

seygorin commented Jul 11, 2024

View reviewed changes

src/shared/__tests__/visualTesting/results/.last-run.json Outdated Show resolved Hide resolved

This comment was marked as outdated.

Sign in to view

seygorin added 2 commits July 11, 2024 10:20

fix: delete src/shared/__tests__/visualTesting/report/index.html

76f7dc1

fix: delete src/shared/__tests__/visualTesting/results/.last-run.json

7dd2600

apalchys requested a deployment to pr401 July 11, 2024 05:22 In progress

apalchys temporarily deployed to pr401 July 11, 2024 05:28 Inactive

This comment was marked as resolved.

Sign in to view

KristiBo reviewed Jul 11, 2024

View reviewed changes

src/widgets/main/ui/main.tsx Outdated Show resolved Hide resolved

fix: add black color to main-section

ec16d59

apalchys requested a deployment to pr401 July 12, 2024 04:19 In progress

apalchys temporarily deployed to pr401 July 12, 2024 04:20 Inactive

This comment was marked as resolved.

Sign in to view

natanchik added the refactor label Jul 12, 2024

natanchik assigned seygorin Jul 12, 2024

apalchys requested a deployment to pr401 July 12, 2024 07:36 In progress

apalchys temporarily deployed to pr401 July 12, 2024 07:37 Inactive

This comment was marked as resolved.

Sign in to view

Quiddlee approved these changes Jul 12, 2024

View reviewed changes

natanchik reviewed Jul 12, 2024

View reviewed changes

src/shared/ui/subtitle/subtitle.module.scss Show resolved Hide resolved

refactor: add subttitles to hero / communtication and trainer-card ui…

f2b3313

…, remove some extra styles

seygorin requested a review from Illia-Sakharau July 15, 2024 07:06

This comment was marked as duplicate.

Sign in to view

feat: added additional styles for title and subtitle

36a01f4

fix: 375 - orde of properties in a component

ff10470

apalchys requested a deployment to pr401 September 12, 2024 12:07 In progress

apalchys temporarily deployed to pr401 September 12, 2024 12:07 Inactive

SpaNb4 reviewed Sep 12, 2024

View reviewed changes

src/shared/ui/subtitle/subtitle.test.tsx Outdated Show resolved Hide resolved

src/widgets/hero/ui/hero.tsx Outdated Show resolved Hide resolved

fix: 375 - changed fontSize names to kebab-case

ab009dc

apalchys requested a deployment to pr401 September 12, 2024 13:43 In progress

apalchys temporarily deployed to pr401 September 12, 2024 13:44 Inactive

SpaNb4 approved these changes Sep 12, 2024

View reviewed changes

seygorin added 2 commits September 12, 2024 20:44

fix: 375 - merged with main

0d111da

fix: 375 - deleted visualTesting folder

b115403

apalchys requested a deployment to pr401 September 12, 2024 15:50 In progress

apalchys deployed to pr401 September 12, 2024 15:50 View deployment

SpaNb4 merged commit b6dcec5 into main Sep 12, 2024
4 checks passed

SpaNb4 deleted the refactor/375-subtitle-comp branch September 12, 2024 16:25

thirdmadman reviewed Sep 12, 2024

View reviewed changes

coderabbitai bot mentioned this pull request Sep 13, 2024

499-refactor: Widget alumni #501

Merged

2 tasks

SpaNb4 mentioned this pull request Sep 13, 2024

282-feat: Standardize links designation #467

Merged

2 tasks

This was referenced Sep 20, 2024

490-refactor: Widget about home #510

Merged

498-refactor: Widget about video #538

Merged

521-refactor: Fsd widget communication #536

Merged

524-refactor: Widget OptionItem #542

Draft

513-refactor: Widget hero #540

Merged

This was referenced Sep 27, 2024

546-refactor: Widget StudyWithUs #547

Merged

535-refactor: Widget School Courses #572

Open

522-refactor: Widget community #577

Merged

coderabbitai bot mentioned this pull request Oct 5, 2024

548-refactor: Widget mentoring #579

Open

8 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

375-refactor: Subtitle component refactor #401

375-refactor: Subtitle component refactor #401

seygorin commented Jul 11, 2024 •

edited by coderabbitai bot

Loading

This comment was marked as outdated.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as duplicate.

github-actions bot commented Sep 12, 2024

SpaNb4 commented Sep 12, 2024

github-actions bot commented Sep 12, 2024

github-actions bot commented Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

thirdmadman Sep 12, 2024

		type SubtitleProps = Pick<HTMLAttributes<HTMLHeadingElement>, 'className' \| 'children'> &
		VariantProps<typeof subtitleVariants>;

	expect(subtitle).toBeInTheDocument();
	expect(subtitle).toBeVisible();

	expect(subtitle).toHaveClass('custom-class');
	expect(subtitle).toHaveClass('custom-class', cx('gray-600'), cx('medium-font-size'));

375-refactor: Subtitle component refactor #401

375-refactor: Subtitle component refactor #401

Conversation

seygorin commented Jul 11, 2024 • edited by coderabbitai bot Loading

What type of PR is this? (select all that apply)

Description

Related Tickets & Documents

Screenshots, Recordings

Added/updated tests?

[optional] What gif best describes this PR or how it makes you feel?

Summary by CodeRabbit

Summary by CodeRabbit

This comment was marked as outdated.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as duplicate.

github-actions bot commented Sep 12, 2024

SpaNb4 commented Sep 12, 2024

github-actions bot commented Sep 12, 2024

github-actions bot commented Sep 12, 2024

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

thirdmadman Sep 12, 2024

Choose a reason for hiding this comment

seygorin commented Jul 11, 2024 •

edited by coderabbitai bot

Loading