fix: data revalidation for collections and courses

fix: add collections tag to request
This commit is contained in:
swve 2023-08-21 19:11:03 +02:00
parent b582eaacfc
commit 7f4c2c7738
13 changed files with 28 additions and 23 deletions

View file

@ -15,7 +15,7 @@ const CollectionAdminEditsArea = (props: any) => {
const deleteCollectionUI = async (collectionId: number) => { const deleteCollectionUI = async (collectionId: number) => {
await deleteCollection(collectionId); await deleteCollection(collectionId);
revalidateTags(["collections"], props.orgslug); await revalidateTags(["collections"], props.orgslug);
// reload the page // reload the page
router.refresh(); router.refresh();
router.push(getUriWithOrg(props.orgslug, "/collections")); router.push(getUriWithOrg(props.orgslug, "/collections"));

View file

@ -44,11 +44,10 @@ function NewCollection(params: any) {
org_id: org.org_id, org_id: org.org_id,
}; };
await createCollection(collection); await createCollection(collection);
revalidateTags(["collections"], orgslug); await revalidateTags(["collections"], orgslug);
router.refresh();
router.prefetch(getUriWithOrg(orgslug, "/collections")); router.prefetch(getUriWithOrg(orgslug, "/collections"));
router.push(getUriWithOrg(orgslug, "/collections")); router.push(getUriWithOrg(orgslug, "/collections"));
router.refresh();
}; };

View file

