835-fix: Stale data on the website

src/core/base-layout/components/footer/all-courses.tsx

@@ -0,0 +1,30 @@
+'use client';
+
+import type { Course } from '@/entities/course';
+import { getActualData } from '@/shared/helpers/getActualData';
+import { SchoolMenu } from '@/widgets/school-menu';
+
+type AllCoursesProps = {
+  courses: Course[];
+};
+
+const AllCourses = ({ courses }: AllCoursesProps) => {
+  const actualCourses = getActualData({
+    data: courses,
+    filterStale: false,
+    sort: false,
+  });
+
+  return actualCourses.map((course) => (
+    <SchoolMenu.Item
+      key={course.id}
+      icon={course.iconFooter}
+      title={course.title}
+      description={course.startDate}
+      url={course.detailsUrl}
+      color="light"
+    />
+  ));
+};
+
+export default AllCourses;

src/core/base-layout/components/footer/desktop-view.tsx

@@ -1,4 +1,5 @@
 import { AboutList } from './about-list';
+import AllCourses from '@/core/base-layout/components/footer/all-courses';
 import { getCourses } from '@/entities/course/api/course-api';
 import { SchoolMenu } from '@/widgets/school-menu';
 import { schoolMenuStaticLinks } from 'data';
@@ -25,16 +26,7 @@ export const DesktopView = async () => {
 
       <div className="right">
         <SchoolMenu heading="all courses" color="light">
-          {courses.map((course) => (
-            <SchoolMenu.Item
-              key={course.id}
-              icon={course.iconFooter}
-              title={course.title}
-              description={course.startDate}
-              url={course.detailsUrl}
-              color="light"
-            />
-          ))}
+          <AllCourses courses={courses} />
         </SchoolMenu>
       </div>
     </div>

src/core/base-layout/components/header/all-courses.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import { Course } from '@/entities/course';
+import { getActualData } from '@/shared/helpers/getActualData';
+import { SchoolMenu } from '@/widgets/school-menu';
+
+type AllCoursesProps = {
+  courses: Course[];
+};
+
+const AllCourses = ({ courses }: AllCoursesProps) => {
+  const actualCourses = getActualData({
+    data: courses,
+    filterStale: false,
+    sort: false,
+  });
+
+  return actualCourses.map((course) => (
+    <SchoolMenu.Item
+      key={course.id}
+      icon={course.iconSmall}
+      title={course.title}
+      description={course.startDate}
+      url={course.detailsUrl}
+    />
+  ));
+};
+
+export default AllCourses;

src/core/base-layout/components/header/header.tsx

@@ -6,6 +6,7 @@ import { usePathname } from 'next/navigation';
 
 import { BurgerMenu } from './burger/burger';
 import { NavItem } from './nav-item/nav-item';
+import AllCourses from '@/core/base-layout/components/header/all-courses';
 import { ANCHORS, ROUTES } from '@/core/const';
 import { Course } from '@/entities/course';
 import { Logo } from '@/shared/ui/logo';
@@ -87,15 +88,7 @@ export const Header = ({ courses }: HeaderProps) => {
           </NavItem>
           <NavItem label="Courses" href={ROUTES.COURSES}>
             <SchoolMenu>
-              {courses.map((course) => (
-                <SchoolMenu.Item
-                  key={course.id}
-                  icon={course.iconSmall}
-                  title={course.title}
-                  description={course.startDate}
-                  url={course.detailsUrl}
-                />
-              ))}
+              <AllCourses courses={courses} />
             </SchoolMenu>
           </NavItem>
           <NavItem label="Community" href={ROUTES.COMMUNITY}>

src/shared/helpers/getActualData.ts

@@ -11,18 +11,36 @@ type GetActualDataParams<T extends DataType> = {
   data: T;
   staleAfter?: number;
   filterStale?: boolean;
+  isMentorship?: boolean;
+  sort?: boolean;
 };
 
 type GetActualDataType = <T extends DataType>(params: GetActualDataParams<T>) => T;
 
-export const getActualData: GetActualDataType = ({ data, staleAfter, filterStale = true }) => {
-  let dataWithTBD = mapStaleAsTBD(data, staleAfter);
+export const getActualData: GetActualDataType = ({
+  data,
+  staleAfter,
+  filterStale = true,
+  isMentorship = false,
+  sort = true,
+}) => {
+  let dataWithTBD;
+
+  if (isMentorship) {
+    dataWithTBD = mapMentorshipStaleAsTBD(data);
+  } else {
+    dataWithTBD = mapStaleAsTBD(data, staleAfter);
+  }
 
   if (filterStale) {
     dataWithTBD = filterStaleData(dataWithTBD);
   }
 
-  return sortData(dataWithTBD);
+  if (sort) {
+    dataWithTBD = sortData(dataWithTBD);
+  }
+
+  return dataWithTBD;
 };
 
 const mapStaleAsTBD = <T extends DataType>(data: T, staleAfter?: number): T =>
@@ -45,6 +63,37 @@ const mapStaleAsTBD = <T extends DataType>(data: T, staleAfter?: number): T =>
     };
   }) as T;
 
