Gave up implementing Code Blocks for now �

.gitignore

@@ -9,7 +9,6 @@
 !.yarn/plugins
 !.yarn/releases
 !.yarn/versions
-bun.lockb
 
 # testing
 /coverage
@@ -44,5 +43,3 @@ next-env.d.ts
 .turbo
 
 .vercel
-
-debug.log

debug.log

@@ -0,0 +1,3 @@
+[1027/133620.512:ERROR:crashpad_client_win.cc(810)] not connected
+[1027/150423.695:ERROR:crashpad_client_win.cc(810)] not connected
+[1027/150423.912:ERROR:crashpad_client_win.cc(810)] not connected

package.json

@@ -14,28 +14,27 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "lucide-react": "^0.453.0",
-    "next": "^15.0.2",
-    "next-sanity": "^9.8.8",
+    "next": "15.0.1",
+    "next-sanity": "^9.8.7",
     "next-themes": "^0.3.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "19.0.0-rc-69d4b800-20241021",
+    "react-dom": "19.0.0-rc-69d4b800-20241021",
     "react-error-boundary": "^4.1.2",
-    "react-refractor": "^3.1.1",
-    "sanity": "^3.62.3",
+    "sanity": "^3.62.2",
     "sass": "^1.80.4",
     "sonner": "^1.5.0",
-    "styled-components": "^6.1.13",
+    "styled-components": "6",
     "tailwind-merge": "^2.5.4",
     "tailwindcss-animate": "^1.0.7"
   },
   "devDependencies": {
-    "typescript": "^5.6.3",
-    "@types/node": "^20.17.3",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "postcss": "^8.4.47",
-    "tailwindcss": "^3.4.14",
-    "eslint": "^8.57.1",
+    "typescript": "^5",
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "postcss": "^8",
+    "tailwindcss": "^3.4.1",
+    "eslint": "^8",
     "eslint-config-next": "15.0.1"
   }
 }

src/app/[slug]/page.tsx

@@ -7,7 +7,6 @@ import Image from "next/image";
 import { Post, SanityImageAsset } from "@/sanity/sanity.types";
 import urlBuilder from "@sanity/image-url";
 import {getImageDimensions} from '@sanity/asset-utils'
-import { Refractor } from 'react-refractor'
 
 const POST_QUERY = defineQuery(`*[_type == "post" && slug.current == $slug][0]`);
 const POSTS_QUERY = defineQuery(`*[_type == "post"]{slug}`)
@@ -42,16 +41,6 @@ export default async function PostPage(props: { params: PageParams }) {
 
   const postImageUrl = post.mainImage ? urlFor(post.mainImage)?.width(550).height(310).url() : null;
 
-  function Code(props: {language: string | undefined, code: string, highlightedLines: number[]}) {
-    return (
-      <Refractor
-        language={props.language || "text" }
-        value={props.code}
-        markers={props.highlightedLines}
-      />
-    )
-  }
-  
   function PortableImage({ value, isInline }: { value: SanityImageAsset; isInline: boolean }) {
     const {width, height} = getImageDimensions(value)
     return <Image
@@ -89,11 +78,9 @@ export default async function PostPage(props: { params: PageParams }) {
           height="310"
         />
       )}
-
       <h1 className="text-4xl font-bold mb-8">{post.title}</h1>
       <div className="prose">
         <p>Published: {new Date(post.publishedAt ?? "").toISOString().substring(0, 10)}</p>
-        {Code({language: post.myCodeField?.language, code: post.myCodeField?.code ?? "", highlightedLines: post.myCodeField?.highlightedLines ?? []})}
         {Array.isArray(post.body) && <PortableText value={post.body} components={ { types: { image: PortableImage } } } />}
       </div>
     </main>