feat: set up supabase

drizzle.config.ts

@@ -4,14 +4,26 @@ import { env } from "@/env";
 
 export default {
   schema: "./src/server/db/schema.ts",
-  driver: "mysql2",
   dbCredentials: {
-    user: env.DATABASE_USER,
-    host: env.DATABASE_HOST,
-    port: +env.DATABASE_PORT,
-    password: env.DATABASE_PASSWORD,
-    database: env.DATABASE_NAME,
+    connectionString: env.DATABASE_URL,
   },
+  driver: "pg",
   tablesFilter: ["kujo205-blog_*"],
   out: "./src/server/db",
 } satisfies Config;
+
+/*
+* import "dotenv/config";
+import type { Config } from "drizzle-kit";
+
+if (!process.env.DATABASE_URL) {
+  throw new Error("DATABASE_URL is missing");
+}
+
+export default {
+  schema: "./src/schema.ts",
+  out: "./drizzle",
+  connectionString: process.env.DATABASE_URL,
+} satisfies Config;
+*
+* */

next.config.mjs

@@ -9,9 +9,8 @@ import createMDX from '@next/mdx'
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  // Configure `pageExtensions`` to include MDX files
   pageExtensions: ['js', 'jsx', 'md', 'mdx', 'ts', 'tsx'],
-  // Optionally, add any other Next.js config below
+  output:"standalone"
 }
 
 const withMDX = createMDX({

package.json

@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "build": "next build",
-    "db:push": "drizzle-kit push:mysql",
+    "db:migrate": "tsx src/scripts/migrate.ts",
     "db:studio": "drizzle-kit studio",
     "db:generate-migration": "drizzle-kit generate:mysql",
     "dev": "next dev",
@@ -47,6 +47,7 @@
     "next-auth": "^4.24.5",
     "next-mdx-remote": "^4.4.1",
     "next-themes": "^0.3.0",
+    "postgres": "^3.4.4",
     "prismjs": "^1.29.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
@@ -78,12 +79,13 @@
     "drizzle-kit": "^0.20.9",
     "eslint": "^8.54.0",
     "eslint-config-next": "^14.0.4",
-    "mysql2": "^3.6.1",
     "postcss": "^8.4.31",
     "prettier": "^3.1.0",
     "prettier-plugin-tailwindcss": "^0.5.7",
     "tailwindcss": "^3.3.5",
     "ts-node": "^10.9.2",
+    "tsconfig-paths": "^4.2.0",
+    "tsx": "^4.7.2",
     "typescript": "^5.1.6"
   },
   "ct3aMetadata": {

src/app/posts/create/page.tsx

@@ -14,7 +14,7 @@ export default async function Page({
   const data = await api.post.getPostValuesFromSession.query();
   // @ts-expect-error: types suck
   const defaultFormValues = data[0].postFormValues as TPostSchema;
-  const content = defaultFormValues.content || "";
+  const content = defaultFormValues?.content || "";
 
   return (
     <main className="flex flex-col items-center p-4">

src/components/mdPreview/components/index.tsx

@@ -1,10 +1,14 @@
 import type { MDXRemoteProps } from "next-mdx-remote/rsc";
 import { Pre } from "./Pre";
+import { withPaperClipAnchor } from "./withPaperClipAnchor";
 
 type TComponents = MDXRemoteProps["components"];
 
 const index: TComponents = {
   pre: Pre,
+  h1: (props) => {
+    return <h1 className="font-bol devd text-4xl" {...props} />;
+  },
 };
 
 export default index;

src/components/mdPreview/components/withPaperClipAnchor.tsx

@@ -0,0 +1,16 @@
+"use client";
+
+import { PaperclipIcon } from "lucide-react";
+
+export function withPaperClipAnchor<P extends JSX.IntrinsicAttributes>(
+  Component: React.ComponentType<P>,
+) {
+  return function WithPaperClipAnchor(props: P) {
+    return (
+      <div className="flex gap-[4px]">
+        <PaperclipIcon />
+        <Component {...props} />
+      </div>
+    );
+  };
+}

src/env.js

@@ -7,11 +7,7 @@ export const env = createEnv({
    * isn't built with invalid env vars.
    */
   server: {
-    DATABASE_NAME: z.string(),
-    DATABASE_USER: z.string(),
-    DATABASE_HOST: z.string(),
-    DATABASE_PORT: z.string(),
-    DATABASE_PASSWORD: z.string().optional(),
+    DATABASE_URL: z.string(),
     NODE_ENV: z
       .enum(["development", "test", "production"])
       .default("development"),
@@ -50,11 +46,7 @@ export const env = createEnv({
    * middlewares) or client-side so we need to destruct manually.
    */
   runtimeEnv: {
-    DATABASE_PASSWORD: process.env.DATABASE_PASSWORD,
-    DATABASE_PORT: process.env.DATABASE_PORT,
-    DATABASE_NAME: process.env.DATABASE_NAME,
-    DATABASE_HOST: process.env.DATABASE_HOST,
-    DATABASE_USER: process.env.DATABASE_USER,
+    DATABASE_URL: process.env.DATABASE_URL,
     NODE_ENV: process.env.NODE_ENV,
     NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
     NEXTAUTH_URL: process.env.NEXTAUTH_URL,