Fix the code

using pnpm `pnpm run code:fixes`
opennextjs · vicb · Oct 12, 2024 · Oct 12, 2024 · Oct 12, 2024 · Oct 12, 2024
commit c1578b67a2dcfebad882ef2e621511f9b1eb78b4
diff --git a/examples/vercel-blog-starter/src/app/_components/hero-post.tsx b/examples/vercel-blog-starter/src/app/_components/hero-post.tsx
@@ -13,14 +13,7 @@ type Props = {
   slug: string;
 };
 
-export function HeroPost({
-  title,
-  coverImage,
-  date,
-  excerpt,
-  author,
-  slug,
-}: Props) {
+export function HeroPost({ title, coverImage, date, excerpt, author, slug }: Props) {
   return (
     <section>
       <div className="mb-8 md:mb-16">

diff --git a/examples/vercel-blog-starter/src/app/_components/intro.tsx b/examples/vercel-blog-starter/src/app/_components/intro.tsx
@@ -3,9 +3,7 @@ import { CMS_NAME } from "@/lib/constants";
 export function Intro() {
   return (
     <section className="flex-col md:flex-row flex items-center md:justify-between mt-16 mb-16 md:mb-12">
-      <h1 className="text-5xl md:text-8xl font-bold tracking-tighter leading-tight md:pr-8">
-        Blog.
-      </h1>
+      <h1 className="text-5xl md:text-8xl font-bold tracking-tighter leading-tight md:pr-8">Blog.</h1>
       <h4 className="text-center md:text-left text-lg mt-5 md:pl-8">
         A statically generated blog example using{" "}
         <a

diff --git a/examples/vercel-blog-starter/src/app/_components/more-stories.tsx b/examples/vercel-blog-starter/src/app/_components/more-stories.tsx
@@ -8,9 +8,7 @@ type Props = {
 export function MoreStories({ posts }: Props) {
   return (
     <section>
-      <h2 className="mb-8 text-5xl md:text-7xl font-bold tracking-tighter leading-tight">
-        More Stories
-      </h2>
+      <h2 className="mb-8 text-5xl md:text-7xl font-bold tracking-tighter leading-tight">More Stories</h2>
       <div className="grid grid-cols-1 md:grid-cols-2 md:gap-x-16 lg:gap-x-32 gap-y-20 md:gap-y-32 mb-32">
         {posts.map((post) => (
           <PostPreview

diff --git a/examples/vercel-blog-starter/src/app/_components/post-body.tsx b/examples/vercel-blog-starter/src/app/_components/post-body.tsx
@@ -7,10 +7,7 @@ type Props = {
 export function PostBody({ content }: Props) {
   return (
     <div className="max-w-2xl mx-auto">
-      <div
-        className={markdownStyles["markdown"]}
-        dangerouslySetInnerHTML={{ __html: content }}
-      />
+      <div className={markdownStyles["markdown"]} dangerouslySetInnerHTML={{ __html: content }} />
     </div>
   );
 }
diff --git a/examples/vercel-blog-starter/src/app/_components/post-preview.tsx b/examples/vercel-blog-starter/src/app/_components/post-preview.tsx
@@ -13,14 +13,7 @@ type Props = {
   slug: string;
 };
 
-export function PostPreview({
-  title,
-  coverImage,
-  date,
-  excerpt,
-  author,
-  slug,
-}: Props) {
+export function PostPreview({ title, coverImage, date, excerpt, author, slug }: Props) {
   return (
     <div>
       <div className="mb-5">

diff --git a/examples/vercel-blog-starter/src/app/_components/switch.module.css b/examples/vercel-blog-starter/src/app/_components/switch.module.css
@@ -35,8 +35,7 @@
 }
 
 [data-mode="dark"] .switch {
-  box-shadow: calc(var(--size) / 4) calc(var(--size) / -4) calc(var(--size) / 8)
-    inset #fff;
+  box-shadow: calc(var(--size) / 4) calc(var(--size) / -4) calc(var(--size) / 8) inset #fff;
   border: none;
   background: transparent;
   animation: n linear 0.5s;

diff --git a/examples/vercel-blog-starter/src/app/_components/theme-switcher.tsx b/examples/vercel-blog-starter/src/app/_components/theme-switcher.tsx
@@ -59,9 +59,8 @@ let updateDOM: () => void;
 const Switch = () => {
   const [mode, setMode] = useState<ColorSchemePreference>(
     () =>
-      ((typeof localStorage !== "undefined" &&
-        localStorage.getItem(STORAGE_KEY)) ??
-        "system") as ColorSchemePreference,
+      ((typeof localStorage !== "undefined" && localStorage.getItem(STORAGE_KEY)) ??
+        "system") as ColorSchemePreference
   );
 
   useEffect(() => {
@@ -83,13 +82,7 @@ const Switch = () => {
     const index = modes.indexOf(mode);
     setMode(modes[(index + 1) % modes.length]);
   };
-  return (
-    <button
-      suppressHydrationWarning
-      className={styles.switch}
-      onClick={handleModeSwitch}
-    />
-  );
+  return <button suppressHydrationWarning className={styles.switch} onClick={handleModeSwitch} />;
 };
 
 const Script = memo(() => (

diff --git a/examples/vercel-blog-starter/src/app/layout.tsx b/examples/vercel-blog-starter/src/app/layout.tsx
@@ -25,41 +25,18 @@ export default function RootLayout({
   return (
     <html lang="en">
       <head>
-        <link
-          rel="apple-touch-icon"
-          sizes="180x180"
-          href="/favicon/apple-touch-icon.png"
-        />
-        <link
-          rel="icon"
-          type="image/png"
-          sizes="32x32"
-          href="/favicon/favicon-32x32.png"
-        />
-        <link
-          rel="icon"
-          type="image/png"
-          sizes="16x16"
-          href="/favicon/favicon-16x16.png"
-        />
+        <link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png" />
+        <link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png" />
+        <link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png" />
         <link rel="manifest" href="/favicon/site.webmanifest" />
-        <link
-          rel="mask-icon"
-          href="/favicon/safari-pinned-tab.svg"
-          color="#000000"
-        />
+        <link rel="mask-icon" href="/favicon/safari-pinned-tab.svg" color="#000000" />
         <link rel="shortcut icon" href="/favicon/favicon.ico" />
         <meta name="msapplication-TileColor" content="#000000" />
-        <meta
-          name="msapplication-config"
-          content="/favicon/browserconfig.xml"
-        />
+        <meta name="msapplication-config" content="/favicon/browserconfig.xml" />
         <meta name="theme-color" content="#000" />
         <link rel="alternate" type="application/rss+xml" href="/feed.xml" />
       </head>
-      <body
-        className={cn(inter.className, "dark:bg-slate-900 dark:text-slate-400")}
-      >
+      <body className={cn(inter.className, "dark:bg-slate-900 dark:text-slate-400")}>
         <ThemeSwitcher />
         <div className="min-h-screen">{children}</div>
         <Footer />

diff --git a/examples/vercel-blog-starter/src/app/posts/[slug]/page.tsx b/examples/vercel-blog-starter/src/app/posts/[slug]/page.tsx
@@ -24,12 +24,7 @@ export default async function Post({ params }: Params) {
       <Container>
         <Header />
         <article className="mb-32">
-          <PostHeader
-            title={post.title}
-            coverImage={post.coverImage}
-            date={post.date}
-            author={post.author}
-          />
+          <PostHeader title={post.title} coverImage={post.coverImage} date={post.date} author={post.author} />
           <PostBody content={content} />
         </article>
       </Container>

diff --git a/examples/vercel-blog-starter/tailwind.config.ts b/examples/vercel-blog-starter/tailwind.config.ts
@@ -11,8 +11,7 @@ const config: Config = {
     extend: {
       backgroundImage: {
         "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
-        "gradient-conic":
-          "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
+        "gradient-conic": "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
       },
       colors: {
         "accent-1": "#FAFAFA",