@ -39,7 +39,7 @@ const CollectionsPage = async (params: any) => {
const orgslug = params.params.orgslug; const orgslug = params.params.orgslug;
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] });
const org_id = org.org_id; const org_id = org.org_id;
const collections = await getOrgCollectionsWithAuthHeader(org_id, access_token_cookie ? access_token_cookie.value : null); const collections = await getOrgCollectionsWithAuthHeader(org_id, access_token_cookie ? access_token_cookie.value : null, { revalidate: 0, tags: ['collections'] });
return ( return (
<GeneralWrapperStyled> <GeneralWrapperStyled>

View file

@ -23,7 +23,7 @@ const CourseClient = (props: any) => {
async function startCourseUI() { async function startCourseUI() {
// Create activity // Create activity
await startCourse("course_" + courseid, orgslug); await startCourse("course_" + courseid, orgslug);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
// refresh page (FIX for Next.js BUG) // refresh page (FIX for Next.js BUG)
@ -34,7 +34,7 @@ const CourseClient = (props: any) => {
// Close activity // Close activity
let activity = await removeCourse("course_" + courseid, orgslug); let activity = await removeCourse("course_" + courseid, orgslug);
// Mutate course // Mutate course
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
// refresh page (FIX for Next.js BUG) // refresh page (FIX for Next.js BUG)

View file

@ -1,6 +1,6 @@
"use client"; "use client";
import React, { FC, use, useEffect, useReducer } from 'react' import React, { FC, use, useEffect, useReducer } from 'react'
import { swrFetcher } from "@services/utils/ts/requests"; import { revalidateTags, swrFetcher } from "@services/utils/ts/requests";
import { getAPIUrl, getUriWithOrg } from '@services/config/config'; import { getAPIUrl, getUriWithOrg } from '@services/config/config';
import useSWR, { mutate } from 'swr'; import useSWR, { mutate } from 'swr';
import { getCourseThumbnailMediaDirectory } from '@services/media/media'; import { getCourseThumbnailMediaDirectory } from '@services/media/media';
@ -12,6 +12,7 @@ import { updateChaptersMetadata } from '@services/courses/chapters';
import { Check, SaveAllIcon, Timer } from 'lucide-react'; import { Check, SaveAllIcon, Timer } from 'lucide-react';
import Loading from '../../loading'; import Loading from '../../loading';
import { updateCourse } from '@services/courses/courses'; import { updateCourse } from '@services/courses/courses';
import { useRouter } from 'next/navigation';
function CourseEditClient({ courseid, subpage, params }: { courseid: string, subpage: string, params: any }) { function CourseEditClient({ courseid, subpage, params }: { courseid: string, subpage: string, params: any }) {
const { data: chapters_meta, error: chapters_meta_error, isLoading: chapters_meta_isloading } = useSWR(`${getAPIUrl()}chapters/meta/course_${courseid}`, swrFetcher); const { data: chapters_meta, error: chapters_meta_error, isLoading: chapters_meta_isloading } = useSWR(`${getAPIUrl()}chapters/meta/course_${courseid}`, swrFetcher);
@ -19,6 +20,7 @@ function CourseEditClient({ courseid, subpage, params }: { courseid: string, sub
const [courseChaptersMetadata, dispatchCourseChaptersMetadata] = useReducer(courseChaptersReducer, {}); const [courseChaptersMetadata, dispatchCourseChaptersMetadata] = useReducer(courseChaptersReducer, {});
const [courseState, dispatchCourseMetadata] = useReducer(courseReducer, {}); const [courseState, dispatchCourseMetadata] = useReducer(courseReducer, {});
const [savedContent, dispatchSavedContent] = useReducer(savedContentReducer, true); const [savedContent, dispatchSavedContent] = useReducer(savedContentReducer, true);
const router = useRouter();
@ -58,11 +60,15 @@ function CourseEditClient({ courseid, subpage, params }: { courseid: string, sub
await updateChaptersMetadata(courseid, courseChaptersMetadata) await updateChaptersMetadata(courseid, courseChaptersMetadata)
dispatchSavedContent({ type: 'saved_content' }) dispatchSavedContent({ type: 'saved_content' })
await mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`) await mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`)
await revalidateTags(['courses'], course.org_slug)
router.refresh()
} }
else if (subpage.toString() === 'general') { else if (subpage.toString() === 'general') {
await updateCourse(courseid, courseState) await updateCourse(courseid, courseState)
dispatchSavedContent({ type: 'saved_content' }) dispatchSavedContent({ type: 'saved_content' })
await mutate(`${getAPIUrl()}courses/course_${courseid}`) await mutate(`${getAPIUrl()}courses/course_${courseid}`)
await revalidateTags(['courses'], course.org_slug)
router.refresh()
} }
} }

View file

@ -64,7 +64,7 @@ function CourseContentEdition(props: any) {
await createChapter(chapter, courseid); await createChapter(chapter, courseid);
mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`); mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`);
// await getCourseChapters(); // await getCourseChapters();
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
setNewChapterModal(false); setNewChapterModal(false);
}; };
@ -77,7 +77,7 @@ function CourseContentEdition(props: any) {
mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`); mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`);
// await getCourseChapters(); // await getCourseChapters();
setNewActivityModal(false); setNewActivityModal(false);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
}; };
@ -88,7 +88,7 @@ function CourseContentEdition(props: any) {
mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`); mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`);
// await getCourseChapters(); // await getCourseChapters();
setNewActivityModal(false); setNewActivityModal(false);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
}; };
@ -99,7 +99,7 @@ function CourseContentEdition(props: any) {
mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`); mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`);
// await getCourseChapters(); // await getCourseChapters();
setNewActivityModal(false); setNewActivityModal(false);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
}; };
@ -108,7 +108,7 @@ function CourseContentEdition(props: any) {
await deleteChapter(chapterId); await deleteChapter(chapterId);
mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`); mutate(`${getAPIUrl()}chapters/meta/course_${courseid}`);
// await getCourseChapters(); // await getCourseChapters();
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
}; };

View file

@ -36,7 +36,7 @@ function Courses(props: CourseProps) {
async function deleteCourses(course_id: any) { async function deleteCourses(course_id: any) {
await deleteCourseFromBackend(course_id); await deleteCourseFromBackend(course_id);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
router.refresh(); router.refresh();
} }

View file

@ -38,7 +38,7 @@ const OrgHomePage = async (params: any) => {
const courses = await getOrgCoursesWithAuthHeader(orgslug, { revalidate: 0, tags: ['courses'] }, access_token_cookie ? access_token_cookie.value : null); const courses = await getOrgCoursesWithAuthHeader(orgslug, { revalidate: 0, tags: ['courses'] }, access_token_cookie ? access_token_cookie.value : null);
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] });
const collections = await getOrgCollectionsWithAuthHeader(org.org_id, access_token_cookie ? access_token_cookie.value : null); const collections = await getOrgCollectionsWithAuthHeader(org.org_id, access_token_cookie ? access_token_cookie.value : null, { revalidate: 0, tags: ['courses'] });
// function to remove "course_" from the course_id // function to remove "course_" from the course_id

View file

@ -33,7 +33,7 @@ function OrganizationClient(props: any) {
let org_id = org.org_id; let org_id = org.org_id;
await uploadOrganizationLogo(org_id, selectedFile); await uploadOrganizationLogo(org_id, selectedFile);
setSelectedFile(null); // Reset the selected file setSelectedFile(null); // Reset the selected file
revalidateTags(['organizations'], org.slug); await revalidateTags(['organizations'], org.slug);
router.refresh(); router.refresh();
} }
@ -54,7 +54,7 @@ function OrganizationClient(props: any) {
await updateOrganization(org_id, values); await updateOrganization(org_id, values);
// Mutate the org // Mutate the org
revalidateTags(['organizations'], org.slug); await revalidateTags(['organizations'], org.slug);
router.refresh(); router.refresh();
} }

View file

@ -43,13 +43,13 @@ function CreateCourseModal({ closeModal, orgslug }: any) {
e.preventDefault(); e.preventDefault();
setIsSubmitting(true); setIsSubmitting(true);
let status = await createNewCourse(orgId, { name, description }, thumbnail); let status = await createNewCourse(orgId, { name, description }, thumbnail);
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
setIsSubmitting(false); setIsSubmitting(false);
if (status.org_id == orgId) { if (status.org_id == orgId) {
closeModal(); closeModal();
router.refresh(); router.refresh();
revalidateTags(['courses'], orgslug); await revalidateTags(['courses'], orgslug);
// refresh page (FIX for Next.js BUG) // refresh page (FIX for Next.js BUG)
// window.location.reload(); // window.location.reload();

View file

@ -21,7 +21,7 @@ function TrailCourseElement(props: TrailCourseElementProps) {
// Close activity // Close activity
let activity = await removeCourse(course_id, props.orgslug); let activity = await removeCourse(course_id, props.orgslug);
// Mutate course // Mutate course
revalidateTags(['courses'], props.orgslug); await revalidateTags(['courses'], props.orgslug);
router.refresh(); router.refresh();
// Mutate // Mutate

View file

@ -40,8 +40,8 @@ export async function getOrgCollections() {
return res; return res;
} }
export async function getOrgCollectionsWithAuthHeader(org_id: string, access_token: string) { export async function getOrgCollectionsWithAuthHeader(org_id: string, access_token: string, next: any) {
const result: any = await fetch(`${getAPIUrl()}collections/org_id/${org_id}/page/1/limit/10`, RequestBodyWithAuthHeader("GET", null, { revalidate: 3 }, access_token)); const result: any = await fetch(`${getAPIUrl()}collections/org_id/${org_id}/page/1/limit/10`, RequestBodyWithAuthHeader("GET", null, next, access_token));
const res = await errorHandling(result); const res = await errorHandling(result);
return res; return res;
} }

View file

@ -85,7 +85,7 @@ export const errorHandling = (res: any) => {
return res.json(); return res.json();
}; };
export const revalidateTags = (tags: string[], orgslug: string) => { export const revalidateTags = async (tags: string[], orgslug: string) => {
const url = getUriWithOrg(orgslug, ""); const url = getUriWithOrg(orgslug, "");
tags.forEach((tag) => { tags.forEach((tag) => {
fetch(`${url}/api/revalidate?tag=${tag}`); fetch(`${url}/api/revalidate?tag=${tag}`);