Merge branch 'develop' into feature/new-active-cooperation-design

.github/dependabot.yml

@@ -0,0 +1,8 @@
+# https://docs.github.com/code-security/dependabot/dependabot-version-updates/configuration-options-for-the-dependabot.yml-file
+
+version: 2
+updates:
+  - package-ecosystem: "npm" # See documentation for possible values
+    directory: "/"           # Location of package manifests
+    schedule:
+      interval: "weekly"

src/components/icon-extension-with-title/IconExtensionWithTitle.tsx

@@ -4,10 +4,7 @@ import Box from '@mui/material/Box'
 
 import TitleWithDescription from '~/components/title-with-description/TitleWithDescription'
 
-import {
-  convertBytesToProperFormat,
-  parseFileName
-} from '~/utils/helper-functions'
+import { convertBytesToProperFormat } from '~/utils/helper-functions'
 import { styles } from '~/components/icon-extension-with-title/IconExtensionWithTitle.styles'
 
 interface IconExtensionWithTitleProps {
@@ -25,20 +22,14 @@ const IconExtensionWithTitle: FC<IconExtensionWithTitleProps> = ({
 }) => {
   const { t } = useTranslation()
 
-  const { fileExtension } = parseFileName(title)
-
   const convertSize = (incomingSize: number) => {
     const { size: properSize, unit } = convertBytesToProperFormat(incomingSize)
     return properSize + ' ' + t(`common.${unit}`)
   }
 
   return (
     <Box sx={styles.container}>
-      {icon ? (
-        <Box sx={styles.svgBox}>{icon}</Box>
-      ) : (
-        <Box sx={styles.iconBox}>{fileExtension}</Box>
-      )}
+      {icon && <Box sx={styles.svgBox}>{icon}</Box>}
       <TitleWithDescription
         description={size ? convertSize(size) : description}
         isDescriptionTooltip

src/components/profile-item/ProfileItem.tsx

@@ -35,10 +35,11 @@ const ProfileItem = ({
   const isOffer = item.id === 'offer'
 
   const handleItemClick = () => {
+    if (isClickable || isOffer) {
+      navigate(`${item.path}#${item.id}`)
+    }
     if (isOffer) {
       handleOpenDrawer()
-    } else if (isClickable) {
-      navigate(`${item.path}#${item.id}`)
     }
   }
 

src/components/profile-item/complete-profile.constants.tsx

@@ -37,7 +37,7 @@ export const profileItemsTutor: ProfileItemType[] = [
   {
     id: 'offer',
     icon: <LeakAddIcon />,
-    path: ''
+    path: authRoutes.myProfile.path
   }
 ]
 
@@ -60,7 +60,7 @@ export const profileItemsStudent: ProfileItemType[] = [
   {
     id: 'offer',
     icon: <LeakAddIcon />,
-    path: ''
+    path: authRoutes.myProfile.path
   }
 ]
 

src/constants/request.ts

@@ -37,6 +37,9 @@ export const URLs = {
     create: '/courses',
     patch: '/courses'
   },
+  coursesAndCooperations: {
+    getByResourceId: '/courses-cooperations/resource/'
+  },
   categories: {
     get: '/categories',
     getNames: '/categories/names',

src/containers/add-resources/AddAttachments.constants.tsx

@@ -1,4 +1,5 @@
 import Typography from '@mui/material/Typography'
+import DescriptionOutlinedIcon from '@mui/icons-material/DescriptionOutlined'
 
 import AppChip from '~/components/app-chip/AppChip'
 import IconExtensionWithTitle from '~/components/icon-extension-with-title/IconExtensionWithTitle'
@@ -16,7 +17,10 @@ export const columns = [
     label: 'myResourcesPage.attachments.file',
     field: 'fileName',
     calculatedCellValue: (attachment: Attachment) => (
-      <IconExtensionWithTitle title={attachment.fileName} />
+      <IconExtensionWithTitle
+        icon={<DescriptionOutlinedIcon />}
+        title={attachment.fileName}
+      />
     )
   },
 

src/containers/add-resources/AddLessons.constants.tsx

@@ -1,5 +1,5 @@
-import ListAltIcon from '@mui/icons-material/ListAlt'
 import Typography from '@mui/material/Typography'
+import ArticleOutlinedIcon from '@mui/icons-material/ArticleOutlined'
 
 import AppChip from '~/components/app-chip/AppChip'
 import IconExtensionWithTitle from '~/components/icon-extension-with-title/IconExtensionWithTitle'
@@ -13,7 +13,10 @@ export const columns = [
     label: 'myResourcesPage.lessons.title',
     field: 'title',
     calculatedCellValue: (lesson: Lesson) => (
-      <IconExtensionWithTitle icon={<ListAltIcon />} title={lesson.title} />
+      <IconExtensionWithTitle
+        icon={<ArticleOutlinedIcon />}
+        title={lesson.title}
+      />
     )
   },
   {

src/containers/change-resource-confirm-modal/ChangeResourceConfirmModal.tsx

@@ -5,19 +5,12 @@ import { useTranslation } from 'react-i18next'
 import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'
 
 import AppButton from '~/components/app-button/AppButton'
-
-import {
-  ButtonVariantEnum,
-  Course,
-  GetCoursesParams,
-  ItemsWithCount,
-  SizeEnum
-} from '~/types'
 import { styles } from '~/containers/change-resource-confirm-modal/ChangeResourceConfirmModal.styles'
 import { useModalContext } from '~/context/modal-context'
 import Loader from '~/components/loader/Loader'
 import useAxios from '~/hooks/use-axios'
-import { CourseService } from '~/services/course-service'
+import { CoursesAndCooperationsService } from '~/services/course-cooperation-service'
+import { ButtonVariantEnum, CourseCooperationResponse, SizeEnum } from '~/types'
 
 interface ChangeResourceConfirmModalProps {
   resourceId?: string
@@ -26,51 +19,54 @@ interface ChangeResourceConfirmModalProps {
 }
 
 const ChangeResourceConfirmModal = ({
-  resourceId,
+  resourceId = '',
   title,
   onConfirm
 }: ChangeResourceConfirmModalProps) => {
   const { t } = useTranslation()
   const { closeModal } = useModalContext()
 
-  //! replace when new endpoint is ready
-  const { response: coursesResponse, loading } = useAxios<
-    ItemsWithCount<Course>,
-    GetCoursesParams
-  >({
-    service: CourseService.getCourses,
-    defaultResponse: { items: [], count: 0 },
+  const getCoursesAndCooperationsByResourceId = useCallback(
+    () => CoursesAndCooperationsService.getByResourceId(resourceId),
+    [resourceId]
+  )
+
+  const { response, loading } = useAxios({
+    service: getCoursesAndCooperationsByResourceId,
+    defaultResponse: {
+      courses: [],
+      cooperations: []
+    } as CourseCooperationResponse,
     fetchOnMount: true
   })
 
-  const courseList = useMemo(
-    () =>
-      coursesResponse.items
-        .filter((item) => item.sections[0].resources?.length)
-        .filter((item) =>
-          item.sections.some((res) =>
-            res.resources.some((val) => val.resource._id == resourceId)
-          )
-        )
-        .map((item) => ({
-          id: item._id,
-          title: item.title,
-          subTitle: 'course'
-        })),
-    [coursesResponse.items, resourceId]
+  const courses = response.courses.map((course) => ({
+    id: course._id,
+    title: course.title,
+    subTitle: 'course'
+  }))
+
+  const cooperations = response?.cooperations.map((cooperation) => ({
+    id: cooperation._id,
+    title: cooperation.title,
+    subTitle: 'cooperation'
+  }))
+
+  const affectedItems = useMemo(
+    () => [...courses, ...cooperations],
+    [courses, cooperations]
   )
-  ////////////////////////////////////!
 
   const handleConfirm = useCallback(() => {
     closeModal()
     onConfirm?.()
   }, [closeModal, onConfirm])
 
   useEffect(() => {
-    if (!loading && !courseList?.length) {
+    if (!loading && !affectedItems.length) {
       handleConfirm()
     }
-  }, [courseList, handleConfirm, loading])
+  }, [affectedItems, handleConfirm, loading])
 
   if (loading) {
     return (
@@ -80,7 +76,7 @@ const ChangeResourceConfirmModal = ({
     )
   }
 
-  if (!loading && !courseList?.length) {
+  if (!loading && !affectedItems?.length) {
     return null
   }
 
@@ -107,7 +103,7 @@ const ChangeResourceConfirmModal = ({
         </Typography>
       </Box>
       <Box sx={styles.lessonsListContainer}>
-        {courseList.map((el) => (
+        {affectedItems.map((el) => (
           <Box key={el.id} sx={styles.listItems}>
             <Typography sx={styles.listTitles}>{el.title}</Typography>
             <Typography sx={styles.listSubtitle}>

src/containers/course-section/CourseSectionContainer.constants.tsx

@@ -1,6 +1,6 @@
-import ListAltIcon from '@mui/icons-material/ListAlt'
 import NoteAltOutlinedIcon from '@mui/icons-material/NoteAltOutlined'
 import DescriptionOutlinedIcon from '@mui/icons-material/DescriptionOutlined'
+import ArticleOutlinedIcon from '@mui/icons-material/ArticleOutlined'
 import { ResourcesTabsEnum, ResourcesTypesEnum as ResourceType } from '~/types'
 
 export const menuTypes = {
@@ -11,7 +11,7 @@ export const menuTypes = {
 export const resourcesData = {
   lessons: {
     resourceTab: ResourcesTabsEnum.Lessons,
-    icon: <ListAltIcon />
+    icon: <ArticleOutlinedIcon />
   },
   quizzes: {
     resourceTab: ResourcesTabsEnum.Quizzes,

src/containers/my-resources/attachments-container/AttachmentsContainer.constants.tsx

@@ -1,5 +1,6 @@
 import Typography from '@mui/material/Typography'
 import AddIcon from '@mui/icons-material/Add'
+import DescriptionOutlinedIcon from '@mui/icons-material/DescriptionOutlined'
 
 import IconExtensionWithTitle from '~/components/icon-extension-with-title/IconExtensionWithTitle'
 import AppChip from '~/components/app-chip/AppChip'
@@ -22,6 +23,7 @@ export const columns = (
     calculatedCellValue: (item: Attachment) => (
       <IconExtensionWithTitle
         description={item.description}
+        icon={<DescriptionOutlinedIcon />}
         title={item.fileName}
       />
     )

src/containers/my-resources/lessons-container/LessonsContainer.constants.tsx

@@ -1,6 +1,6 @@
-import ListAltIcon from '@mui/icons-material/ListAlt'
 import Box from '@mui/material/Box'
 import Typography from '@mui/material/Typography'
+import ArticleOutlinedIcon from '@mui/icons-material/ArticleOutlined'
 
 import { styles } from '~/containers/my-resources/lessons-container/LessonsContainer.styles'
 import AppChip from '~/components/app-chip/AppChip'
@@ -29,7 +29,7 @@ export const columns: TableColumn<Lesson>[] = [
 
       return (
         <Box onClick={navigateLesson} sx={styles.lessonTitleContainer}>
-          <ListAltIcon sx={styles.lessonIcon} />
+          <ArticleOutlinedIcon sx={styles.lessonIcon} />
           <Typography sx={styles.lessonTitle}>{item.title}</Typography>
         </Box>
       )

src/containers/offer-page/create-or-edit-offer/CreateOrEditOffer.tsx

@@ -1,6 +1,6 @@
 import { FC, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate, useLocation } from 'react-router-dom'
 import LeakAddSharpIcon from '@mui/icons-material/LeakAddSharp'
 import Typography from '@mui/material/Typography'
 import Box from '@mui/material/Box'
@@ -53,6 +53,7 @@ const CreateOrEditOffer: FC<CreateOrUpdateOfferProps> = ({
   const dispatch = useAppDispatch()
   const { t } = useTranslation()
   const navigate = useNavigate()
+  const { hash } = useLocation()
 
   const offerAction = existingOffer
     ? OfferActionsEnum.Edit
@@ -74,12 +75,16 @@ const CreateOrEditOffer: FC<CreateOrUpdateOfferProps> = ({
       })
     )
     closeDrawer()
-    navigate(
-      createUrlPath(
-        authRoutes.offerDetails.path,
-        existingOffer?._id ?? response?._id
+    if (hash == '#offer') {
+      navigate(`${authRoutes.myProfile.path}#complete`)
+    } else {
+      navigate(
+        createUrlPath(
+          authRoutes.offerDetails.path,
+          existingOffer?._id ?? response?._id
+        )
       )
-    )
+    }
   }
 
   const { loading, fetchData } = useAxios<

src/pages/my-resources/MyResources.constants.tsx

@@ -1,7 +1,8 @@
 import { ReactElement } from 'react'
 
 import ArticleOutlinedIcon from '@mui/icons-material/ArticleOutlined'
-import AttachFileIcon from '@mui/icons-material/AttachFile'
+import DescriptionOutlinedIcon from '@mui/icons-material/DescriptionOutlined'
+
 import NoteAltOutlinedIcon from '@mui/icons-material/NoteAltOutlined'
 import QuizOutlinedIcon from '@mui/icons-material/QuizOutlined'
 import CategoryIcon from '@mui/icons-material/Category'
@@ -42,7 +43,7 @@ export const tabsData: MyResourcesTabsData = {
   [ResourcesTabsEnum.Attachments]: {
     title: 'myResourcesPage.tabs.attachments',
     content: <AttachmentsContainer />,
-    icon: <AttachFileIcon />
+    icon: <DescriptionOutlinedIcon />
   },
   [ResourcesTabsEnum.Categories]: {
     title: 'myResourcesPage.tabs.categories',

src/services/course-cooperation-service.ts

@@ -0,0 +1,14 @@
+import { AxiosResponse } from 'axios'
+import { URLs } from '~/constants/request'
+import { axiosClient } from '~/plugins/axiosClient'
+import { CourseCooperationResponse } from '~/types'
+import { createUrlPath } from '~/utils/helper-functions'
+
+export const CoursesAndCooperationsService = {
+  getByResourceId: async (
+    resourceId: string
+  ): Promise<AxiosResponse<CourseCooperationResponse>> =>
+    await axiosClient.get(
+      createUrlPath(URLs.coursesAndCooperations.getByResourceId, resourceId)
+    )
+}

src/types/common/interfaces/common.interfaces.ts

@@ -3,7 +3,9 @@ import {
   UpdateFiltersInQuery,
   UserResponse,
   UserGeneralInfo,
-  UserRoleEnum
+  UserRoleEnum,
+  Course,
+  Cooperation
 } from '~/types'
 
 export interface ItemsWithCount<T> {
@@ -26,6 +28,11 @@ export interface DataByRole<T> {
   [UserRoleEnum.Tutor]: T
 }
 
+export type CourseCooperationResponse = {
+  courses: Course[]
+  cooperations: Cooperation[]
+}
+
 export interface CategoryInterface {
   _id: string
   name: string

tests/unit/components/icon-extention-with-title/IconExtentionWithTitle.spec.jsx

@@ -15,12 +15,6 @@ describe('IconExtensionWithTitle test', () => {
     expect(title).toBeInTheDocument()
   })
 
-  it('Should render icon text', () => {
-    const iconText = screen.getByText('doc')
-
-    expect(iconText).toBeInTheDocument()
-  })
-
   it('Should render description', () => {
     const description = screen.getByText('21.3 common.kilobytes')