Ran prettier on every file (vercel#166)

Co-authored-by: Dom Sip <[email protected]>

.github/pull_request_template.md

@@ -3,6 +3,7 @@
 <!--
   ✍️ Write a short summary of your work. Screenshots and videos are welcome!
 -->
+
 <!-- Link to readme.md on your branch -->
 
 ### Best Way to Test

edge-functions/README.md

@@ -33,8 +33,3 @@
 - [Power Parity Pricing](./power-parity-pricing)
 - [Query Parameters Filter](./query-params-filter)
 - [Scalable redirects with Upstash](./redirects-upstash)
-
-
-
-
-

edge-functions/ab-testing-simple/pages/_app.tsx

@@ -7,7 +7,10 @@ export default function MyApp({ Component, pageProps }: AppProps) {
   const Layout = getLayout<LayoutProps>(Component)
 
   return (
-    <Layout title="AB Testing with buckets" path="edge-functions/ab-testing-simple">
+    <Layout
+      title="AB Testing with buckets"
+      path="edge-functions/ab-testing-simple"
+    >
       <Component {...pageProps} />
     </Layout>
   )

edge-functions/add-header/README.md

@@ -10,10 +10,7 @@ export function middleware() {
   const response = NextResponse.next()
 
   // Set custom header
-  response.headers.set(
-    "x-modified-edge",
-    "true"
-  )
+  response.headers.set('x-modified-edge', 'true')
 
   // Return response
   return response

edge-functions/add-header/pages/_app.tsx

@@ -9,10 +9,7 @@ function App({ Component, pageProps }: AppProps) {
   const Layout = getLayout<LayoutProps>(Component)
 
   return (
-    <Layout
-      title="Add header"
-      path="edge-functions/add-header"
-    >
+    <Layout title="Add header" path="edge-functions/add-header">
       <Component {...pageProps} />
     </Layout>
   )

edge-functions/add-header/pages/_middleware.ts

@@ -5,10 +5,7 @@ export function middleware() {
   const response = NextResponse.next()
 
   // Set custom header
-  response.headers.set(
-    "x-modified-edge",
-    "true"
-  )
+  response.headers.set('x-modified-edge', 'true')
 
   // Return response
   return response

edge-functions/add-header/pages/index.tsx

@@ -33,7 +33,10 @@ function IndexPage() {
       <section className="flex flex-col gap-6">
         <Text variant="h1">Adding headers at the edge</Text>
         <Text>
-          In some cases we might want to add or modify the headers from an incoming request for different reasons, AB testing, personalization, analytics, etc. To have access to the tenative response we can call <Code>NextResponse.next()</Code> and then modify its headers:
+          In some cases we might want to add or modify the headers from an
+          incoming request for different reasons, AB testing, personalization,
+          analytics, etc. To have access to the tenative response we can call{' '}
+          <Code>NextResponse.next()</Code> and then modify its headers:
         </Text>
         <Snippet>
           {`// Store the response so we can modify its headers

edge-functions/api-rate-limit-and-tokens/lib/api/keys.ts

@@ -35,7 +35,10 @@ export const tokenRateLimit = initRateLimit(async (request) => {
 
   let payload: ApiTokenPayload
   try {
-    const verified = await jwtVerify(token, new TextEncoder().encode(API_KEYS_JWT_SECRET_KEY))
+    const verified = await jwtVerify(
+      token,
+      new TextEncoder().encode(API_KEYS_JWT_SECRET_KEY)
+    )
     payload = verified.payload as ApiTokenPayload
   } catch (err) {
     return tokenExpired()

edge-functions/api-rate-limit-and-tokens/pages/api/keys.ts

@@ -5,7 +5,8 @@ import { API_KEYS, API_KEYS_JWT_SECRET_KEY } from '@lib/api/constants'
 import type { ApiTokenPayload } from '@lib/api/keys'
 import { upstashRest } from '@lib/upstash'
 
-const decode = (jwt: string) => JSON.parse(new TextDecoder().decode(base64url.decode(jwt.split('.')[1])))
+const decode = (jwt: string) =>
+  JSON.parse(new TextDecoder().decode(base64url.decode(jwt.split('.')[1])))
 
 export default async function keys(req: NextApiRequest, res: NextApiResponse) {
   try {

edge-functions/basic-auth-password/pages/_app.tsx

@@ -7,7 +7,10 @@ export default function MyApp({ Component, pageProps }: AppProps) {
   const Layout = getLayout<LayoutProps>(Component)
 
   return (
-    <Layout title="Password Protected" path="edge-functions/basic-auth-password">
+    <Layout
+      title="Password Protected"
+      path="edge-functions/basic-auth-password"
+    >
       <Component {...pageProps} />
     </Layout>
   )

edge-functions/bot-protection-botd/next.config.js

@@ -1,9 +1,6 @@
-const withTM = require('next-transpile-modules')(
-  ['@vercel/examples-ui'],
-  {
-    resolveSymlinks: false,
-  }
-)
+const withTM = require('next-transpile-modules')(['@vercel/examples-ui'], {
+  resolveSymlinks: false,
+})
 
 module.exports = withTM({
   typescript: {

edge-functions/clerk-authentication/components/CTASection.jsx

@@ -1,28 +1,28 @@
 export function CTASection() {
   return (
-    <div className='bg-indigo-600'>
-      <div className='max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8'>
-        <h2 className='text-3xl font-extrabold text-white sm:text-5xl'>
-          <span className='block'>Ready for authentication at the edge?</span>
+    <div className="bg-indigo-600">
+      <div className="max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8">
+        <h2 className="text-3xl font-extrabold text-white sm:text-5xl">
+          <span className="block">Ready for authentication at the edge?</span>
         </h2>
-        <p className='mt-4 text-base text-indigo-200 text-base sm:text-lg md:text-xl'>
+        <p className="mt-4 text-base text-indigo-200 text-base sm:text-lg md:text-xl">
           Stateless, revocable authentication is included in every Clerk plan.
         </p>
-        <div className='sm:flex sm:justify-center mt-8'>
+        <div className="sm:flex sm:justify-center mt-8">
           <a
-            href='https://dashboard.clerk.dev/sign-up?utm_source=edge-demo&utm_medium=next-edge-auth&utm_campaign=start-building'
-            className='mb-4 w-full inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50 sm:w-auto'
+            href="https://dashboard.clerk.dev/sign-up?utm_source=edge-demo&utm_medium=next-edge-auth&utm_campaign=start-building"
+            className="mb-4 w-full inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50 sm:w-auto"
           >
             Start building
           </a>
           <a
-            href='https://clerk.dev/solutions/nextjs-authentication?utm_source=edge-demo&utm_medium=next-edge-auth&utm_campaign=more-cta'
-            className='sm:ml-4 mb-4 w-full inline-flex items-center justify-center px-5 py-3 border border-white text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:w-auto'
+            href="https://clerk.dev/solutions/nextjs-authentication?utm_source=edge-demo&utm_medium=next-edge-auth&utm_campaign=more-cta"
+            className="sm:ml-4 mb-4 w-full inline-flex items-center justify-center px-5 py-3 border border-white text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:w-auto"
           >
             More about Clerk and Next.js
           </a>
         </div>
       </div>
     </div>
-  );
+  )
 }

edge-functions/clerk-authentication/components/HeadTags.jsx

@@ -1,41 +1,41 @@
-import Head from 'next/head';
+import Head from 'next/head'
 
 export function HeadTags() {
-  const title = 'Demo: Next.js authentication at the edge with Clerk';
+  const title = 'Demo: Next.js authentication at the edge with Clerk'
   const desc =
-    'Try an interactive demo of authentication at the edge with Clerk and Next.js';
-  const canonical = 'https://edge.clerk.app';
+    'Try an interactive demo of authentication at the edge with Clerk and Next.js'
+  const canonical = 'https://edge.clerk.app'
   return (
     <Head>
       <title>{title}</title>
-      <meta name='viewport' content='initial-scale=1.0, width=device-width' />
+      <meta name="viewport" content="initial-scale=1.0, width=device-width" />
 
-      <meta name='description' content={desc} />
-      <link rel='canonical' href={canonical} />
+      <meta name="description" content={desc} />
+      <link rel="canonical" href={canonical} />
 
-      <meta property='og:title' content={title} />
-      <meta property='og:description' content={desc} />
-      <meta property='og:site_name' content='Clerk' />
-      <meta property='og:url' content={canonical} />
+      <meta property="og:title" content={title} />
+      <meta property="og:description" content={desc} />
+      <meta property="og:site_name" content="Clerk" />
+      <meta property="og:url" content={canonical} />
 
       <meta
-        property='og:image'
-        content='https://edge.clerk.app/opengraph.png'
+        property="og:image"
+        content="https://edge.clerk.app/opengraph.png"
       />
-      <meta property='og:image:width' content={1200} />
-      <meta property='og:image:height' content={630} />
+      <meta property="og:image:width" content={1200} />
+      <meta property="og:image:height" content={630} />
 
-      <meta property='og:type' content={'website'} />
+      <meta property="og:type" content={'website'} />
 
-      <meta property='twitter:title' content={title} />
-      <meta property='twitter:description' content={desc} />
-      <meta property='twitter:url' content={canonical} />
-      <meta property='twitter:card' content='summary_large_image' />
-      <meta property='twitter:site' content='@ClerkDev' />
+      <meta property="twitter:title" content={title} />
+      <meta property="twitter:description" content={desc} />
+      <meta property="twitter:url" content={canonical} />
+      <meta property="twitter:card" content="summary_large_image" />
+      <meta property="twitter:site" content="@ClerkDev" />
       <meta
-        name='twitter:image'
-        content='https://edge.clerk.app/opengraph.png'
+        name="twitter:image"
+        content="https://edge.clerk.app/opengraph.png"
       />
     </Head>
-  );
+  )
 }

edge-functions/clerk-authentication/components/Layout.jsx

@@ -1,3 +1,3 @@
 export const Layout = ({ children }) => {
-  return <div>{children}</div>;
-};
+  return <div>{children}</div>
+}

edge-functions/clerk-authentication/components/index.js

@@ -1,8 +1,8 @@
-export * from './Layout';
-export * from './HeadTags';
-export * from './HeroSection';
-export * from './CTASection';
-export * from './Pattern';
-export * from './statelessDoneRightSection';
-export * from './tryRenovationSection';
-export * from './twoStrategiesSection';
+export * from './Layout'
+export * from './HeadTags'
+export * from './HeroSection'
+export * from './CTASection'
+export * from './Pattern'
+export * from './statelessDoneRightSection'
+export * from './tryRenovationSection'
+export * from './twoStrategiesSection'

edge-functions/clerk-authentication/components/statelessDoneRightSection/JWTDemo.jsx

@@ -1,68 +1,68 @@
-import React from 'react';
-import { useSession } from '@clerk/nextjs';
-import { Navigation, Pagination } from 'swiper';
-import { Swiper, SwiperSlide } from 'swiper/react';
-import { TokenCard } from './TokenCard';
-import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/solid';
+import React from 'react'
+import { useSession } from '@clerk/nextjs'
+import { Navigation, Pagination } from 'swiper'
+import { Swiper, SwiperSlide } from 'swiper/react'
+import { TokenCard } from './TokenCard'
+import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/solid'
 
 function useInterval(callback, delay) {
-  const savedCallback = React.useRef(callback);
+  const savedCallback = React.useRef(callback)
 
   React.useLayoutEffect(() => {
-    savedCallback.current = callback;
-  }, [callback]);
+    savedCallback.current = callback
+  }, [callback])
 
   React.useEffect(() => {
     if (!delay) {
-      return;
+      return
     }
-    const id = setInterval(() => savedCallback.current(), delay);
-    return () => clearInterval(id);
-  }, [delay]);
+    const id = setInterval(() => savedCallback.current(), delay)
+    return () => clearInterval(id)
+  }, [delay])
 }
 
 export const JWTDemo = () => {
-  const session = useSession();
-  const [swiperRef, setSwiperRef] = React.useState(null);
-  const [tokens, setTokens] = React.useState([]);
+  const session = useSession()
+  const [swiperRef, setSwiperRef] = React.useState(null)
+  const [tokens, setTokens] = React.useState([])
 
   const prependAndSlideToStart = React.useCallback(() => {
     if (!swiperRef) {
-      return;
+      return
     }
-    swiperRef.slideTo(1, 0);
-    swiperRef.update();
-    swiperRef.slideTo(0);
-  }, [swiperRef]);
+    swiperRef.slideTo(1, 0)
+    swiperRef.update()
+    swiperRef.slideTo(0)
+  }, [swiperRef])
 
   const getToken = React.useCallback(async () => {
     try {
-      const token = await session.getToken();
+      const token = await session.getToken()
       if (tokens[0] !== token) {
-        setTokens([token, ...tokens]);
-        prependAndSlideToStart();
+        setTokens([token, ...tokens])
+        prependAndSlideToStart()
       }
     } catch (e) {
-      console.log('JWTDemo::getToken error', e);
+      console.log('JWTDemo::getToken error', e)
     }
-  }, [session, tokens, prependAndSlideToStart]);
+  }, [session, tokens, prependAndSlideToStart])
 
   React.useEffect(() => {
-    getToken();
-  }, [getToken]);
+    getToken()
+  }, [getToken])
 
   useInterval(async () => {
-    void getToken();
-  }, 1000);
+    void getToken()
+  }, 1000)
 
-  const tokenCount = tokens.length;
+  const tokenCount = tokens.length
   const generatedTokensText = `${tokenCount} ${
     tokenCount === 1 ? 'JWT' : 'JWTs'
-  } generated since page load`;
+  } generated since page load`
 
   return (
     <>
-      <div className='-mx-2 relative'>
+      <div className="-mx-2 relative">
         <Swiper
           modules={[Pagination, Navigation]}
           pagination={{
@@ -85,22 +85,22 @@ export const JWTDemo = () => {
             </SwiperSlide>
           ))}
           <button
-            id='newer_token'
-            className='prev absolute z-10 bg-opacity-5 hover:bg-opacity-20 bg-gray-900 top-0 bottom-8 rounded-l-xl left-0 w-8'
+            id="newer_token"
+            className="prev absolute z-10 bg-opacity-5 hover:bg-opacity-20 bg-gray-900 top-0 bottom-8 rounded-l-xl left-0 w-8"
           >
-            <ChevronLeftIcon className='text-white filter drop-shadow' />
+            <ChevronLeftIcon className="text-white filter drop-shadow" />
           </button>
           <button
-            id='older_token'
-            className='next absolute z-10 bg-opacity-5 hover:bg-opacity-20 bg-gray-900 top-0 bottom-8 rounded-r-xl right-0 w-8 '
+            id="older_token"
+            className="next absolute z-10 bg-opacity-5 hover:bg-opacity-20 bg-gray-900 top-0 bottom-8 rounded-r-xl right-0 w-8 "
           >
-            <ChevronRightIcon className='text-white filter drop-shadow' />
+            <ChevronRightIcon className="text-white filter drop-shadow" />
           </button>
         </Swiper>
       </div>
-      <div className='text-right text-gray-500 -mt-7'>
+      <div className="text-right text-gray-500 -mt-7">
         {generatedTokensText}
       </div>
     </>
-  );
-};
+  )
+}