Use Biome instead of prettier and eslint.

Author: vLuckyyy

.prettierignore renamed to .biomeignore

@@ -10,7 +10,6 @@ bun.lockb
 
 # Cache
 .cache/
-.eslintcache
 
 # Logs
 *.log
@@ -29,4 +28,5 @@ yarn-error.log*
 .DS_Store
 *.pem
 coverage/
-.vercel 
+.vercel
+

.eslintignore

@@ -1,5 +1,5 @@
-import fs from "fs";
-import path from "path";
+import fs from "node:fs";
+import path from "node:path";
 
 import matter from "gray-matter";
 import { NextResponse } from "next/server";

.eslintrc.json

@@ -1,5 +1,5 @@
 import { ImageResponse } from "@vercel/og";
-import { NextRequest } from "next/server";
+import type { NextRequest } from "next/server";
 
 export const runtime = "edge";
 
@@ -12,87 +12,86 @@ export async function GET(req: NextRequest) {
     const image = searchParams.get("image") || "https://eternalcode.pl/logo.svg";
 
     return new ImageResponse(
-      (
+      <div
+        style={{
+          height: "100%",
+          width: "100%",
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          justifyContent: "center",
+          backgroundColor: "#ffffff",
+          padding: "40px 80px",
+          fontFamily: "Poppins, sans-serif",
+        }}
+      >
         <div
           style={{
-            height: "100%",
-            width: "100%",
             display: "flex",
-            flexDirection: "column",
+            flexDirection: "row",
             alignItems: "center",
             justifyContent: "center",
-            backgroundColor: "#ffffff",
-            padding: "40px 80px",
-            fontFamily: "Poppins, sans-serif",
+            marginBottom: "40px",
           }}
         >
+          {/** biome-ignore lint/performance/noImgElement: it's for og image, i cant use <Image> here */}
+          <img
+            src={image}
+            alt="EternalCode Logo"
+            width={120}
+            height={120}
+            style={{ marginRight: "20px" }}
+          />
           <div
             style={{
               display: "flex",
-              flexDirection: "row",
-              alignItems: "center",
+              flexDirection: "column",
+              alignItems: "flex-start",
               justifyContent: "center",
-              marginBottom: "40px",
             }}
           >
-            <img
-              src={image}
-              alt="EternalCode Logo"
-              width={120}
-              height={120}
-              style={{ marginRight: "20px" }}
-            />
-            <div
+            <h1
               style={{
-                display: "flex",
-                flexDirection: "column",
-                alignItems: "flex-start",
-                justifyContent: "center",
+                fontSize: "60px",
+                fontWeight: "bold",
+                color: "#0d1117",
+                margin: "0",
+                lineHeight: "1.2",
               }}
             >
-              <h1
-                style={{
-                  fontSize: "60px",
-                  fontWeight: "bold",
-                  color: "#0d1117",
-                  margin: "0",
-                  lineHeight: "1.2",
-                }}
-              >
-                {title}
-              </h1>
-              <p
-                style={{
-                  fontSize: "30px",
-                  color: "#3b82f6",
-                  margin: "0",
-                  marginTop: "10px",
-                }}
-              >
-                {subtitle}
-              </p>
-            </div>
-          </div>
-          <div
-            style={{
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              marginTop: "20px",
-            }}
-          >
+              {title}
+            </h1>
             <p
               style={{
-                fontSize: "24px",
-                color: "#6b7280",
+                fontSize: "30px",
+                color: "#3b82f6",
                 margin: "0",
+                marginTop: "10px",
               }}
             >
-              eternalcode.pl
+              {subtitle}
             </p>
           </div>
         </div>
-      ),
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            marginTop: "20px",
+          }}
+        >
+          <p
+            style={{
+              fontSize: "24px",
+              color: "#6b7280",
+              margin: "0",
+            }}
+          >
+            eternalcode.pl
+          </p>
+        </div>
+      </div>,
       {
         width: 1200,
         height: 630,

.prettierrc.json

@@ -1,22 +1,27 @@
-import Image from "next/image";
-import { notFound } from "next/navigation";
-
-import { AnimatedSection, AnimatedContainer, AnimatedElement } from "@/components/animations";
-import BlogPostCard from "@/components/blog/BlogPostCard";
 import { Pagination } from "@/components/ui/pagination";
 import { getAuthorBySlug, getBlogPostsByAuthor } from "@/lib/strapi";
+import BlogPostCard from "@/components/blog/BlogPostCard";
 import { getImageUrl } from "@/lib/utils";
+import Image from "next/image";
+import { AnimatedContainer, AnimatedElement, AnimatedSection } from "@/components/animations";
+import { notFound } from "next/navigation";
 
-export async function generateMetadata(props: { params: Promise<{ slug: string }> }) {
-  const { params } = await props;
-  const { slug } = await params;
+interface AuthorPageProps {
+  params: { slug: string };
+  searchParams?: { page?: string };
+}
+
+export async function generateMetadata({ params }: { params: { slug: string } }) {
+  const { slug } = params;
   const author = await getAuthorBySlug(slug);
+
   if (!author) {
     return {
       title: "Author Not Found | EternalCode.pl",
       description: "This author does not exist on EternalCode.pl.",
     };
   }
+
   return {
     title: `${author.name} – Author | EternalCode.pl`,
     description: author.bio || `Read articles by ${author.name} on EternalCode.pl`,
@@ -26,11 +31,9 @@ export async function generateMetadata(props: { params: Promise<{ slug: string }
       type: "profile",
       url: `https://eternalcode.pl/author/${author.slug}`,
       images: author.avatar?.url ? [getImageUrl(author.avatar.url)] : [],
-      profile: {
-        firstName: author.name.split(" ")[0],
-        lastName: author.name.split(" ").slice(1).join(" ") || undefined,
-        username: author.slug,
-      },
+      firstName: author.name.split(" ")[0],
+      lastName: author.name.split(" ").slice(1).join(" ") || undefined,
+      username: author.slug,
     },
     twitter: {
       card: "summary",
@@ -44,19 +47,17 @@ export async function generateMetadata(props: { params: Promise<{ slug: string }
   };
 }
 
-export default async function AuthorPage(props: {
-  params: Promise<{ slug: string }>;
-  searchParams: Promise<{ page?: string }>;
-}) {
-  const { params, searchParams } = await props;
-  const { slug } = await params;
-  const resolvedSearchParams = await searchParams;
+export default async function AuthorPage({ params, searchParams }: AuthorPageProps) {
+  const { slug } = params;
+
   if (!slug) notFound();
+
   const author = await getAuthorBySlug(slug);
   if (!author) notFound();
+
   const posts = await getBlogPostsByAuthor(slug);
   const ITEMS_PER_PAGE = 6;
-  const currentPage = Math.max(1, parseInt(resolvedSearchParams?.page || "1", 10));
+  const currentPage = Math.max(1, parseInt(searchParams?.page || "1", 10));
   const totalPages = Math.ceil(posts.length / ITEMS_PER_PAGE);
   const paginatedPosts = posts.slice(
     (currentPage - 1) * ITEMS_PER_PAGE,
@@ -67,13 +68,12 @@ export default async function AuthorPage(props: {
     <div className="min-h-screen bg-lightGray-100 pb-12 pt-40 dark:bg-gray-900">
       <div className="mx-auto max-w-screen-xl px-4">
         <div className="mx-auto grid max-w-screen-xl grid-cols-1 gap-12 md:grid-cols-3">
-          {/* avatar, bio, email - STICKY */}
           <aside className="md:col-span-1">
             <AnimatedSection
               animationType="fadeLeft"
               className="sticky top-32 flex flex-col items-start"
             >
-              {author.avatar && author.avatar.url && (
+              {author.avatar?.url && (
                 <Image
                   src={getImageUrl(author.avatar.url)}
                   alt={author.name}
@@ -101,7 +101,6 @@ export default async function AuthorPage(props: {
             </AnimatedSection>
           </aside>
 
-          {/* articles */}
           <main className="md:col-span-2">
             <h2 className="mb-6 text-2xl font-bold text-gray-900 dark:text-white">Articles</h2>
             {posts.length > 0 ? (

app/api/docs/search-index/route.ts

@@ -6,7 +6,7 @@ import { notFound } from "next/navigation";
 import { AnimatedSection } from "@/components/animations";
 import BlogPostContent from "@/components/blog/BlogPostContent";
 import { generateOgImageUrl } from "@/lib/og-utils";
-import { getBlogPost, StrapiTag } from "@/lib/strapi";
+import { getBlogPost, type StrapiTag } from "@/lib/strapi";
 
 export const dynamic = "force-dynamic";
 export const revalidate = 5;
@@ -126,7 +126,7 @@ export default async function BlogPostPage({ params }: { params: Promise<{ slug:
               {post.excerpt}
             </p>
             <div className="mb-4 flex flex-wrap items-center gap-4 text-sm text-gray-500 dark:text-gray-400">
-              {post.author && post.author.slug && (
+              {post.author?.slug && (
                 <Link
                   href={`/author/${post.author.slug}`}
                   className="flex items-center gap-2 transition-colors hover:text-blue-600 dark:hover:text-blue-400"

app/api/og/route.tsx

@@ -1,5 +1,5 @@
 import { BookOpen, Users, Tag } from "lucide-react";
-import { Metadata } from "next";
+import type { Metadata } from "next";
 
 import { AnimatedSection, AnimatedContainer, AnimatedElement } from "@/components/animations";
 import BlogPostCard from "@/components/blog/BlogPostCard";