From df87c9469dd6638e046731ab65635c34066d716e Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Wed, 4 Dec 2024 14:19:56 +0100
Subject: [PATCH 1/6] fix: 614 - pre school subtitle

---
 dev-data/about-course.data.tsx                                 | 2 +-
 src/app/courses/javascript-preschool-ru/page.tsx               | 2 +-
 src/views/javascript-preschool-ru.tsx                          | 2 +-
 src/widgets/about-course/ui/about-course/about-course.test.tsx | 2 +-
 src/widgets/about-course/ui/about-course/about-course.tsx      | 2 +-
 src/widgets/hero-course/ui/hero-course.tsx                     | 2 +-
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/dev-data/about-course.data.tsx b/dev-data/about-course.data.tsx
index 1bdabfbd6..3ff4d690e 100644
--- a/dev-data/about-course.data.tsx
+++ b/dev-data/about-course.data.tsx
@@ -25,7 +25,7 @@ export const introLocalizedContent = {
     linkLabel: 'Cтать студентом',
     paragraph: '',
   },
-  'pre-school-ru': {
+  'Pre-school RU': {
     title: 'JS/Frontend-разработка. Подготовительный этап',
     linkLabel: 'Стать студентом',
     paragraph:
diff --git a/src/app/courses/javascript-preschool-ru/page.tsx b/src/app/courses/javascript-preschool-ru/page.tsx
index 15fa0667a..5d39726d7 100644
--- a/src/app/courses/javascript-preschool-ru/page.tsx
+++ b/src/app/courses/javascript-preschool-ru/page.tsx
@@ -14,6 +14,6 @@ export default async function JsPreRoute() {
   const course = await selectCourse(courseName);
 
   return (
-    <JavaScriptPreSchoolRu lang="ru" type="pre-school-ru" course={course} courseName={courseName} />
+    <JavaScriptPreSchoolRu lang="ru" type="Pre-school RU" course={course} courseName={courseName} />
   );
 }
diff --git a/src/views/javascript-preschool-ru.tsx b/src/views/javascript-preschool-ru.tsx
index 8dd65edf4..335cb0d87 100644
--- a/src/views/javascript-preschool-ru.tsx
+++ b/src/views/javascript-preschool-ru.tsx
@@ -13,7 +13,7 @@ import { CourseNames, preSchoolRu } from 'data';
 type JavaScriptPreSchoolRuProps = {
   course: Course;
   lang: 'ru' | 'en';
-  type?: 'pre-school-ru';
+  type?: 'Pre-school RU';
   courseName: CourseNames['JS_PRESCHOOL_RU'];
 };
 
diff --git a/src/widgets/about-course/ui/about-course/about-course.test.tsx b/src/widgets/about-course/ui/about-course/about-course.test.tsx
index ad97ec660..663cb7eb8 100644
--- a/src/widgets/about-course/ui/about-course/about-course.test.tsx
+++ b/src/widgets/about-course/ui/about-course/about-course.test.tsx
@@ -79,7 +79,7 @@ describe('AboutCourse component', () => {
         <AboutCourse
           course={mockedPreSchoolCourse}
           courseName="JS / Front-end Pre-school RU"
-          type="pre-school-ru"
+          type="Pre-school RU"
         />,
       );
 
diff --git a/src/widgets/about-course/ui/about-course/about-course.tsx b/src/widgets/about-course/ui/about-course/about-course.tsx
index 04d2f5671..5ffa2d519 100644
--- a/src/widgets/about-course/ui/about-course/about-course.tsx
+++ b/src/widgets/about-course/ui/about-course/about-course.tsx
@@ -12,7 +12,7 @@ export const cx = classNames.bind(styles);
 
 type AboutCourseProps = {
   courseName: CourseNamesKeys;
-  type?: 'ru' | 'en' | 'pre-school-ru';
+  type?: 'ru' | 'en' | 'Pre-school RU';
   course: Course;
 };
 
diff --git a/src/widgets/hero-course/ui/hero-course.tsx b/src/widgets/hero-course/ui/hero-course.tsx
index b89114cf1..1272938e5 100644
--- a/src/widgets/hero-course/ui/hero-course.tsx
+++ b/src/widgets/hero-course/ui/hero-course.tsx
@@ -16,7 +16,7 @@ const cx = classNames.bind(styles);
 type HeroCourseProps = {
   course: Course;
   lang?: 'ru' | 'en';
-  type?: 'pre-school-ru';
+  type?: 'Pre-school RU';
 };
 
 export const HeroCourse = ({ lang = 'en', type, course }: HeroCourseProps) => {

From dddca02ee6ea7d27948a6fea7ea44031bfb96849 Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Thu, 5 Dec 2024 16:24:19 +0100
Subject: [PATCH 2/6] refactor: 614 - update course intro

---
 dev-data/about-course.data.tsx                | 45 +++++++++++--------
 dev-data/courses.data.ts                      |  9 ++++
 .../courses/javascript-preschool-ru/page.tsx  |  4 +-
 src/entities/course/types.ts                  |  1 +
 src/shared/__tests__/constants.ts             |  6 +++
 src/shared/helpers/getActualData.test.ts      |  3 ++
 src/views/javascript-preschool-ru.tsx         | 12 ++---
 src/views/javascript-ru.tsx                   |  2 +-
 .../ui/about-course/about-course.test.tsx     |  7 +--
 .../ui/about-course/about-course.tsx          | 11 +++--
 .../hero-course/ui/hero-course.test.tsx       |  1 +
 src/widgets/hero-course/ui/hero-course.tsx    | 18 +++++---
 .../ui/training-program.test.tsx              |  2 +
 13 files changed, 74 insertions(+), 47 deletions(-)

diff --git a/dev-data/about-course.data.tsx b/dev-data/about-course.data.tsx
index 3ff4d690e..a29d25b21 100644
--- a/dev-data/about-course.data.tsx
+++ b/dev-data/about-course.data.tsx
@@ -14,23 +14,33 @@ type ContentMap = {
   [key in CourseNamesChannels]: AboutCourseInfo[];
 };
 
+const enIntro = {
+  title: 'About the course',
+  linkLabel: 'Become a student',
+  paragraph: null,
+};
+const ruIntro = {
+  title: 'О курсе',
+  linkLabel: 'Cтать студентом',
+  paragraph: null,
+};
+const preSchoolIntro = {
+  title: 'JS/Frontend-разработка. Подготовительный этап',
+  linkLabel: 'Стать студентом',
+  paragraph:
+    'Подготовительный этап поможет тем, кто мало знаком или совсем не знаком с программированием и хотел бы впоследствии учиться на основном курсе «JavaScript/Front-end».',
+};
+
 export const introLocalizedContent = {
-  en: {
-    title: 'About the course',
-    linkLabel: 'Become a student',
-    paragraph: '',
-  },
-  ru: {
-    title: 'О курсе',
-    linkLabel: 'Cтать студентом',
-    paragraph: '',
-  },
-  'Pre-school RU': {
-    title: 'JS/Frontend-разработка. Подготовительный этап',
-    linkLabel: 'Стать студентом',
-    paragraph:
-      'Подготовительный этап поможет тем, кто мало знаком или совсем не знаком с программированием и хотел бы впоследствии учиться на основном курсе «JavaScript/Front-end».',
-  },
+  [COURSE_TITLES.JS_PRESCHOOL_RU]: preSchoolIntro,
+  [COURSE_TITLES.JS_EN]: enIntro,
+  [COURSE_TITLES.JS_RU]: ruIntro,
+  [COURSE_TITLES.REACT]: enIntro,
+  [COURSE_TITLES.ANGULAR]: enIntro,
+  [COURSE_TITLES.NODE]: enIntro,
+  [COURSE_TITLES.AWS_FUNDAMENTALS]: enIntro,
+  [COURSE_TITLES.AWS_CLOUD_DEVELOPER]: enIntro,
+  [COURSE_TITLES.AWS_DEVOPS]: enIntro,
 };
 
 const listData = {
@@ -217,8 +227,7 @@ const reactEn: AboutCourseInfo[] = javaScriptEN().map((item) => {
       ...item,
       info: (
         <p>
-          Throughout the course, we mostly use
-          {' '}
+          Throughout the course, we mostly use{' '}
           <LinkCustom href={DISCORD_LINKS[COURSE_TITLES.REACT]} external>
             Discord chat
           </LinkCustom>
diff --git a/dev-data/courses.data.ts b/dev-data/courses.data.ts
index c8dbc4782..497ebeeb7 100644
--- a/dev-data/courses.data.ts
+++ b/dev-data/courses.data.ts
@@ -24,6 +24,7 @@ export const courses: Course[] = [
   {
     id: '1',
     title: COURSE_TITLES.JS_PRESCHOOL_RU,
+    subTitle: 'Pre-school RU',
     alias: COURSE_ALIASES.JS_PRESCHOOL_RU,
     altTitle: 'JavaScript / Front-end',
     iconSrc: javascript,
@@ -43,6 +44,7 @@ export const courses: Course[] = [
   {
     id: '2',
     title: COURSE_TITLES.JS_EN,
+    subTitle: null,
     alias: COURSE_ALIASES.JS_EN,
     altTitle: 'JavaScript / Front-end',
     iconSrc: javascript,
@@ -62,6 +64,7 @@ export const courses: Course[] = [
   {
     id: '3',
     title: COURSE_TITLES.JS_RU,
+    subTitle: null,
     alias: COURSE_ALIASES.JS_RU,
     altTitle: 'JavaScript / Front-end',
     iconSrc: javascript,
@@ -81,6 +84,7 @@ export const courses: Course[] = [
   {
     id: '4',
     title: COURSE_TITLES.REACT,
+    subTitle: null,
     alias: COURSE_ALIASES.REACT,
     iconSrc: react,
     iconSmall: reactSmall,
@@ -99,6 +103,7 @@ export const courses: Course[] = [
   {
     id: '5',
     title: COURSE_TITLES.ANGULAR,
+    subTitle: null,
     alias: COURSE_ALIASES.ANGULAR,
     iconSrc: angular,
     iconSmall: angularSmall,
@@ -117,6 +122,7 @@ export const courses: Course[] = [
   {
     id: '6',
     title: COURSE_TITLES.NODE,
+    subTitle: null,
     alias: COURSE_ALIASES.NODE,
     iconSrc: nodejs,
     iconSmall: nodejsSmall,
@@ -135,6 +141,7 @@ export const courses: Course[] = [
   {
     id: '7',
     title: COURSE_TITLES.AWS_FUNDAMENTALS,
+    subTitle: null,
     alias: COURSE_ALIASES.AWS_FUNDAMENTALS,
     iconSrc: aws,
     iconSmall: awsFundSmall,
@@ -154,6 +161,7 @@ export const courses: Course[] = [
   {
     id: '8',
     title: COURSE_TITLES.AWS_CLOUD_DEVELOPER,
+    subTitle: null,
     alias: COURSE_ALIASES.AWS_CLOUD_DEVELOPER,
     iconSrc: aws,
     iconSmall: awsDevSmall,
@@ -172,6 +180,7 @@ export const courses: Course[] = [
   {
     id: '9',
     title: COURSE_TITLES.AWS_DEVOPS,
+    subTitle: null,
     alias: COURSE_ALIASES.AWS_DEVOPS,
     iconSrc: aws,
     iconSmall: awsDevSmall,
diff --git a/src/app/courses/javascript-preschool-ru/page.tsx b/src/app/courses/javascript-preschool-ru/page.tsx
index 5d39726d7..43822401b 100644
--- a/src/app/courses/javascript-preschool-ru/page.tsx
+++ b/src/app/courses/javascript-preschool-ru/page.tsx
@@ -13,7 +13,5 @@ export async function generateMetadata(): Promise<Metadata> {
 export default async function JsPreRoute() {
   const course = await selectCourse(courseName);
 
-  return (
-    <JavaScriptPreSchoolRu lang="ru" type="Pre-school RU" course={course} courseName={courseName} />
-  );
+  return <JavaScriptPreSchoolRu lang="ru" course={course} courseName={courseName} />;
 }
diff --git a/src/entities/course/types.ts b/src/entities/course/types.ts
index 837b10a4f..88f9bad69 100644
--- a/src/entities/course/types.ts
+++ b/src/entities/course/types.ts
@@ -25,6 +25,7 @@ export type ApiCoursesResponse = Readonly<{
 export type Course = {
   id: string;
   title: CourseNamesKeys;
+  subTitle: string | null;
   alias: CourseAliasValues;
   altTitle?: string;
   iconSrc: StaticImageData;
diff --git a/src/shared/__tests__/constants.ts b/src/shared/__tests__/constants.ts
index 1bee4fa0a..52efbcaba 100644
--- a/src/shared/__tests__/constants.ts
+++ b/src/shared/__tests__/constants.ts
@@ -25,6 +25,7 @@ export const mockedCourses: Course[] = [
   {
     id: '1',
     title: COURSE_TITLES.JS_PRESCHOOL_RU,
+    subTitle: 'Pre-school RU',
     alias: COURSE_ALIASES.JS_PRESCHOOL_RU,
     startDate: 'Jun 24, 2024',
     registrationEndDate: 'Jun 24, 2024',
@@ -44,6 +45,7 @@ export const mockedCourses: Course[] = [
   {
     id: '2',
     title: COURSE_TITLES.JS_EN,
+    subTitle: null,
     alias: COURSE_ALIASES.JS_EN,
     startDate: 'Oct, 2024',
     registrationEndDate: 'Jun 24, 2025',
@@ -63,6 +65,7 @@ export const mockedCourses: Course[] = [
   {
     id: '3',
     title: COURSE_TITLES.JS_RU,
+    subTitle: null,
     alias: COURSE_ALIASES.JS_RU,
     startDate: 'Oct, 2024',
     registrationEndDate: 'Jun 24, 2025',
@@ -82,6 +85,7 @@ export const mockedCourses: Course[] = [
   {
     id: '4',
     title: COURSE_TITLES.REACT,
+    subTitle: null,
     alias: COURSE_ALIASES.REACT,
     startDate: 'Jul 1, 2024',
     registrationEndDate: 'Jun 24, 2024',
@@ -101,6 +105,7 @@ export const mockedCourses: Course[] = [
   {
     id: '5',
     title: COURSE_TITLES.ANGULAR,
+    subTitle: null,
     alias: COURSE_ALIASES.ANGULAR,
     startDate: 'Jul 1, 2024',
     registrationEndDate: 'Jun 24, 2025',
@@ -120,6 +125,7 @@ export const mockedCourses: Course[] = [
   {
     id: '6',
     title: COURSE_TITLES.AWS_FUNDAMENTALS,
+    subTitle: null,
     alias: COURSE_ALIASES.AWS_FUNDAMENTALS,
     startDate: 'Jul 1, 2024',
     registrationEndDate: 'Jun 24, 2025',
diff --git a/src/shared/helpers/getActualData.test.ts b/src/shared/helpers/getActualData.test.ts
index 5a57a4916..56d51905f 100644
--- a/src/shared/helpers/getActualData.test.ts
+++ b/src/shared/helpers/getActualData.test.ts
@@ -20,6 +20,7 @@ const coursesMock: Course[] = [
     id: '1',
     title: COURSE_TITLES.REACT,
     alias: COURSE_ALIASES.REACT,
+    subTitle: null,
     altTitle: 'altTitle',
     iconSrc: {
       src: 'icon',
@@ -50,6 +51,7 @@ const coursesMock: Course[] = [
   {
     id: '2',
     title: COURSE_TITLES.REACT,
+    subTitle: null,
     alias: COURSE_ALIASES.REACT,
     altTitle: 'altTitle',
     iconSrc: {
@@ -81,6 +83,7 @@ const coursesMock: Course[] = [
   {
     id: '3',
     title: COURSE_TITLES.REACT,
+    subTitle: null,
     alias: COURSE_ALIASES.REACT,
     altTitle: 'altTitle',
     iconSrc: {
diff --git a/src/views/javascript-preschool-ru.tsx b/src/views/javascript-preschool-ru.tsx
index 335cb0d87..e461ff07b 100644
--- a/src/views/javascript-preschool-ru.tsx
+++ b/src/views/javascript-preschool-ru.tsx
@@ -13,21 +13,15 @@ import { CourseNames, preSchoolRu } from 'data';
 type JavaScriptPreSchoolRuProps = {
   course: Course;
   lang: 'ru' | 'en';
-  type?: 'Pre-school RU';
   courseName: CourseNames['JS_PRESCHOOL_RU'];
 };
 
-export const JavaScriptPreSchoolRu = ({
-  lang,
-  type,
-  course,
-  courseName,
-}: JavaScriptPreSchoolRuProps) => {
+export const JavaScriptPreSchoolRu = ({ lang, course, courseName }: JavaScriptPreSchoolRuProps) => {
   return (
     <>
-      <HeroCourse type={type} lang={lang} course={course} />
+      <HeroCourse lang={lang} course={course} />
       <Breadcrumbs />
-      <AboutCourse courseName={courseName} type={type} course={course} />
+      <AboutCourse courseName={courseName} course={course} />
       <TrainingProgram courseName={courseName} lang={lang} course={course} />
       <Required courseName={courseName} />
       <Certification courseName={courseName} />
diff --git a/src/views/javascript-ru.tsx b/src/views/javascript-ru.tsx
index 429962f6b..6d3981e40 100644
--- a/src/views/javascript-ru.tsx
+++ b/src/views/javascript-ru.tsx
@@ -25,7 +25,7 @@ export const JavaScriptRu = ({ lang, course, courseName }: JavaScriptRuProps) =>
       <HeroCourse course={course} lang={lang} />
       <Breadcrumbs />
       <TrainingProgram course={course} courseName={courseName} lang={lang} />
-      <AboutCourse course={course} courseName={courseName} type={lang} />
+      <AboutCourse course={course} courseName={courseName} />
       <Certification courseName={courseName} />
       <Communication courseName={courseName} lang={lang} />
       <AboutVideo lang={lang} />
diff --git a/src/widgets/about-course/ui/about-course/about-course.test.tsx b/src/widgets/about-course/ui/about-course/about-course.test.tsx
index 663cb7eb8..813b2699f 100644
--- a/src/widgets/about-course/ui/about-course/about-course.test.tsx
+++ b/src/widgets/about-course/ui/about-course/about-course.test.tsx
@@ -18,6 +18,7 @@ const mockedReactCourse: Course = {
   iconSmall: MOCKED_IMAGE_PATH,
   iconSrc: MOCKED_IMAGE_PATH,
   title: COURSE_TITLES.REACT,
+  subTitle: null,
   alias: COURSE_ALIASES.REACT,
   language: ['en'],
   mode: 'online',
@@ -76,11 +77,7 @@ describe('AboutCourse component', () => {
   describe('render "Paragraph" with "js / front-end pre-school ru" props', () => {
     it("renders 'Paragraph' and its' content", async () => {
       renderWithRouter(
-        <AboutCourse
-          course={mockedPreSchoolCourse}
-          courseName="JS / Front-end Pre-school RU"
-          type="Pre-school RU"
-        />,
+        <AboutCourse course={mockedPreSchoolCourse} courseName="JS / Front-end Pre-school RU" />,
       );
 
       const paragraph = await screen.findByText(/Подготовительный этап поможет тем/i);
diff --git a/src/widgets/about-course/ui/about-course/about-course.tsx b/src/widgets/about-course/ui/about-course/about-course.tsx
index 5ffa2d519..a16862251 100644
--- a/src/widgets/about-course/ui/about-course/about-course.tsx
+++ b/src/widgets/about-course/ui/about-course/about-course.tsx
@@ -12,23 +12,22 @@ export const cx = classNames.bind(styles);
 
 type AboutCourseProps = {
   courseName: CourseNamesKeys;
-  type?: 'ru' | 'en' | 'Pre-school RU';
   course: Course;
 };
 
-export const AboutCourse = ({ course, courseName, type = 'en' }: AboutCourseProps) => {
+export const AboutCourse = ({ course, courseName }: AboutCourseProps) => {
   const courseInfoList = contentMapAbout[courseName];
 
   return (
     <section className={cx('container')}>
       <div className={cx('about-course', 'content')}>
-        <WidgetTitle>{introLocalizedContent[type].title}</WidgetTitle>
-        {introLocalizedContent[type]?.paragraph && (
-          <Paragraph>{introLocalizedContent[type].paragraph}</Paragraph>
+        <WidgetTitle>{introLocalizedContent[courseName].title}</WidgetTitle>
+        {introLocalizedContent[courseName]?.paragraph && (
+          <Paragraph>{introLocalizedContent[courseName].paragraph}</Paragraph>
         )}
         <AboutCourseGrid items={courseInfoList} />
         <LinkCustom href={course.enroll} variant="primary" external>
-          {introLocalizedContent[type]?.linkLabel}
+          {introLocalizedContent[courseName]?.linkLabel}
         </LinkCustom>
       </div>
     </section>
diff --git a/src/widgets/hero-course/ui/hero-course.test.tsx b/src/widgets/hero-course/ui/hero-course.test.tsx
index c292a9d49..53f24c2cc 100644
--- a/src/widgets/hero-course/ui/hero-course.test.tsx
+++ b/src/widgets/hero-course/ui/hero-course.test.tsx
@@ -11,6 +11,7 @@ import { COURSE_TITLES } from 'data';
 const mockedCourse: Course = {
   id: '6',
   title: COURSE_TITLES.NODE,
+  subTitle: null,
   alias: COURSE_ALIASES.NODE,
   iconSrc: MOCKED_IMAGE_PATH,
   iconSmall: MOCKED_IMAGE_PATH,
diff --git a/src/widgets/hero-course/ui/hero-course.tsx b/src/widgets/hero-course/ui/hero-course.tsx
index 1272938e5..4b325959b 100644
--- a/src/widgets/hero-course/ui/hero-course.tsx
+++ b/src/widgets/hero-course/ui/hero-course.tsx
@@ -16,12 +16,20 @@ const cx = classNames.bind(styles);
 type HeroCourseProps = {
   course: Course;
   lang?: 'ru' | 'en';
-  type?: 'Pre-school RU';
 };
 
-export const HeroCourse = ({ lang = 'en', type, course }: HeroCourseProps) => {
-  const { title, altTitle, language, mode, enroll, secondaryIcon, startDate, registrationEndDate } =
-    course;
+export const HeroCourse = ({ lang = 'en', course }: HeroCourseProps) => {
+  const {
+    title,
+    subTitle,
+    altTitle,
+    language,
+    mode,
+    enroll,
+    secondaryIcon,
+    startDate,
+    registrationEndDate,
+  } = course;
   const status = getCourseStatus(startDate, dayJS(registrationEndDate).diff(startDate, 'd'));
 
   return (
@@ -31,7 +39,7 @@ export const HeroCourse = ({ lang = 'en', type, course }: HeroCourseProps) => {
         <article>
           <SectionLabel data-testid="course-label">{status}</SectionLabel>
           <MainTitle size="small">{`${altTitle || title} Course`}</MainTitle>
-          {type && <p className={cx('hero-subtitle')}>{type}</p>}
+          {subTitle && <p className={cx('hero-subtitle')}>{subTitle}</p>}
           <DateLang
             startDate={startDate}
             registrationEndDate={registrationEndDate}
diff --git a/src/widgets/training-program/ui/training-program.test.tsx b/src/widgets/training-program/ui/training-program.test.tsx
index cb69a3a05..41b5816eb 100644
--- a/src/widgets/training-program/ui/training-program.test.tsx
+++ b/src/widgets/training-program/ui/training-program.test.tsx
@@ -11,6 +11,7 @@ import { COURSE_TITLES } from 'data';
 const mockedCourseAngular: Course = {
   id: '1',
   title: COURSE_TITLES.ANGULAR,
+  subTitle: null,
   alias: COURSE_ALIASES.ANGULAR,
   startDate: '16 Oct, 2023',
   registrationEndDate: '16 Oct, 2024',
@@ -37,6 +38,7 @@ const mockedCourseAws: Course = {
   startDate: '',
   registrationEndDate: TO_BE_DETERMINED,
   title: COURSE_TITLES.AWS_CLOUD_DEVELOPER,
+  subTitle: null,
   alias: COURSE_ALIASES.AWS_CLOUD_DEVELOPER,
   detailsUrl: `/${ROUTES.COURSES}/${ROUTES.AWS_DEVELOPER}`,
   enroll: 'https://wearecommunity.io/events/aws-cloud-dev-rs2023q4',

From 23c8b3b4edd770b6ef03094f2f53ce06f7abd0ca Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Thu, 5 Dec 2024 16:29:09 +0100
Subject: [PATCH 3/6] refactor: 614 - eslint fix

---
 dev-data/about-course.data.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/dev-data/about-course.data.tsx b/dev-data/about-course.data.tsx
index a29d25b21..0b61f0d35 100644
--- a/dev-data/about-course.data.tsx
+++ b/dev-data/about-course.data.tsx
@@ -227,7 +227,8 @@ const reactEn: AboutCourseInfo[] = javaScriptEN().map((item) => {
       ...item,
       info: (
         <p>
-          Throughout the course, we mostly use{' '}
+          Throughout the course, we mostly use
+          {' '}
           <LinkCustom href={DISCORD_LINKS[COURSE_TITLES.REACT]} external>
             Discord chat
           </LinkCustom>

From 28e0252d36b4d180c35a32a0abf6dc0ca3438d71 Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Thu, 5 Dec 2024 18:20:59 +0100
Subject: [PATCH 4/6] refactor: 614 - add test

---
 src/widgets/hero-course/ui/hero-course.test.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/widgets/hero-course/ui/hero-course.test.tsx b/src/widgets/hero-course/ui/hero-course.test.tsx
index 53f24c2cc..3b24fd380 100644
--- a/src/widgets/hero-course/ui/hero-course.test.tsx
+++ b/src/widgets/hero-course/ui/hero-course.test.tsx
@@ -11,7 +11,7 @@ import { COURSE_TITLES } from 'data';
 const mockedCourse: Course = {
   id: '6',
   title: COURSE_TITLES.NODE,
-  subTitle: null,
+  subTitle: 'Test Subtitle',
   alias: COURSE_ALIASES.NODE,
   iconSrc: MOCKED_IMAGE_PATH,
   iconSmall: MOCKED_IMAGE_PATH,
@@ -54,4 +54,10 @@ describe('HeroCourse component', () => {
     expect(imageElement).toBeInTheDocument();
     expect(imageElement).toHaveAttribute('src', MOCKED_IMAGE_PATH.src);
   });
+
+  it('renders the subtitle when provided', async () => {
+    const subtitleElement = await screen.findByText('Test Subtitle');
+
+    expect(subtitleElement).toBeVisible();
+  });
 });

From 643cd5923b37b0a3c4304e304d267372c927ace4 Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Fri, 6 Dec 2024 10:45:17 +0100
Subject: [PATCH 5/6] refactor: 614 - update subtitle test

---
 .../hero-course/ui/hero-course.test.tsx       | 55 ++++++++++++-------
 1 file changed, 34 insertions(+), 21 deletions(-)

diff --git a/src/widgets/hero-course/ui/hero-course.test.tsx b/src/widgets/hero-course/ui/hero-course.test.tsx
index 3b24fd380..abf52cd2b 100644
--- a/src/widgets/hero-course/ui/hero-course.test.tsx
+++ b/src/widgets/hero-course/ui/hero-course.test.tsx
@@ -29,35 +29,48 @@ const mockedCourse: Course = {
 };
 
 describe('HeroCourse component', () => {
-  beforeEach(() => {
-    renderWithRouter(<HeroCourse course={mockedCourse} />);
-  });
+  describe('Render general content', () => {
+    beforeEach(() => {
+      renderWithRouter(<HeroCourse course={mockedCourse} />);
+    });
 
-  it('renders the title and label correctly', async () => {
-    const titleElement = await screen.findByText('Node.js Course');
-    const labelElement = screen.getByText('planned');
+    it('renders the title and label correctly', async () => {
+      const titleElement = await screen.findByText('Node.js Course');
+      const labelElement = screen.getByText('planned');
 
-    expect(titleElement).toBeVisible();
-    expect(labelElement).toBeVisible();
-  });
+      expect(titleElement).toBeVisible();
+      expect(labelElement).toBeVisible();
+    });
 
-  it('renders enroll button with correct label and href', () => {
-    const buttonElement = screen.getByRole('link', { name: /enroll/i });
+    it('renders enroll button with correct label and href', () => {
+      const buttonElement = screen.getByRole('link', { name: /enroll/i });
 
-    expect(buttonElement).toBeVisible();
-    expect(buttonElement).toHaveAttribute('href', 'https://test.com');
-  });
+      expect(buttonElement).toBeVisible();
+      expect(buttonElement).toHaveAttribute('href', 'https://test.com');
+    });
 
-  it('renders the image with correct source', () => {
-    const imageElement = screen.getByRole('img', { name: /Node.js/i });
+    it('renders the image with correct source', () => {
+      const imageElement = screen.getByRole('img', { name: /Node.js/i });
 
-    expect(imageElement).toBeInTheDocument();
-    expect(imageElement).toHaveAttribute('src', MOCKED_IMAGE_PATH.src);
+      expect(imageElement).toBeInTheDocument();
+      expect(imageElement).toHaveAttribute('src', MOCKED_IMAGE_PATH.src);
+    });
   });
 
-  it('renders the subtitle when provided', async () => {
-    const subtitleElement = await screen.findByText('Test Subtitle');
+  describe('Render subtitle', () => {
+    it('renders the subtitle when provided', async () => {
+      renderWithRouter(<HeroCourse course={mockedCourse} />);
+      const subtitleElement = await screen.findByText('Test Subtitle');
+
+      expect(subtitleElement).toBeVisible();
+    });
+
+    it('does not display subtitles if they are not provided', () => {
+      mockedCourse.subTitle = null;
+      renderWithRouter(<HeroCourse course={mockedCourse} />);
+      const subtitleElement = screen.queryByText('Test Subtitle');
 
-    expect(subtitleElement).toBeVisible();
+      expect(subtitleElement).toBeNull();
+    });
   });
 });

From b197aa716af40caac48d3d88bfc503f653caec57 Mon Sep 17 00:00:00 2001
From: YulikK <yulikpoch@gmail.com>
Date: Fri, 6 Dec 2024 12:23:00 +0100
Subject: [PATCH 6/6] refactor: 614 - update test

---
 .../hero-course/ui/hero-course.test.tsx       | 35 +++++++++++++------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/widgets/hero-course/ui/hero-course.test.tsx b/src/widgets/hero-course/ui/hero-course.test.tsx
index abf52cd2b..7c1b64775 100644
--- a/src/widgets/hero-course/ui/hero-course.test.tsx
+++ b/src/widgets/hero-course/ui/hero-course.test.tsx
@@ -27,6 +27,25 @@ const mockedCourse: Course = {
     accentColor: '#AEDF36',
   },
 };
+const mockedCourseNoSubtitle: Course = {
+  id: '6',
+  title: COURSE_TITLES.NODE,
+  subTitle: null,
+  alias: COURSE_ALIASES.NODE,
+  iconSrc: MOCKED_IMAGE_PATH,
+  iconSmall: MOCKED_IMAGE_PATH,
+  secondaryIcon: MOCKED_IMAGE_PATH,
+  startDate: dayJS().subtract(2, 'month').format('D MMM, YYYY'),
+  registrationEndDate: TO_BE_DETERMINED,
+  language: ['en'],
+  mode: 'online',
+  detailsUrl: `/${ROUTES.COURSES}/${ROUTES.NODE_JS}`,
+  enroll: 'https://test.com',
+  backgroundStyle: {
+    backgroundColor: '#F0F9F4',
+    accentColor: '#AEDF36',
+  },
+};
 
 describe('HeroCourse component', () => {
   describe('Render general content', () => {
@@ -34,12 +53,14 @@ describe('HeroCourse component', () => {
       renderWithRouter(<HeroCourse course={mockedCourse} />);
     });
 
-    it('renders the title and label correctly', async () => {
+    it('renders the title, label and subtitle correctly', async () => {
       const titleElement = await screen.findByText('Node.js Course');
       const labelElement = screen.getByText('planned');
+      const subtitleElement = await screen.findByText('Test Subtitle');
 
       expect(titleElement).toBeVisible();
       expect(labelElement).toBeVisible();
+      expect(subtitleElement).toBeVisible();
     });
 
     it('renders enroll button with correct label and href', () => {
@@ -57,17 +78,9 @@ describe('HeroCourse component', () => {
     });
   });
 
-  describe('Render subtitle', () => {
-    it('renders the subtitle when provided', async () => {
-      renderWithRouter(<HeroCourse course={mockedCourse} />);
-      const subtitleElement = await screen.findByText('Test Subtitle');
-
-      expect(subtitleElement).toBeVisible();
-    });
-
+  describe('Render widget with empty subtitle', () => {
     it('does not display subtitles if they are not provided', () => {
-      mockedCourse.subTitle = null;
-      renderWithRouter(<HeroCourse course={mockedCourse} />);
+      renderWithRouter(<HeroCourse course={mockedCourseNoSubtitle} />);
       const subtitleElement = screen.queryByText('Test Subtitle');
 
       expect(subtitleElement).toBeNull();