chore(examples): use nextjs proxy instead of middleware

Author: marcomontalbano

examples/nextjs/readme.md

@@ -17,7 +17,7 @@ This example aims to test the `js-auth` library on Vercel and Netlify edges.
 ### Test link
 
 - https://commercelayer-js-auth-nextjs.vercel.app/
-- https://commercelayer-js-auth-nextjs.vercel.app/middleware
+- https://commercelayer-js-auth-nextjs.vercel.app/proxy
 - https://commercelayer-js-auth-nextjs.vercel.app/api/test
 
 ## Netlify
@@ -34,5 +34,5 @@ This example aims to test the `js-auth` library on Vercel and Netlify edges.
 ### Test link
 
 - https://commercelayer-js-auth-nextjs.netlify.app/
-- https://commercelayer-js-auth-nextjs.netlify.app/middleware
+- https://commercelayer-js-auth-nextjs.netlify.app/proxy
 - https://commercelayer-js-auth-nextjs.netlify.app/api/test

examples/nextjs/src/components/DefaultTemplate.tsx

@@ -1,4 +1,4 @@
-import Image from "next/image"
+
 import styles from "./DefaultTemplate.module.css"
 
 export default function DefaultTemplate({
@@ -9,23 +9,23 @@ export default function DefaultTemplate({
     <main className={styles.main}>
       <div className={styles.description}>
         <p>{title}</p>
-        <a href='/'>Back to home</a>
+        <a href="/">Back to home</a>
       </div>
 
       <div className={styles.center}>{children}</div>
 
       <div className={styles.grid}>
         <a
-          href="/middleware"
+          href="/proxy"
           className={styles.card}
           target="_blank"
           rel="noopener noreferrer"
         >
           <h2>
-            Middleware <span>-&gt;</span>
+            Proxy <span>-&gt;</span>
           </h2>
           <p>
-            <code>auth.js</code> within a middleware.
+            <code>auth.js</code> within a proxy.
           </p>
         </a>
 

examples/nextjs/src/middlewares/types.ts

@@ -0,0 +1,3 @@
+import type { NextProxy } from "next/server"
+
+export type WithProxy = (next?: NextProxy) => NextProxy

examples/nextjs/src/proxies/types.ts

@@ -8,16 +8,16 @@ import { NextResponse } from 'next/server'
 import { createStorage } from "unstorage"
 import memoryDriver from "unstorage/drivers/memory"
 import { makeCustomerStorage } from "@/app/utils/customerStorage"
-import type { WithMiddleware } from "./types"
+import type { WithProxy } from "./types"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const scope = process.env.NEXT_PUBLIC_SCOPE as string
 
-export const withCommerceLayer: WithMiddleware = (
+export const withCommerceLayer: WithProxy = (
   _next = () => NextResponse.next(),
 ) => {
   return async (request, _event) => {
-    if (request.nextUrl.pathname.endsWith("/middleware")) {
+    if (request.nextUrl.pathname.endsWith("/proxy")) {
       const auth = await authenticate("client_credentials", {
         clientId,
         scope,
@@ -30,7 +30,7 @@ export const withCommerceLayer: WithMiddleware = (
       }
 
       return NextResponse.json({
-        from: "middleware",
+        from: "proxy",
         orgSlug: decodedJWT.payload.organization.slug,
         baseEndpoint: getCoreApiBaseEndpoint(auth.accessToken),
       })

…tjs/src/middlewares/withCommerceLayer.ts …/nextjs/src/proxies/withCommerceLayer.tsexamples/nextjs/src/middlewares/withCommerceLayer.ts renamed to examples/nextjs/src/proxies/withCommerceLayer.ts examples/nextjs/src/middlewares/withCommerceLayer.ts renamed to examples/nextjs/src/proxies/withCommerceLayer.ts

@@ -1,4 +1,4 @@
-import { withCommerceLayer } from './middlewares/withCommerceLayer'
+import { withCommerceLayer } from './proxies/withCommerceLayer'
 
 export default withCommerceLayer()