feat: use Next.js on demand revalidation

This commit is contained in:
swve 2023-05-19 09:33:54 +00:00
parent 86e4ec64b5
commit cc6cc52ba5
7 changed files with 39 additions and 10 deletions

View file

@ -0,0 +1,19 @@
import { NextRequest, NextResponse } from "next/server";
import { revalidateTag } from "next/cache";
export async function GET(request: NextRequest) {
const tag: any = request.nextUrl.searchParams.get("tag");
revalidateTag(tag);
return NextResponse.json(
{ revalidated: true, now: Date.now() },
{
status: 200,
headers: {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
"Access-Control-Allow-Headers": "Content-Type, Authorization",
},
}
);
}

View file

@ -10,6 +10,7 @@ import Link from 'next/link';
import React from 'react'
import Image from 'next/image';
import { AuthContext } from '@components/Security/AuthProvider';
import { revalidateTags } from '@services/utils/ts/requests';
interface CourseProps {
orgslug: string;
@ -28,6 +29,7 @@ function Courses(props: CourseProps) {
async function deleteCourses(course_id: any) {
await deleteCourseFromBackend(course_id);
revalidateTags(['courses']);
}
async function closeNewCourseModal() {

View file

@ -11,7 +11,7 @@ export const metadata: Metadata = {
const CoursesPage = async (params: any) => {
const orgslug = params.params.orgslug;
const courses = await getOrgCourses(orgslug, { revalidate: 360 });
const courses = await getOrgCourses(orgslug, { revalidate: 360, tags: ['courses'] });
return (
<div>

View file

@ -22,7 +22,7 @@ export async function generateMetadata(
): Promise<Metadata> {
// Get Org context information
const org = await getOrganizationContextInfo(params.orgslug, { revalidate: 1800 });
const org = await getOrganizationContextInfo(params.orgslug, { revalidate: 1800, tags: ['organizations'] });
return {
title: org.name + " — Home",
description: org.description,
@ -31,7 +31,7 @@ export async function generateMetadata(
const OrgHomePage = async (params: any) => {
const orgslug = params.params.orgslug;
const courses = await getOrgCourses(orgslug, { revalidate: 360 });
const courses = await getOrgCourses(orgslug, { revalidate: 360 , tags: ['courses'] });
const collections = await getOrgCollections();
// function to remove "course_" from the course_id

View file

@ -7,6 +7,7 @@ import { getOrganizationContextInfo } from '@services/organizations/orgs';
import React, { useState } from 'react'
import { BarLoader } from 'react-spinners'
import { mutate } from 'swr';
import { revalidateTags } from '@services/utils/ts/requests';
function CreateCourseModal({ closeModal, orgslug }: any) {
const [isSubmitting, setIsSubmitting] = useState(false);
@ -19,7 +20,7 @@ function CreateCourseModal({ closeModal, orgslug }: any) {
const getOrgMetadata = async () => {
const org = await getOrganizationContextInfo(orgslug);
const org = await getOrganizationContextInfo(orgslug, { revalidate: 360, tags: ['organizations'] });
setOrgId(org.org_id);
}
@ -40,7 +41,7 @@ function CreateCourseModal({ closeModal, orgslug }: any) {
e.preventDefault();
setIsSubmitting(true);
let status = await createNewCourse(orgId, { name, description }, thumbnail);
mutate(`${getAPIUrl()}courses/org_slug/${orgslug}/page/1/limit/10`);
revalidateTags(['courses']);
setIsSubmitting(false);
if (status.org_id == orgId) {

View file

@ -1,4 +1,4 @@
const LEARNHOUSE_HTTP_PROTOCOL = process.env.NEXT_PUBLIC_LEARNHOUSE_HTTPS === "true" ? "https://" : "http://";
export const LEARNHOUSE_HTTP_PROTOCOL = process.env.NEXT_PUBLIC_LEARNHOUSE_HTTPS === "true" ? "https://" : "http://";
const LEARNHOUSE_API_URL = `${process.env.NEXT_PUBLIC_LEARNHOUSE_API_URL}`;
const LEARNHOUSE_BACKEND_URL = `${process.env.NEXT_PUBLIC_LEARNHOUSE_BACKEND_URL}`;
export const LEARNHOUSE_DOMAIN = process.env.NEXT_PUBLIC_LEARNHOUSE_DOMAIN;

View file

@ -1,5 +1,6 @@
import { AppRouterInstance } from "next/dist/shared/lib/app-router-context";
import { denyAccessToUser } from "../react/middlewares/views";
import { LEARNHOUSE_DOMAIN, LEARNHOUSE_HTTP_PROTOCOL } from "@services/config/config";
export const RequestBody = (method: string, data: any, next: any) => {
let HeadersConfig = new Headers({ "Content-Type": "application/json" });
@ -69,3 +70,9 @@ export const errorHandling = (res: any) => {
}
return res.json();
};
export const revalidateTags = (tags: string[]) => {
tags.forEach((tag) => {
fetch(`${LEARNHOUSE_HTTP_PROTOCOL}${LEARNHOUSE_DOMAIN}/api/revalidate?tag=${tag}`);
});
};