fix: sorting & revalidation

This commit is contained in:
Victor Gerbrands 2023-08-07 15:09:51 +02:00
parent 749f20c144
commit 1db926b580
5 changed files with 59 additions and 19 deletions

View File

@ -6,7 +6,7 @@ import { notFound } from 'next/navigation';
export const runtime = 'edge'; export const runtime = 'edge';
export const revalidate = parseInt(process.env.REVALIDATE_WINDOW ?? `${60 * 60 * 12}`); // 12 hours export const revalidate = 43200; // 12 hours
export async function generateMetadata({ export async function generateMetadata({
params params

View File

@ -1,4 +1,4 @@
import { revalidate } from 'lib/shopify'; import { revalidate } from 'lib/medusa';
import { NextRequest, NextResponse } from 'next/server'; import { NextRequest, NextResponse } from 'next/server';
export const runtime = 'edge'; export const runtime = 'edge';

View File

@ -5,7 +5,7 @@ import { Suspense } from 'react';
export const runtime = 'edge'; export const runtime = 'edge';
export const revalidate = parseInt(process.env.REVALIDATE_WINDOW ?? `${60 * 60 * 12}`); // 12 hours export const revalidate = 43200; // 12 hours
export const metadata = { export const metadata = {
description: 'High-performance ecommerce store built with Next.js, Vercel, and Medusa.', description: 'High-performance ecommerce store built with Next.js, Vercel, and Medusa.',

View File

@ -33,11 +33,7 @@ export default async function CategoryPage({
}) { }) {
const { sort } = searchParams as { [key: string]: string }; const { sort } = searchParams as { [key: string]: string };
const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort; const { sortKey, reverse } = sorting.find((item) => item.slug === sort) || defaultSort;
const products = await getCategoryProducts( const products = await getCategoryProducts(params.collection, reverse, sortKey);
params.collection
// sortKey,
// reverse
);
return ( return (
<section> <section>

View File

@ -1,6 +1,10 @@
import { isMedusaError } from 'lib/type-guards'; import { isMedusaError } from 'lib/type-guards';
import { TAGS } from 'lib/constants';
import { mapOptionIds } from 'lib/utils'; import { mapOptionIds } from 'lib/utils';
import { revalidateTag } from 'next/cache';
import { headers } from 'next/headers';
import { NextRequest, NextResponse } from 'next/server';
import { calculateVariantAmount, computeAmount, convertToDecimal } from './helpers'; import { calculateVariantAmount, computeAmount, convertToDecimal } from './helpers';
import { import {
Cart, Cart,
@ -346,7 +350,11 @@ export async function getCategory(handle: string): Promise<ProductCollection | u
return res.body.product_categories[0]; return res.body.product_categories[0];
} }
export async function getCategoryProducts(handle: string): Promise<Product[]> { export async function getCategoryProducts(
handle: string,
reverse: boolean,
sortKey: string
): Promise<Product[]> {
const res = await medusaRequest('GET', `/product-categories?handle=${handle}`); const res = await medusaRequest('GET', `/product-categories?handle=${handle}`);
if (!res) { if (!res) {
@ -355,13 +363,9 @@ export async function getCategoryProducts(handle: string): Promise<Product[]> {
const category = res.body.product_categories[0]; const category = res.body.product_categories[0];
const category_products = await medusaRequest('GET', `/products?category_id[]=${category.id}`); const category_products = await getProducts({ reverse, sortKey, categoryId: category.id });
const products: Product[] = category_products.body.products.map((product: MedusaProduct) => return category_products;
reshapeProduct(product)
);
return products;
} }
export async function getProduct(handle: string): Promise<Product> { export async function getProduct(handle: string): Promise<Product> {
@ -371,16 +375,32 @@ export async function getProduct(handle: string): Promise<Product> {
} }
export async function getProducts({ export async function getProducts({
query = '', query,
reverse, reverse,
sortKey sortKey,
categoryId
}: { }: {
query?: string; query?: string;
reverse?: boolean; reverse?: boolean;
sortKey?: string; sortKey?: string;
categoryId?: string;
}): Promise<Product[]> { }): Promise<Product[]> {
const res = await medusaRequest('GET', `/products?q=${query}&limit=20`); let res;
let products: Product[] = res.body.products.map((product: MedusaProduct) =>
if (query) {
res = await medusaRequest('GET', `/products?q=${query}&limit=100`);
} else if (categoryId) {
res = await medusaRequest('GET', `/products?category_id[]=${categoryId}&limit=100`);
} else {
res = await medusaRequest('GET', `/products?limit=100`);
}
if (!res) {
console.log("Couldn't fetch products");
return [];
}
let products: Product[] = res?.body.products.map((product: MedusaProduct) =>
reshapeProduct(product) reshapeProduct(product)
); );
@ -418,3 +438,27 @@ export async function getMenu(menu: string): Promise<any[]> {
return []; return [];
} }
// This is called from `app/api/revalidate.ts` so providers can control revalidation logic.
export async function revalidate(req: NextRequest): Promise<NextResponse> {
const collectionWebhooks = ['collections/create', 'collections/delete', 'collections/update'];
const productWebhooks = ['products/create', 'products/delete', 'products/update'];
const topic = headers().get('x-medusa-topic') || 'unknown';
const isCollectionUpdate = collectionWebhooks.includes(topic);
const isProductUpdate = productWebhooks.includes(topic);
if (!isCollectionUpdate && !isProductUpdate) {
// We don't need to revalidate anything for any other topics.
return NextResponse.json({ status: 200 });
}
if (isCollectionUpdate) {
revalidateTag(TAGS.collections);
}
if (isProductUpdate) {
revalidateTag(TAGS.products);
}
return NextResponse.json({ status: 200, revalidated: true, now: Date.now() });
}