tidying things up for easier dev later

app/(client)/page.tsx

@@ -1,6 +1,6 @@
 import Header from "../components/header"
 import PostComponent from "../components/preview-card"
-import { PostType } from "../utills/interface"
+import { PostType } from "../../sanity/lib/interface"
 import { basicFetch, previewData } from "@/sanity/lib/fetchData"
 
 export const revalidate = 60

app/(client)/posts/[slug]/page.tsx

@@ -3,7 +3,7 @@ import { getPost } from "@/sanity/lib/fetchData";
 import { PortableText } from "@portabletext/react";
 import Image from "next/image";
 import { urlForImage } from "@/sanity/lib/image";
-import { PostType } from "@/app/utills/interface";
+import { PostType } from "@/sanity/lib/interface";
 import { notFound } from "next/navigation";
 import Header from "@/app/components/header";
 import PostParagraphs from "../../../components/post-paragraph";

app/(client)/tag/[slug]/page.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import { getPostsByTag } from "@/sanity/lib/fetchData"
-import { PostType } from "@/app/utills/interface"
+import { PostType } from "@/sanity/lib/interface"
 import Header from "@/app/components/header"
 import Post from "@/app/components/preview-card"
 

app/(client)/tag/page.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import { basicFetch, tagsData } from "@/sanity/lib/fetchData"
-import { Tag } from "@/app/utills/interface"
+import { Tag } from "@/sanity/lib/interface"
 import Header from "@/app/components/header"
 import Link from "next/link"
 
@@ -36,9 +36,6 @@ border-primary
 text-words
 bg-background
 hover:text-neutral-500
-
-
-//dark
 dark:bg-backgroundDark
 dark:text-wordsDark
 dark:border-primaryDark

app/components/footer.tsx

