fix: address CodeRabbit review comments

Author: onerandomdevv

src/app/(public)/blog/[slug]/page.tsx

@@ -1,6 +1,7 @@
 import type { Metadata } from "next";
 import Image from "next/image";
 import { notFound } from "next/navigation";
+import { cache } from "react";
 import { desc, eq } from "drizzle-orm";
 import PostContent, {
   type TiptapJson,
@@ -13,6 +14,8 @@ import { getReadingTime } from "@/lib/utils";
 
 export const revalidate = 3600;
 
+const getCachedPostBySlug = cache(getPostBySlug);
+
 type UpdatePageProps = {
   params: {
     slug: string;
@@ -56,7 +59,7 @@ export async function generateStaticParams() {
 export async function generateMetadata({
   params,
 }: UpdatePageProps): Promise<Metadata> {
-  const post = await getPostBySlug(params.slug);
+  const post = await getCachedPostBySlug(params.slug);
 
   if (!post) {
     return {
@@ -90,7 +93,7 @@ export async function generateMetadata({
 }
 
 export default async function UpdatePage({ params }: UpdatePageProps) {
-  const post = await getPostBySlug(params.slug);
+  const post = await getCachedPostBySlug(params.slug);
 
   if (!post) {
     notFound();

src/app/api/upload/route.ts

@@ -7,7 +7,6 @@ const allowedFolders = [
   "products",
   "blogs",
   "blogs/inline",
-  "general",
 ] as const;
 
 function isAllowedFolder(folder: string): folder is (typeof allowedFolders)[number] {
@@ -23,9 +22,9 @@ export async function POST(request: Request) {
 
   try {
     const url = new URL(request.url);
-    const folder = url.searchParams.get("folder") || "general";
+    const folder = url.searchParams.get("folder");
 
-    if (!isAllowedFolder(folder)) {
+    if (!folder || !isAllowedFolder(folder)) {
       return NextResponse.json({ error: "Invalid folder" }, { status: 400 });
     }
 

src/components/admin/ImageUpload.tsx

@@ -9,13 +9,12 @@ export type UploadFolder =
   | "team"
   | "products"
   | "blogs"
-  | "blogs/inline"
-  | "general";
+  | "blogs/inline";
 
 type ImageUploadProps = {
   value: string | null;
   onChange: (url: string) => void;
-  folder?: UploadFolder;
+  folder: UploadFolder;
 };
 
 function getErrorMessage(value: unknown) {
@@ -34,7 +33,7 @@ function getErrorMessage(value: unknown) {
 export default function ImageUpload({
   value,
   onChange,
-  folder = "general",
+  folder,
 }: ImageUploadProps) {
   const inputRef = useRef<HTMLInputElement>(null);
   const [isUploading, setIsUploading] = useState(false);

src/components/admin/ResourceForms.tsx

@@ -191,7 +191,6 @@ export function TeamMemberForm({
       <Input label="Name" value={values.name} onChange={(event) => setValues({ ...values, name: event.target.value })} required />
       <Input label="Role" value={values.role} onChange={(event) => setValues({ ...values, role: event.target.value })} required />
       <Textarea label="Bio" value={values.bio} onChange={(event) => setValues({ ...values, bio: event.target.value })} required />
-      <Input label="Photo URL" value={values.photo_url} onChange={(event) => setValues({ ...values, photo_url: event.target.value })} />
       <ImageUpload folder="team" value={values.photo_url || null} onChange={(url) => setValues({ ...values, photo_url: url })} />
       <div className="grid gap-4 md:grid-cols-3">
         <Input label="LinkedIn URL" value={values.linkedin_url} onChange={(event) => setValues({ ...values, linkedin_url: event.target.value })} />

src/components/admin/RichTextEditor.tsx

@@ -74,8 +74,9 @@ export default function RichTextEditor({
 
     const formData = new FormData();
     formData.append("file", file);
+    const uploadFolder = encodeURIComponent("blogs/inline");
 
-    const response = await fetch("/api/upload?folder=blogs%2Finline", {
+    const response = await fetch(`/api/upload?folder=${uploadFolder}`, {
       method: "POST",
       body: formData,
     });

src/components/layout/Navbar.tsx

@@ -70,7 +70,7 @@ export default function Navbar() {
           onClick={() => setIsOpen((current) => !current)}
         >
           {isOpen ? (
-            <CloseIcon className="h-5 w-5" />
+            <CloseIcon className="h-6 w-6" />
           ) : (
             <MenuIcon className="h-6 w-6" />
           )}

src/lib/cloudinary.ts

@@ -6,6 +6,19 @@ export function getOptimisedUrl(
     return "";
   }
 
+  try {
+    const parsedUrl = new URL(url);
+
+    if (
+      !parsedUrl.hostname.endsWith("cloudinary.com") ||
+      !parsedUrl.pathname.includes("/upload/")
+    ) {
+      return url;
+    }
+  } catch {
+    return url;
+  }
+
   return url.replace("/upload/", `/upload/${transformation}/`);
 }
 

src/lib/utils.ts

@@ -16,9 +16,29 @@ export function slugify(value: string) {
 }
 
 export function getReadingTime(content: unknown): string {
-  const text = JSON.stringify(content);
-  const wordCount = text.split(/\s+/).length;
-  const minutes = Math.ceil(wordCount / 200);
+  function extractText(value: unknown): string {
+    if (typeof value === "string") {
+      return value;
+    }
+
+    if (Array.isArray(value)) {
+      return value.map(extractText).join(" ");
+    }
+
+    if (value && typeof value === "object") {
+      const node = value as { text?: unknown; content?: unknown };
+      const ownText = typeof node.text === "string" ? node.text : "";
+      const childText = extractText(node.content);
+
+      return `${ownText} ${childText}`.trim();
+    }
+
+    return "";
+  }
+
+  const text = extractText(content).trim();
+  const wordCount = text ? text.split(/\s+/).length : 0;
+  const minutes = wordCount === 0 ? 0 : Math.ceil(wordCount / 200);
 
   return `${minutes} min read`;
 }