fix: rule of hooks

Author: OlivierCo

apps/www/components/mdx-components.tsx

@@ -1,6 +1,6 @@
-import React from "react";
-import { CodeBlock } from "./code-block";
 import Link from "next/link";
+import Image from "next/image";
+import { CodeBlock } from "./code-block";
 
 export const MDXComponents = {
   h1: ({ children }: { children: React.ReactNode }) => (
@@ -67,9 +67,9 @@ export const MDXComponents = {
     <code>{children}</code>
   ),
   img: ({ src, alt }: { src?: string; alt?: string }) => (
-    <img
-      src={src}
-      alt={alt}
+    <Image
+      src={src ?? ""}
+      alt={alt ?? ""}
       className="border-border my-8 h-auto max-w-full rounded-md border"
     />
   ),

apps/www/lib/get-cli-version.ts

@@ -1,8 +1,8 @@
-import { useGet } from "@/hooks/use-fetch";
+import { useGet as fetchGet } from "@/hooks/use-fetch";
 
 export async function getCliVersion(): Promise<string> {
   try {
-    const data = await useGet(
+    const data = await fetchGet(
       "https://raw.githubusercontent.com/small-lab-io/usehooks.io/main/packages/usehooks-cli/package.json"
     );
 

apps/www/lib/get-hook-doc.ts

@@ -1,11 +1,11 @@
-import { useFetch } from "@/hooks/use-fetch";
+import { useFetch as fetchData } from "@/hooks/use-fetch";
 import { HookDoc } from "./types";
 
 export async function getHookDoc(name: string): Promise<HookDoc | null> {
   const docUrl = `https://raw.githubusercontent.com/small-lab-io/usehooks.io/main/packages/hooks/src/${name}/doc.json`;
 
   try {
-    return await useFetch<HookDoc>(docUrl);
+    return await fetchData<HookDoc>(docUrl);
   } catch (error) {
     console.error(`Error fetching hook doc: ${error}`);
     return null;

apps/www/lib/get-hook-source.ts

@@ -1,10 +1,10 @@
-import { useFetch } from "@/hooks/use-fetch";
+import { useFetch as fetchData } from "@/hooks/use-fetch";
 
 export async function getHookSource(name: string): Promise<string> {
   const sourceUrl = `https://raw.githubusercontent.com/small-lab-io/usehooks.io/main/packages/hooks/src/${name}/index.ts`;
 
   try {
-    return await useFetch<string>(sourceUrl);
+    return await fetchData<string>(sourceUrl);
   } catch (error) {
     console.error(`Error fetching hook source: ${error}`);
     return "Source code not available";

apps/www/lib/get-hooks.ts

@@ -1,12 +1,12 @@
-import { useFetch } from "@/hooks/use-fetch";
+import { useFetch as fetchData } from "@/hooks/use-fetch";
 import { HookMeta } from "./types";
 
 const hooksUrl =
   "https://raw.githubusercontent.com/small-lab-io/usehooks.io/main/packages/hooks/src/index.json";
 
 export async function getHooks(): Promise<HookMeta[]> {
   try {
-    return await useFetch<HookMeta[]>(hooksUrl);
+    return await fetchData<HookMeta[]>(hooksUrl);
   } catch (error) {
     console.error("Error fetching hooks:", error);
     return [];