@@ -1,8 +1,8 @@
-import { Footer } from "../utills/interface"
+import { FooterTypes } from "../../sanity/lib/interface"
 import { basicFetch, footerData } from "@/sanity/lib/fetchData"
 
 export default async  function Footer() {
-    const footerText: Footer = await basicFetch(footerData)
+    const footerText: FooterTypes = await basicFetch(footerData)
   return (
     <div className={container}>
 

app/components/header.tsx

@@ -1,8 +1,8 @@
-import React from "react"
-import QRgrid from "./qr/qrGrid"
+import React from "react";
+import QRgrid from "./qr/qrGrid";
 
 interface Props {
-  title: string
+  title: string;
 }
 
 export default function Header({ title = "" }: Props) {
@@ -14,58 +14,48 @@ export default function Header({ title = "" }: Props) {
 
       <h2 className={headerTitle}>{title}</h2>
     </header>
-  )
+  );
 }
 
 const headerBox = `
-  flex
   fixed
+  flex
   right-1/2
   transform 
   translate-x-1/2 
-
   h-20
   w-full 
   max-w-[61rem]
-  sm:h-40
-
   border-b
   border-primary 
   dark:border-primaryDark
-
   overflow-hidden
   backdrop-blur-[0.5rem]
-`
-
+  sm:h-40
+`;
+const headerTitle = `
+my-auto  
+mx-20
+w-1/3 
+px-1
+uppercase 
+font-bold
+text-left
+rotate-0
+bg-background
+dark:bg-backgroundDark
+sm:p-4
+sm:mx-auto
+sm:text-center
+sm:text-2xl
+sm:-rotate-3
+`;
 const QRstyle = `
   absolute 
   inset-0
-
   flex 
   items-center 
   justify-center
-
   opacity-0
   sm:opacity-100
-`
-
-const headerTitle = `
-  my-auto  
-  mx-20
-  w-1/3 
-  px-1
-
-  uppercase 
-  font-bold
-  text-left
-  rotate-0
-
-  bg-background
-  dark:bg-backgroundDark
-
-  sm:p-4
-  sm:mx-auto
-  sm:text-center
-  sm:text-2xl
-  sm:-rotate-3
-`
+`;

app/components/navbar.tsx

@@ -1,32 +1,29 @@
-import AllTagsButton from "./buttons/all-tags-button"
-import HomeButton from "./buttons/home-button"
-import ThemeSwitch from "./buttons/theme-switch"
+import AllTagsButton from "./buttons/all-tags-button";
+import HomeButton from "./buttons/home-button";
+import ThemeSwitch from "./buttons/theme-switch";
 
 export default function NavBar() {
   return (
     <div className={navContainer}>
-        <HomeButton />
+      <HomeButton />
       <div className="flex gap-4">
         <AllTagsButton />
         <ThemeSwitch />
       </div>
     </div>
-  )
+  );
 }
 
 const navContainer = `
   z-50
-
   fixed
+  flex 
+  justify-between
   right-1/2
   transform 
   translate-x-1/2 
-
   w-full 
   max-w-[61rem]
   px-4
   py-8
-
-  flex 
-  justify-between
-`
+`;

app/components/post-infoBox.tsx

@@ -1,6 +1,6 @@
 import Image from "next/image";
 import Link from "next/link";
-import { Links, PostType } from "../utills/interface";
+import { Links, PostType } from "../../sanity/lib/interface";
 
 interface InfoBoxProps {
   info: PostType;
@@ -10,98 +10,92 @@ interface InfoBoxProps {
 export default function InfoBox({ info, links }: InfoBoxProps) {
   return (
     <>
-     <div className="pb-4 max-width mx-auto">
-      <div className="flex justify-between items-end">
-        <h1 className="text-left text-3xl font-bold">{info?.title}</h1>
-        <span className="text-sm">{new Date(info?.publishedAt).toDateString()}</span>
-      </div>
-
-      </div>
-    <div className="flex flex-row max-width mx-auto border-y border-primary dark:border-primaryDark py-4">
-      <div className="w-0 sm:w-3/5">
-        {info && (
-          <Image
-          src={info.image}
-          alt={info.alt}
-          width={300}
-          height={300}
-          layout="fixed"
-          />
-        )}
+      <div className="pb-4 max-width mx-auto">
+        <div className="flex justify-between items-end">
+          <h1 className="text-left text-3xl font-bold">{info?.title}</h1>
+          <span className="text-sm">
+            {new Date(info?.publishedAt).toDateString()}
+          </span>
+        </div>
       </div>
+      <div className="flex flex-row max-width mx-auto border-y border-primary dark:border-primaryDark py-4">
+        <div className="w-0 sm:w-3/5">
+          {info && (
+            <Image
+              src={info.image}
+              alt={info.alt}
+              width={300}
+              height={300}
+              layout="fixed"
+            />
+          )}
+        </div>
 
-      <div
-        className="
+        <div
+          className="
         flex 
         flex-col 
         text-left
         sm:text-right
         w-3/5
         sm:w-2/5
-        ">
+        "
+        >
           <h2> Ive mostly been...</h2>
           <div className="pt-2">
-          <h3>Playing:</h3>
-        {links?.playing?.map((link) => (
-          <div key={link._key}>
-            <ul>
-              <li>
-            <Link 
-            href={link.url}
-            target="_blank"
-            className="underline hover:text-neutral-500 hover:dark:text-accent "
-            >
-              <i>
-            {link.text}
-              </i>
-            </Link>
-              </li>
-              </ul>
+            <h3>Playing:</h3>
+            {links?.playing?.map((link) => (
+              <div key={link._key}>
+                <ul>
+                  <li>
+                    <Link
+                      href={link.url}
+                      target="_blank"
+                      className="underline hover:text-neutral-500 hover:dark:text-accent "
+                    >
+                      <i>{link.text}</i>
+                    </Link>
+                  </li>
+                </ul>
+              </div>
+            ))}
           </div>
-        ))}
-        </div>
           <div className="pt-4">
-          <h3>Watching:</h3>
-        {links?.watching?.map((link) => (
-          <div key={link._key}>
-            <ul>
-              <li>
-            <Link 
-            href={link.url}
-            target="_blank"
-            className="underline hover:text-neutral-500 hover:dark:text-accent "
-            >
-                          <i>
-            {link.text}
-              </i>
-            </Link>
-              </li>
-              </ul>
+            <h3>Watching:</h3>
+            {links?.watching?.map((link) => (
+              <div key={link._key}>
+                <ul>
+                  <li>
+                    <Link
+                      href={link.url}
+                      target="_blank"
+                      className="underline hover:text-neutral-500 hover:dark:text-accent "
+                    >
+                      <i>{link.text}</i>
+                    </Link>
+                  </li>
+                </ul>
+              </div>
+            ))}
           </div>
-        ))}
-        </div>
           <div className="pt-4">
-          <h3>Listening to:</h3>
-        {links?.listening?.map((link) => (
-          <div key={link._key}>
-            <ul>
-              <li>
-            <Link 
-            href={link.url}
-            target="_blank"
-            className="underline hover:text-neutral-500 hover:dark:text-accent "
-            >
-              <i>
-
-            {link.artist}
-              </i>
-            </Link>
-              </li>
-              </ul>
+            <h3>Listening to:</h3>
+            {links?.listening?.map((link) => (
+              <div key={link._key}>
+                <ul>
+                  <li>
+                    <Link
+                      href={link.url}
+                      target="_blank"
+                      className="underline hover:text-neutral-500 hover:dark:text-accent "
+                    >
+                      <i>{link.artist}</i>
+                    </Link>
+                  </li>
+                </ul>
+              </div>
+            ))}
           </div>
-        ))}
-        </div>
-
         </div>
       </div>
     </>