chore: docker restart always

.github/workflows/docker-build.yml

@@ -0,0 +1,28 @@
+name: Build and Push Docker Image
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Log in to DockerHub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_PASSWORD }}
+
+      - name: Build and push Docker image
+        run: |
+          docker build -t pihkaal/me:latest --build-arg GH_PAT=${{ secrets.GH_PAT }} .
+          docker push pihkaal/me:latest

Dockerfile

@@ -1,7 +1,11 @@
 FROM node:20-slim AS base
 
+ARG GH_PAT
+
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
+ENV GH_PAT="$GH_PAT"
+
 RUN corepack enable
 
 COPY . /app

docker-compose.yaml

@@ -1,5 +0,0 @@
-services:
-  app:
-    build: .
-    ports:
-      - "3001:80"

docker-compose.yml

@@ -0,0 +1,17 @@
+services:
+  pihkaal-me:
+    image: pihkaal/me:latest
+    networks:
+      - web
+    labels:
+      - "traefik.enable=true"
+      - "traefik.http.routers.pihkaal-me.rule=Host(`pihkaal.me`)"
+      - "traefik.http.routers.pihkaal-me.service=pihkaal-me"
+      - "traefik.http.services.pihkaal-me.loadbalancer.server.port=80"
+      - "traefik.http.routers.pihkaal-me.tls=true"
+      - "traefik.http.routers.pihkaal-me.tls.certResolver=myresolver"
+    restart: always
+
+networks:
+  web:
+    external: true

src/App.tsx

@@ -33,12 +33,12 @@ const AppRoot = () => {
           <Sddm />
         ) : (
           <div className="h-full flex-col">
-            <div className="relative z-10 px-2 py-2">
+            <div className="relative z-10 p-1 md:p-2">
               <Waybar />
             </div>
 
-            <div className="relative flex h-[calc(100%-50px)] w-full flex-col">
+            <div className="relative flex h-[calc(100svh-39px)] w-full flex-col md:h-[calc(100svh-50px)]">
-              <Kitty className="w-full flex-1 pb-1 pl-2 pr-2 pt-1">
+              <Kitty className="w-full flex-1 px-1 pt-1 md:px-2 md:pb-1">
                 <Nvim />
               </Kitty>
 

src/components/Music/Cava.tsx

@@ -107,7 +107,7 @@ const InnerCava = (props: InnerKittyProps<typeof Cava>) => {
         const audioContext = new AudioContext();
         audioContextRef.current = audioContext;
 
-        const response = await fetch("/audio/mesmerizing_galaxy.mp3");
+        const response = await fetch("/audio/music.mp3");
         const arrayBuffer = await response.arrayBuffer();
         const audioBuffer = await audioContext.decodeAudioData(arrayBuffer);
 

src/components/Music/SpotifyPlayer.tsx

@@ -91,6 +91,18 @@ const InnerSpotifyPlayer = (props: InnerKittyProps<typeof SpotifyPlayer>) => {
     .write(timeStringLeft - fillSize, timeString)
     .toString();
 
+  let titleAndArtist = `${
+    props.playing.item.name
+  } · ${props.playing.item.artists.map((a) => a.name).join(", ")}`;
+  if (titleAndArtist.length > props.cols - 4) {
+    titleAndArtist = titleAndArtist.slice(0, props.cols - 7) + "...";
+  }
+
+  let album = props.playing.item.album.name;
+  if (album.length > props.cols - 2) {
+    album = album.slice(0, props.cols - 5) + "...";
+  }
+
   return (
     <>
       {/* title */}
@@ -131,11 +143,10 @@ const InnerSpotifyPlayer = (props: InnerKittyProps<typeof SpotifyPlayer>) => {
           <span className="font-normal">
             {false ? "\udb81\udc0a " : "\udb80\udfe4 "}
           </span>
-          {props.playing.item.name} ·{" "}
+          {titleAndArtist}
-          {props.playing.item.artists.map((a) => a.name).join(", ")}
         </span>
         <br />
-        <span className="text-color3">{props.playing.item.album.name}</span>
+        <span className="text-color3">{album}</span>
         <br />
         <div className="relative font-extrabold">
           <span className="bg-color2 text-color8">{fill}</span>

src/components/Music/index.tsx

@@ -67,7 +67,7 @@ export const Music = () => {
     <div className="flex flex-row pb-1">
       <Kitty
         className={cn(
-          "h-full pb-2 pl-2 pr-1 pt-1",
+          "h-full pb-1.5 pl-1 pr-1 pt-1 md:px-2",
           screenWidth < 900 ? "w-full" : "w-1/2",
         )}
         rows={5}

src/components/Nvim/NvimTree/index.tsx

@@ -95,6 +95,10 @@ export const NvimTree = (
   }
 
   useEffect(() => {
+    const readme = files.find((file) => file.name === "README.md") as Child;
+    props.onOpen(readme);
+    setSelectedY(files.indexOf(readme));
+
     const onScroll = (event: KeyboardEvent) => {
       if (activeKitty !== props.id) return;
       switch (event.key) {
@@ -122,7 +126,7 @@ export const NvimTree = (
     return () => {
       window.removeEventListener("keydown", onScroll);
     };
-  });
+  }, []);
 
   return (
     <div className="h-full select-none bg-[#0000001a]">

src/utils/icons.ts

@@ -48,6 +48,14 @@ export const ICONS: Record<string, Icon> = {
     char: "󰊤 ",
     color: "#ffffff",
   },
+  LinkedIn: {
+    char: " ",
+    color: "#0077b5",
+  },
+  CodinGame: {
+    char: " ",
+    color: "#f1c40f",
+  },
 };
 
 export const DEFAULT_ICON = { char: "󰈚 ", color: "#f599ae" };