+const mapMentorshipStaleAsTBD = <T extends DataType>(data: T): T => {
+  if ('eventType' in data) {
+    return data;
+  }
+
+  return (data as Course[]).map((item) => {
+    const date = item.personalMentoringStartDate;
+
+    if (!date) {
+      return item;
+    }
+
+    const daysBeforeStale = dayJS(item.personalMentoringEndDate).diff(
+      item.personalMentoringStartDate,
+      'd',
+    );
+
+    const startDate = getCourseDate(date, daysBeforeStale);
+
+    if (startDate === TO_BE_DETERMINED) {
+      return {
+        ...item,
+        personalMentoringStartDate: null,
+        personalMentoringEndDate: null,
+      };
+    }
+
+    return item;
+  }) as T;
+};
+
 const filterStaleData = <T extends DataType>(data: T): T =>
   data.filter((item) => {
     const date = isCourse(item) ? item.startDate : item.date;

src/shared/ui/short-info-panel/course-start-label.tsx

@@ -0,0 +1,28 @@
+'use client';
+
+import { PropsWithChildren } from 'react';
+
+import { calculateFreshDate } from '@/shared/helpers/getCourseDate';
+import { DateSimple } from '@/shared/ui/date-simple';
+
+type CourseStartLabelProps = PropsWithChildren & {
+  startDate: string | null;
+  registrationEndDate: string | null;
+  label: string | undefined;
+};
+
+export const CourseStartLabel = ({
+  startDate,
+  registrationEndDate,
+  label,
+  children,
+}: CourseStartLabelProps) => {
+  const freshDate =
+    startDate && registrationEndDate ? calculateFreshDate(startDate, registrationEndDate) : null;
+
+  return (
+    <DateSimple label={label} startDate={freshDate}>
+      {children}
+    </DateSimple>
+  );
+};

src/shared/ui/short-info-panel/short-info-panel.tsx

@@ -1,11 +1,10 @@
 import classNames from 'classnames/bind';
 import Image from 'next/image';
 
-import { DateSimple } from '../date-simple';
 import micIcon from '@/shared/assets/icons/mic.svg';
 import { LABELS } from '@/shared/constants';
-import { calculateFreshDate } from '@/shared/helpers/getCourseDate';
 import { Language } from '@/shared/types';
+import { CourseStartLabel } from '@/shared/ui/short-info-panel/course-start-label';
 
 import styles from './short-info-panel.module.scss';
 
@@ -34,20 +33,17 @@ export const ShortInfoPanel = ({
 
   return (
     <section className={cx('info', { margin: withMargin })}>
-      <DateSimple
+      <CourseStartLabel
+        startDate={startDate}
+        registrationEndDate={registrationEndDate}
         label={label}
-        startDate={
-          startDate && registrationEndDate
-            ? calculateFreshDate(startDate, registrationEndDate)
-            : null
-        }
       >
         {onlyLanguage && (
           <span className={cx('language')} data-testid="course-language">
             {courseLanguage}
           </span>
         )}
-      </DateSimple>
+      </CourseStartLabel>
       {!onlyLanguage && (
         <p className={cx('additional-info')}>
           <Image className={cx('icon')} src={micIcon} alt="microphone-icon" />

src/views/mentorship/ui/mentorship-courses/course-items.tsx

@@ -0,0 +1,30 @@
+'use client';
+
+import React from 'react';
+
+import { Course, CourseCard } from '@/entities/course';
+import { getActualData } from '@/shared/helpers/getActualData';
+import {
+  transformCoursesToMentorship,
+} from '@/views/mentorship/helpers/transformCoursesToMentorship';
+
+type CourseItems = {
+  courses: Course[];
+  className: string;
+};
+
+const CourseItems = ({ courses, className }: CourseItems) => {
+  const actualCourses = getActualData({
+    data: courses,
+    filterStale: false,
+    isMentorship: true,
+    sort: false,
+  });
+  const coursesWithMentorship = transformCoursesToMentorship(actualCourses);
+
+  return coursesWithMentorship.map((course) => (
+    <CourseCard key={course.id} className={className} {...course} showMentoringStartDate={true} />
+  ));
+};
+
+export default CourseItems;

src/views/mentorship/ui/mentorship-courses/mentorship-courses.tsx

@@ -1,32 +1,22 @@
 import classNames from 'classnames/bind';
 
-import { CourseCard } from '@/entities/course';
 import { getCourses } from '@/entities/course/api/course-api';
 import { WidgetTitle } from '@/shared/ui/widget-title';
-import {
-  transformCoursesToMentorship,
-} from '@/views/mentorship/helpers/transformCoursesToMentorship';
+import CourseItems from '@/views/mentorship/ui/mentorship-courses/course-items';
 
 import styles from './mentorship-courses.module.scss';
 
 const cx = classNames.bind(styles);
 
 export const MentorshipCourses = async () => {
-  const coursesWithMentorship = transformCoursesToMentorship(await getCourses());
+  const courses = await getCourses();
 
   return (
     <section className={cx('mentorship-courses', 'container')}>
       <div className={cx('content')}>
         <WidgetTitle>Courses That Need Mentors</WidgetTitle>
         <div className={cx('courses-list')}>
-          {coursesWithMentorship.map((course) => (
-            <CourseCard
-              key={course.id}
-              className={cx('mentorship-course-card')}
-              {...course}
-              showMentoringStartDate={true}
-            />
-          ))}
+          <CourseItems courses={courses} className={cx('mentorship-course-card')} />
         </div>
       </div>
     </section>

src/widgets/courses/ui/course-items.tsx

@@ -0,0 +1,23 @@
+'use client';
+
+import { Course, CourseCard } from '@/entities/course';
+import { getActualData } from '@/shared/helpers/getActualData';
+
+type CourseItemsProps = {
+  courses: Course[];
+};
+
+const CourseItems = ({ courses }: CourseItemsProps) => {
+  const actualCourses = getActualData({
+    data: courses,
+    filterStale: false,
+  });
+
+  return (
+    actualCourses.map((course) =>
+      <CourseCard size="sm" key={course.id} {...course} />,
+    )
+  );
+};
+
+export default CourseItems;

src/widgets/courses/ui/courses.tsx

@@ -1,9 +1,8 @@
 import classNames from 'classnames/bind';
 
-import { type Course, CourseCard } from '@/entities/course';
 import { getCourses } from '@/entities/course/api/course-api';
-import { getActualData } from '@/shared/helpers/getActualData';
 import { WidgetTitle } from '@/shared/ui/widget-title';
+import CourseItems from '@/widgets/courses/ui/course-items';
 
 import styles from './courses.module.scss';
 
@@ -12,21 +11,12 @@ const cx = classNames.bind(styles);
 export const Courses = async () => {
   const courses = await getCourses();
 
-  const sortParams = {
-    data: courses,
-    filterStale: false,
-  };
-
-  const sortedCourses: Course[] = getActualData(sortParams);
-
   return (
     <section className={cx('container')} data-testid="all-courses">
       <div className={cx('content', 'courses-content')}>
         <WidgetTitle>All courses</WidgetTitle>
         <div className={cx('courses-list')}>
-          {sortedCourses.map((course) => {
-            return <CourseCard size="sm" key={course.id} {...course} />;
-          })}
+          <CourseItems courses={courses} />
         </div>
       </div>
     </section>

src/widgets/hero-course/ui/availability-status.tsx

@@ -0,0 +1,16 @@
+'use client';
+
+import { dayJS } from '@/shared/helpers/dayJS';
+import { SectionLabel } from '@/shared/ui/section-label';
+import { getCourseStatus } from '@/widgets/hero-course/helpers/get-course-status';
+
+type AvailabilityStatusProps = {
+  startDate: string;
+  registrationEndDate: string;
+};
+
+export const AvailabilityStatus = ({ startDate, registrationEndDate }: AvailabilityStatusProps) => {
+  const status = getCourseStatus(startDate, dayJS(registrationEndDate).diff(startDate, 'd'));
+
+  return <SectionLabel data-testid="course-label">{status}</SectionLabel>;
+};