Explicação do Código

1. Importação do Contexto de Cursos 📚

import { useCourses } from '@/components/context/CoursesContext'

Aqui, estamos importando o hook useCourses do contexto de cursos. Este hook oferece funções e dados relacionados ao contexto global dos cursos no projeto, o que facilita o acesso aos dados do curso em diferentes partes da aplicação.

2. Definição do Hook useCourseDetails 🎯

export const useCourseDetails = ({ slug, moduleIndex, lessonIndex }) => {

Definimos o hook useCourseDetails, que recebe um objeto com as propriedades slug, moduleIndex e lessonIndex. Essas propriedades são usadas para buscar os detalhes de um curso específico, módulo e lição. O hook pode ser utilizado em qualquer componente que precise desses detalhes.

3. Desestruturação do Hook useCourses 🔄

  const { getCourseDetails, loading, error } = useCourses()

Dentro do hook useCourseDetails, estamos desestruturando o retorno do hook useCourses:

• getCourseDetails: Função que obtém os detalhes do curso com base no slug, índice do módulo e índice da lição.
• loading: Indicador booleano que mostra se os dados estão sendo carregados.
• error: Indicador que sinaliza se ocorreu algum erro na busca dos dados.

4. Verificação de Carregamento ou Erro ⚠️

  if (loading || error) {
    return { loading, error, course: null, module: null, lesson: null }
  }

Antes de continuar, verificamos se o estado está loading (carregando) ou se ocorreu algum error. Se algum desses estados for verdadeiro, o hook retorna:

• loading: O estado de carregamento.
• error: O erro ocorrido.
• course, module, lesson: Como não há dados disponíveis, são retornados como null.

5. Ajuste dos Índices do Módulo e da Lição 🔢

  const adjustedModuleIndex = parseInt(moduleIndex) - 1
  const adjustedLessonIndex = parseInt(lessonIndex) - 1

Aqui, ajustamos os índices de módulo e lição. Os índices no moduleIndex e lessonIndex geralmente são passados como strings e começam do 1. No entanto, os arrays em JavaScript são baseados em índice 0, então subtraímos 1 de cada índice para garantir que a busca pelos módulos e lições seja feita corretamente.

6. Obtenção dos Detalhes do Curso, Módulo e Lição 📑

  const { course, courseModule, lesson } = getCourseDetails({
    slug,
    moduleIndex: adjustedModuleIndex,
    lessonIndex: adjustedLessonIndex,
  })

Agora, chamamos a função getCourseDetails, passando os parâmetros ajustados moduleIndex e lessonIndex junto com o slug. A função retorna os detalhes do curso, módulo e lição, que são desestruturados e armazenados nas variáveis course, courseModule e lesson.

7. Retorno do Hook 📬

  return { loading, error, course, module: courseModule, lesson }

Finalmente, o hook retorna um objeto contendo:

• loading: O estado de carregamento.
• error: O erro (se houver).
• course: Os detalhes do curso.
• module: Os detalhes do módulo, obtidos de courseModule.
• lesson: Os detalhes da lição.

8. Exportação do Hook 🔄

export { useCourseDetails }

Por fim, o hook useCourseDetails é exportado para que possa ser utilizado em outros componentes da aplicação.

Código Completo 📜

'use client'
 
import { useCourses } from '@/components/context/CoursesContext'
 
export const useCourseDetails = ({ slug, moduleIndex, lessonIndex }) => {
  const { getCourseDetails, loading, error } = useCourses()
 
  if (loading || error) {
    return { loading, error, course: null, module: null, lesson: null }
  }
 
  const adjustedModuleIndex = parseInt(moduleIndex) - 1
  const adjustedLessonIndex = parseInt(lessonIndex) - 1
 
  const { course, courseModule, lesson } = getCourseDetails({
    slug,
    moduleIndex: adjustedModuleIndex,
    lessonIndex: adjustedLessonIndex,
  })
 
  return { loading, error, course, module: courseModule, lesson }
}