Merge pull request 'dev' (#5) from dev into main

Reviewed-on: #5

.gitea/workflows/deploy.yml

@@ -9,11 +9,13 @@ jobs:
   deploy:
     runs-on: linux
     steps:
-      - name: Setup SSH Key
+      - name: Navigate to project and pull latest code
         run: |
-          mkdir -p ~/.ssh
+          cd /home/pablo/opt/apps/pablo.shortman.me
-          echo "${{ secrets.SSH_PRIVATE_KEY }}" > ~/.ssh/id_ed25519
+          git pull origin main
-          chmod 600 ~/.ssh/id_ed25519
+
-          ssh-keyscan -H "${{ secrets.SSH_HOST }}" >> ~/.ssh/known_hosts
+      - name: Set up Docker Compose
-      - name: Deploy via SSH
+        run: |
-        run: ssh ${{ secrets.SSH_USER }}@${{ secrets.SSH_HOST }} "bash ~/deploy.sh ${{ secrets.PROJECT_DEPLOYMENT_PATH }}"
+          docker compose down
+          docker compose build
+          docker compose up -d

Dockerfile

@@ -1,15 +1,21 @@
+# Use official Node.js image
 FROM node:18-alpine
 
+# Install pnpm globally
 RUN npm install -g pnpm
 
 WORKDIR /app
 
+# Copy package manager files first for caching
 COPY package.json pnpm-lock.yaml ./
 
+# Install dependencies using pnpm
 RUN pnpm install --frozen-lockfile
 
 COPY . .
 
 RUN pnpm build
 
-CMD ["pnpm", "start"]
+EXPOSE 3004
+
+CMD ["pnpm", "start", "--port", "3004"]

docker-compose.yml

@@ -0,0 +1,10 @@
+version: "3.8"
+services:
+  nextjs:
+    build: .
+    container_name: pablo.shortman.me
+    environment:
+      - PORT=3004
+    ports:
+      - "3004:3004"
+    restart: always

src/app/(PAGES)/contact/page.tsx

@@ -2,11 +2,7 @@ import React from "react";
 import Contact from "@/components/setions/contact";
 
 function ContactPage() {
-  return (
+  return <Contact />;
-    <div className="pt-12">
-      <Contact />
-    </div>
-  );
 }
 
 export default ContactPage;

src/components/contact-form.tsx

@@ -24,7 +24,6 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { cn } from "@/lib/utils";
-import { sendDiscordNotification } from "@/lib/actions";
 
 const formSchema = z.object({
   name: z.string().min(2).max(50),
@@ -40,16 +39,10 @@ function ContactForm() {
   });
 
   // 2. Define a submit handler.
-  async function onSubmit({
+  function onSubmit(values: z.infer<typeof formSchema>) {
-    email,
+    // Do something with the form values.
-    message,
+    // ✅ This will be type-safe and validated.
-    name,
+    console.log(values);
-    budget,
-  }: z.infer<typeof formSchema>) {
-    await sendDiscordNotification(
-      `📬 **New Lead Submission**\n*Source*: pablo.shortman.me \n**Name**: ${name}\n**Email**: ${email}\n**Message**: ${message} \n**Budget**: ${budget} $`
-    );
-    form.reset();
   }
 
   return (
@@ -105,8 +98,8 @@ function ContactForm() {
                     <SelectValue placeholder="Select your Budget" />
                   </SelectTrigger>
                   <SelectContent>
-                    <SelectItem value="< €2k">{"less then $1k"}</SelectItem>
+                    <SelectItem value="< €2k">{"less then $2k"}</SelectItem>
-                    <SelectItem value="> €4k">{"more then $3k"}</SelectItem>
+                    <SelectItem value="> €4k">{"more then $4k"}</SelectItem>
                     <SelectItem value="> €6k">{"more then $6k"}</SelectItem>
                   </SelectContent>
                 </Select>

src/components/setions/tech.tsx

@@ -1,16 +1,10 @@
-import Link from "next/link";
 import React from "react";
 
 export type TechIcon = "ts" | "next" | "react" | "tailwind" | "PostgreSQL";
 
-const tech: {
+const tech: { label: string; Logo: (props: any) => JSX.Element }[] = [
-  label: string;
-  link: string;
-  Logo: (props: any) => JSX.Element;
-}[] = [
   {
     label: "Tailwind CSS",
-    link: "https://tailwindcss.com/",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -51,7 +45,6 @@ const tech: {
   },
   {
     label: "Typescript",
-    link: "https://www.typescriptlang.org/",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -79,7 +72,6 @@ const tech: {
   },
   {
     label: "Next JS",
-    link: "https://nextjs.org/",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -107,8 +99,6 @@ const tech: {
   },
   {
     label: "Drizzle ORM",
-    link: "https://orm.drizzle.team/",
-
     Logo: (props: any) => (
       <svg
         {...props}
@@ -138,7 +128,6 @@ const tech: {
 
   {
     label: "PostgreSQL",
-    link: "https://www.postgresql.org/",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -168,7 +157,6 @@ const tech: {
 
   {
     label: "Figma",
-    link: "https://www.figma.com",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -196,7 +184,6 @@ const tech: {
   },
   {
     label: "Github",
-    link: "https://github.com/",
     Logo: (props: any) => (
       <svg
         {...props}
@@ -228,20 +215,18 @@ function Tech() {
   return (
     <div className="py-12 lg:py-20 container relative space-y-8">
       <h3 className="text-sm font-mono text-muted-foreground text-center">
-        most liked <span className="text-foreground">technologies</span> and{" "}
+        most liked{" "}
-        <span className="text-foreground">tools</span>
+        <span className="underline text-foreground">technologies</span> and{" "}
+        <span className="underline text-foreground">tools</span>
       </h3>
       <ul className="flex w-full items-center justify-center gap-2 md:gap-4 lg:gap-8 flex-wrap">
-        {tech.map(({ Logo, label, link }, idx) => (
+        {tech.map(({ Logo, label }, idx) => (
-          <li key={idx}>
+          <li
-            <Link
+            className="flex items-center gap-2 py-2 px-6 rounded-md bg-muted"
-              href={link}
+            key={idx}
-              target="_blank"
+          >
-              className="flex items-center gap-2 py-2 px-6 rounded-md bg-muted"
+            <Logo className="size-6" />
-            >
+            <span>{label}</span>
-              <Logo className="size-6" />
-              <span>{label}</span>
-            </Link>
           </li>
         ))}
       </ul>

src/lib/actions.ts

@@ -1,13 +0,0 @@
-"use server";
-
-export async function sendDiscordNotification(message: string) {
-  const webhookUrl = process.env.DISCORD_WEBHOOK_URL;
-
-  await fetch(webhookUrl!, {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({
-      content: message,
-    }),
-  });
-}

test.yml

@@ -1,15 +0,0 @@
-    labels:
-      - "traefik.enable=true"
-      - "traefik.http.routers.logipedia.rule=Host(`logipedia.shortman.me`)"
-      - "traefik.http.routers.logipedia.entrypoints=websecure"
-      - "traefik.http.routers.logipedia.tls.certresolver=myresolver"
-    networks:
-      - logipedia_network
-      - webproxy
-    labels:
-      - "traefik.enable=true"
-      - "traefik.http.routers.pablo-shortman-me.rule=Host(`pablo.shortman.me`)"
-      - "traefik.http.routers.pablo-shortman-me.entrypoints=websecure"
-      - "traefik.http.routers.pablo-shortman-me.tls.certresolver=myresolver"
-    networks:
-      - webproxy