-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #312 from claushaas/staging
add pages for saved, completed and favorited lessons
- Loading branch information
Showing
11 changed files
with
588 additions
and
10 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
import {type LoaderFunctionArgs, unstable_defineLoader as defineLoader} from '@remix-run/node'; | ||
import {useLoaderData, type MetaArgs_SingleFetch} from '@remix-run/react'; | ||
import {LessonEntityCard} from '~/components/entities-cards'; | ||
import {LessonActivityService} from '~/services/lesson-activity.service.server'; | ||
import {LessonService} from '~/services/lesson.service.server'; | ||
import {type TypeUserSession} from '~/types/user-session.type'; | ||
import {getUserSession} from '~/utils/session.server'; | ||
|
||
export const meta = ({data}: MetaArgs_SingleFetch<typeof loader>) => [ | ||
{title: 'Yoga em Movimento - Área Pessoal - Aulas Assistidas'}, | ||
{name: 'description', content: 'Aulas assistidas por cada aluno.'}, | ||
{name: 'robots', content: 'noindex, nofollow'}, | ||
...data!.meta, | ||
]; | ||
|
||
export const loader = defineLoader(async ({request, response}: LoaderFunctionArgs) => { | ||
const userSession = await getUserSession(request.headers.get('Cookie')); | ||
const userData = userSession.data as TypeUserSession; | ||
|
||
if (!userData.id) { | ||
response!.headers.set('Location', '/'); | ||
response!.status = 303; | ||
|
||
throw response; // eslint-disable-line @typescript-eslint/only-throw-error | ||
} | ||
|
||
const completedLessons = await new LessonService().getCompletedLessonsByUser(userData); | ||
|
||
const completedLessonsWithActivity = completedLessons.data.map(lesson => ({ | ||
...lesson, | ||
activity: new LessonActivityService().getLessonActivityForUser(lesson.lessonSlug, userData.id), | ||
})); | ||
|
||
return { | ||
meta: [{tagName: 'link', rel: 'canonical', href: new URL('/profile/completed-lessons', request.url).toString()}], | ||
userData, | ||
completedLessonsWithActivity, | ||
}; | ||
}); | ||
|
||
export default function CompletedLessons() { | ||
const {completedLessonsWithActivity, userData} = useLoaderData<typeof loader>(); | ||
|
||
if (completedLessonsWithActivity.length === 0) { | ||
return ( | ||
<div> | ||
<h1>Aulas Assistidas</h1> | ||
<p>{userData.firstName}, você ainda não completou nenhuma aula. Conforme assistir as aulas e marcá-las como completas, a lista de suas aulas assistidas aparecerá aqui.</p> | ||
</div> | ||
); | ||
} | ||
|
||
return ( | ||
<div> | ||
<h1>Aulas Assistidas</h1> | ||
|
||
<div className='flex gap-4 my-4 flex-wrap'> | ||
{completedLessonsWithActivity.map(lesson => ( | ||
<LessonEntityCard key={lesson.id} course={lesson.lesson} to={lesson.link} activity={lesson.activity}/> | ||
))} | ||
</div> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
import {type LoaderFunctionArgs, unstable_defineLoader as defineLoader} from '@remix-run/node'; | ||
import {useLoaderData, type MetaArgs_SingleFetch} from '@remix-run/react'; | ||
import {LessonEntityCard} from '~/components/entities-cards'; | ||
import {LessonActivityService} from '~/services/lesson-activity.service.server'; | ||
import {LessonService} from '~/services/lesson.service.server'; | ||
import {type TypeUserSession} from '~/types/user-session.type'; | ||
import {getUserSession} from '~/utils/session.server'; | ||
|
||
export const meta = ({data}: MetaArgs_SingleFetch<typeof loader>) => [ | ||
{title: 'Yoga em Movimento - Área Pessoal - Aulas Favoritadas'}, | ||
{name: 'description', content: 'Aulas favoritadas de cada aluno.'}, | ||
{name: 'robots', content: 'noindex, nofollow'}, | ||
...data!.meta, | ||
]; | ||
|
||
export const loader = defineLoader(async ({request, response}: LoaderFunctionArgs) => { | ||
const userSession = await getUserSession(request.headers.get('Cookie')); | ||
const userData = userSession.data as TypeUserSession; | ||
|
||
if (!userData.id) { | ||
response!.headers.set('Location', '/'); | ||
response!.status = 303; | ||
|
||
throw response; // eslint-disable-line @typescript-eslint/only-throw-error | ||
} | ||
|
||
const favoritedLessons = await new LessonService().getFavoritedLessonsByUser(userData); | ||
|
||
const favoritedLessonsWithActivity = favoritedLessons.data.map(lesson => ({ | ||
...lesson, | ||
activity: new LessonActivityService().getLessonActivityForUser(lesson.lessonSlug, userData.id), | ||
})); | ||
|
||
return { | ||
meta: [{tagName: 'link', rel: 'canonical', href: new URL('/profile/completed-lessons', request.url).toString()}], | ||
userData, | ||
favoritedLessonsWithActivity, | ||
}; | ||
}); | ||
|
||
export default function FavoritedLessons() { | ||
const {favoritedLessonsWithActivity, userData} = useLoaderData<typeof loader>(); | ||
|
||
if (favoritedLessonsWithActivity.length === 0) { | ||
return ( | ||
<div> | ||
<h1>Aulas Favoritas</h1> | ||
<p>{userData.firstName}, você ainda não favoritou nenhuma aula. Conforme assistir as aulas e marcá-las como favoritas, a lista de suas aulas favoritas aparecerá aqui.</p> | ||
</div> | ||
); | ||
} | ||
|
||
return ( | ||
<div> | ||
<h1>Aulas Favoritas</h1> | ||
|
||
<div className='flex gap-4 my-4 flex-wrap'> | ||
{favoritedLessonsWithActivity.map(lesson => ( | ||
<LessonEntityCard key={lesson.id} course={lesson.lesson} to={lesson.link} activity={lesson.activity}/> | ||
))} | ||
</div> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
import {type LoaderFunctionArgs, unstable_defineLoader as defineLoader} from '@remix-run/node'; | ||
import {useLoaderData, type MetaArgs_SingleFetch} from '@remix-run/react'; | ||
import {LessonEntityCard} from '~/components/entities-cards'; | ||
import {LessonActivityService} from '~/services/lesson-activity.service.server'; | ||
import {LessonService} from '~/services/lesson.service.server'; | ||
import {type TypeUserSession} from '~/types/user-session.type'; | ||
import {getUserSession} from '~/utils/session.server'; | ||
|
||
export const meta = ({data}: MetaArgs_SingleFetch<typeof loader>) => [ | ||
{title: 'Yoga em Movimento - Área Pessoal - Aulas salvas'}, | ||
{name: 'description', content: 'Aulas salvadas por cada aluno.'}, | ||
{name: 'robots', content: 'noindex, nofollow'}, | ||
...data!.meta, | ||
]; | ||
|
||
export const loader = defineLoader(async ({request, response}: LoaderFunctionArgs) => { | ||
const userSession = await getUserSession(request.headers.get('Cookie')); | ||
const userData = userSession.data as TypeUserSession; | ||
|
||
if (!userData.id) { | ||
response!.headers.set('Location', '/'); | ||
response!.status = 303; | ||
|
||
throw response; // eslint-disable-line @typescript-eslint/only-throw-error | ||
} | ||
|
||
const savedLessons = await new LessonService().getSavedLessonsByUser(userData); | ||
|
||
const savedLessonsWithActivity = savedLessons.data.map(lesson => ({ | ||
...lesson, | ||
activity: new LessonActivityService().getLessonActivityForUser(lesson.lessonSlug, userData.id), | ||
})); | ||
|
||
return { | ||
meta: [{tagName: 'link', rel: 'canonical', href: new URL('/profile/completed-lessons', request.url).toString()}], | ||
userData, | ||
savedLessonsWithActivity, | ||
}; | ||
}); | ||
|
||
export default function CompletedLessons() { | ||
const {savedLessonsWithActivity, userData} = useLoaderData<typeof loader>(); | ||
|
||
if (savedLessonsWithActivity.length === 0) { | ||
return ( | ||
<div> | ||
<h1>Aulas Salvadas</h1> | ||
<p>{userData.firstName}, você ainda não salcou nenhuma aula. Conforme assistir as aulas e marcá-las como salvas, a lista de suas aulas salvadas aparecerá aqui.</p> | ||
</div> | ||
); | ||
} | ||
|
||
return ( | ||
<div> | ||
<h1>Aulas Salvadas</h1> | ||
|
||
<div className='flex gap-4 my-4 flex-wrap'> | ||
{savedLessonsWithActivity.map(lesson => ( | ||
<LessonEntityCard key={lesson.id} course={lesson.lesson} to={lesson.link} activity={lesson.activity}/> | ||
))} | ||
</div> | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,64 @@ | ||
import {type LoaderFunctionArgs, unstable_defineLoader as defineLoader} from '@remix-run/node'; | ||
import { | ||
Link, Outlet, useLocation, | ||
type MetaArgs_SingleFetch, | ||
useLoaderData, | ||
} from '@remix-run/react'; | ||
import {NavigateBar} from '~/components/navigation-bar.js'; | ||
import {type TypeUserSession} from '~/types/user-session.type'; | ||
import {getUserSession} from '~/utils/session.server'; | ||
|
||
export const meta = ({data}: MetaArgs_SingleFetch<typeof loader>) => [ | ||
{title: 'Yoga em Movimento - Área Pessoal'}, | ||
{name: 'description', content: 'Área pessoal de cada aluno dentro do site da Yoga em Movimento.'}, | ||
{name: 'robots', content: 'noindex, nofollow'}, | ||
...data!.meta, | ||
]; | ||
|
||
export const loader = defineLoader(async ({request, response}: LoaderFunctionArgs) => { | ||
const userSession = await getUserSession(request.headers.get('Cookie')); | ||
const data = userSession.data as TypeUserSession; | ||
|
||
if (!data.id) { | ||
response!.headers.set('Location', '/'); | ||
response!.status = 303; | ||
|
||
throw response; // eslint-disable-line @typescript-eslint/only-throw-error | ||
} | ||
|
||
return { | ||
meta: [{tagName: 'link', rel: 'canonical', href: new URL('/profile', request.url).toString()}], | ||
userData: data, | ||
}; | ||
}); | ||
|
||
export default function Profile() { | ||
const {userData} = useLoaderData<typeof loader>(); | ||
const {pathname} = useLocation(); | ||
|
||
return userData?.id && ( | ||
<> | ||
<NavigateBar userData={userData}/> | ||
|
||
<div className='flex max-w-[95%] w-full mx-auto flex-col sm:flex-row gap-4'> | ||
<aside className='w-64 p-3 bg-mauve-3 dark:bg-mauvedark-3 shadow-sm shadow-mauve-11 dark:shadow-mauvedark-3 rounded-lg h-fit flex flex-col gap-3'> | ||
<Link to='/profile/completed-lessons'> | ||
<p>Aulas Assistidas</p> | ||
</Link> | ||
<Link to='/profile/saved-lessons'> | ||
<p>Aulas Salvadas</p> | ||
</Link> | ||
<Link to='/profile/favorited-lessons'> | ||
<p>Aulas Favoritadas</p> | ||
</Link> | ||
</aside> | ||
<main className='flex-grow flex-shrink p-3'> | ||
{(pathname === '/profile' || pathname === '/profile/') && ( | ||
<p>Selecione a opção no menu ao lado</p> | ||
)} | ||
<Outlet/> | ||
</main> | ||
</div> | ||
</> | ||
); | ||
} |
Oops, something went wrong.