make workflow more generic

Switch to all pure go libraries to no longer depends on libc, allowing
us to use a static container image. Compress binary using UPX for an
addition 7MB

.github/workflows/docker-publish.yml

@@ -1,5 +1,8 @@
 name: Build and Push Docker Image to GHCR
 
+env:
+  OCI_TOKEN: ${{ secrets.OCI_TOKEN || secrets.GITHUB_TOKEN }}
+
 on:
   push:
     branches: ["main"]
@@ -20,15 +23,15 @@ jobs:
       - name: Log in to GHCR
         uses: docker/login-action@v3
         with:
-          registry: ghcr.io
+          registry: ${{ vars.OCI_REGISTRY || 'ghcr.io' }}
           username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
+          password: ${{ env.OCI_TOKEN }}
 
       - name: Extract Docker metadata
         id: meta
         uses: docker/metadata-action@v5
         with:
-          images: ghcr.io/${{ github.repository }}
+          images: ${{ vars.OCI_REGISTRY || 'ghcr.io' }}/${{ github.repository }}
 
       - name: Build and push Docker image
         uses: docker/build-push-action@v6

Dockerfile

@@ -1,18 +1,28 @@
 FROM golang:1.25 AS builder
 
+# build dependencies
+RUN apt update && apt install -y upx
+
+RUN curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v4.1.13/tailwindcss-linux-x64
+RUN chmod +x tailwindcss-linux-x64
+RUN mv tailwindcss-linux-x64 /usr/local/bin/tailwindcss
+
+RUN go install github.com/juls0730/zqdgr@latest
+
 WORKDIR /app
 
-ENV CGO_ENABLED=1 GOOS=linux GOARCH=amd64
+ENV CGO_ENABLED=0 GOOS=linux GOARCH=amd64
-RUN apt-get update && apt-get install -y gcc libc6-dev sqlite3 ca-certificates
 
 COPY go.mod go.sum ./
 RUN go mod download
 COPY . .
 
-RUN go build -ldflags="-w -s" -o passport 
+
+RUN zqdgr build
+RUN upx passport
 
 # ---- Runtime Stage ----
-FROM gcr.io/distroless/cc-debian12
+FROM gcr.io/distroless/static-debian12 AS runner
 
 WORKDIR /data
 COPY --from=builder /app/passport /usr/local/bin/passport

README.md

@@ -22,22 +22,30 @@ Passport is a simple, fast, and lightweight web dashboard/new tab replacement.
 Passport is available as a Docker image via this repository. This is the recommended way to run Passport.
 
 ```bash
-docker run -d --name passport -p 3000:3000 -e PASSPORT_ADMIN_USERNAME=admin -e PASSPORT_ADMIN_PASSWORD=password ghcr.io/juls0730/passport:latest
+docker run -d --name passport -p 3000:3000 -v passport_data:/data -e PASSPORT_ADMIN_USERNAME=admin -e PASSPORT_ADMIN_PASSWORD=password ghcr.io/juls0730/passport:latest
 ```
 
+Make sure to change the admin password to something secure. At `/data` is where all of passport's persistent data will be stored, such as image uploads and the sqlite database.
+
 ### Building from source
 
 If you want to build from source, you will need to install the dependencies first.
 
 ```bash
+# note entirely necessary, but strongly recommended
 go install github.com/juls0730/zqdgr@latest
-go install github.com/tailwindlabs/tailwindcss-cli@latest
+
+curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/v4.1.13/tailwindcss-linux-x64
+chmod +x tailwindcss-linux-x64
+mv tailwindcss-linux-x64 /usr/local/bin/tailwindcss
+
+# you may also have to install sqlite3...
 ```
 
 Then you can build the binary.
 
 ```bash
-go build -o passport
+zqdgr build
 ```
 
 You can then run the binary.
@@ -59,21 +67,25 @@ You can then run the binary.
 
 #### Weather configuration
 
-| Environment Variable          | Description                                                               | Required   | Default        |
+The following only applies if you are using the OpenWeather integration.
-| ----------------------------- | ------------------------------------------------------------------------- | ---------- | -------------- |
+
-| `OPENWEATHER_PROVIDER`        | The weather provider to use, currently only `openweathermap` is supported | true       | openweathermap |
+| Environment Variable          | Description                                                               | Required | Default        |
-| `OPENWEATHER_API_KEY`         | The OpenWeather API key                                                   | if enabled |                |
+| ----------------------------- | ------------------------------------------------------------------------- | -------- | -------------- |
-| `OPENWEATHER_TEMP_UNITS`      | The temperature units to use, either `metric` or `imperial`               | false      | metric         |
+| `OPENWEATHER_PROVIDER`        | The weather provider to use, currently only `openweathermap` is supported | true     | openweathermap |
-| `OPENWEATHER_LAT`             | The latitude of your location                                             | if enabled |                |
+| `OPENWEATHER_API_KEY`         | The OpenWeather API key                                                   | true     |                |
-| `OPENWEATHER_LON`             | The longitude of your location                                            | if enabled |                |
+| `OPENWEATHER_TEMP_UNITS`      | The temperature units to use, either `metric` or `imperial`               | false    | metric         |
-| `OPENWEATHER_UPDATE_INTERVAL` | The interval in minutes to update the weather data                        | false      | 15             |
+| `OPENWEATHER_LAT`             | The latitude of your location                                             | true     |                |
+| `OPENWEATHER_LON`             | The longitude of your location                                            | true     |                |
+| `OPENWEATHER_UPDATE_INTERVAL` | The interval in minutes to update the weather data                        | false    | 15             |
 
 #### Uptime configuration
 
-| Environment Variable          | Description                                       | Required   | Default |
+The following only applies if you are using the UptimeRobot integration.
-| ----------------------------- | ------------------------------------------------- | ---------- | ------- |
+
-| `UPTIMEROBOT_API_KEY`         | The UptimeRobot API key                           | if enabled |         |
+| Environment Variable          | Description                                       | Required | Default |
-| `UPTIMEROBOT_UPDATE_INTERVAL` | The interval in seconds to update the uptime data | false      | 300     |
+| ----------------------------- | ------------------------------------------------- | -------- | ------- |
+| `UPTIMEROBOT_API_KEY`         | The UptimeRobot API key                           | true     |         |
+| `UPTIMEROBOT_UPDATE_INTERVAL` | The interval in seconds to update the uptime data | false    | 300     |
 
 ### Adding links and categories
 

go.mod

@@ -2,24 +2,33 @@ module github.com/juls0730/passport
 
 go 1.25.0
 
-require github.com/caarlos0/env/v11 v11.3.1
+require (
+	github.com/HugoSmits86/nativewebp v1.2.0
+	github.com/caarlos0/env/v11 v11.3.1
+	modernc.org/sqlite v1.39.0
+)
 
 require (
-	github.com/fxamacker/cbor/v2 v2.9.0 // indirect
+	github.com/dustin/go-humanize v1.0.1 // indirect
 	github.com/gofiber/schema v1.6.0 // indirect
 	github.com/mailgun/raymond/v2 v2.0.48 // indirect
+	github.com/ncruces/go-strftime v0.1.9 // indirect
 	github.com/philhofer/fwd v1.2.0 // indirect
+	github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec // indirect
 	github.com/sirupsen/logrus v1.8.1 // indirect
 	github.com/tinylib/msgp v1.4.0 // indirect
-	github.com/x448/float16 v0.8.4 // indirect
 	golang.org/x/crypto v0.42.0 // indirect
+	golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b // indirect
+	golang.org/x/image v0.24.0 // indirect
 	golang.org/x/net v0.44.0 // indirect
 	golang.org/x/text v0.29.0 // indirect
+	modernc.org/libc v1.66.3 // indirect
+	modernc.org/mathutil v1.7.1 // indirect
+	modernc.org/memory v1.11.0 // indirect
 )
 
 require (
 	github.com/andybalholm/brotli v1.2.0 // indirect
-	github.com/chai2010/webp v1.1.1
 	github.com/gofiber/fiber/v2 v2.52.5 // indirect
 	github.com/gofiber/fiber/v3 v3.0.0-rc.1
 	github.com/gofiber/template v1.8.3 // indirect
@@ -32,11 +41,9 @@ require (
 	github.com/mattn/go-colorable v0.1.14 // indirect
 	github.com/mattn/go-isatty v0.0.20 // indirect
 	github.com/mattn/go-runewidth v0.0.15 // indirect
-	github.com/mattn/go-sqlite3 v1.14.24
 	github.com/nfnt/resize v0.0.0-20180221191011-83c6a9932646
 	github.com/rivo/uniseg v0.2.0 // indirect
 	github.com/valyala/bytebufferpool v1.0.0 // indirect
 	github.com/valyala/fasthttp v1.66.0 // indirect
-	github.com/valyala/tcplisten v1.0.0 // indirect
 	golang.org/x/sys v0.36.0 // indirect
 )

go.sum

@@ -1,26 +1,20 @@
-github.com/andybalholm/brotli v1.1.1 h1:PR2pgnyFznKEugtsUo0xLdDop5SKXd5Qf5ysW+7XdTA=
+github.com/HugoSmits86/nativewebp v1.2.0 h1:XJtXeTg7FsOi9VB1elQYZy3n6VjYLqofSr3gGRLUOp4=
-github.com/andybalholm/brotli v1.1.1/go.mod h1:05ib4cKhjx3OQYUY22hTVd34Bc8upXjOLL2rKwwZBoA=
+github.com/HugoSmits86/nativewebp v1.2.0/go.mod h1:YNQuWenlVmSUUASVNhTDwf4d7FwYQGbGhklC8p72Vr8=
 github.com/andybalholm/brotli v1.2.0 h1:ukwgCxwYrmACq68yiUqwIWnGY0cTPox/M94sVwToPjQ=
 github.com/andybalholm/brotli v1.2.0/go.mod h1:rzTDkvFWvIrjDXZHkuS16NPggd91W3kUSvPlQ1pLaKY=
 github.com/caarlos0/env/v11 v11.3.1 h1:cArPWC15hWmEt+gWk7YBi7lEXTXCvpaSdCiZE2X5mCA=
 github.com/caarlos0/env/v11 v11.3.1/go.mod h1:qupehSf/Y0TUTsxKywqRt/vJjN5nz6vauiYEUUr8P4U=
-github.com/chai2010/webp v1.1.1 h1:jTRmEccAJ4MGrhFOrPMpNGIJ/eybIgwKpcACsrTEapk=
-github.com/chai2010/webp v1.1.1/go.mod h1:0XVwvZWdjjdxpUEIf7b9g9VkHFnInUSYujwqTLEuldU=
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
 github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
-github.com/fxamacker/cbor/v2 v2.7.0 h1:iM5WgngdRBanHcxugY4JySA0nk1wZorNOpTgCMedv5E=
+github.com/dustin/go-humanize v1.0.1 h1:GzkhY7T5VNhEkwH0PVJgjz+fX1rhBrR7pRT3mDkpeCY=
-github.com/fxamacker/cbor/v2 v2.7.0/go.mod h1:pxXPTn3joSm21Gbwsv0w9OSA2y1HFR9qXEeXQVeNoDQ=
+github.com/dustin/go-humanize v1.0.1/go.mod h1:Mu1zIs6XwVuF/gI1OepvI0qD18qycQx+mFykh5fBlto=
 github.com/fxamacker/cbor/v2 v2.9.0 h1:NpKPmjDBgUfBms6tr6JZkTHtfFGcMKsw3eGcmD/sapM=
 github.com/fxamacker/cbor/v2 v2.9.0/go.mod h1:vM4b+DJCtHn+zz7h3FFp/hDAI9WNWCsZj23V5ytsSxQ=
 github.com/gofiber/fiber/v2 v2.52.5 h1:tWoP1MJQjGEe4GB5TUGOi7P2E0ZMMRx5ZTG4rT+yGMo=
 github.com/gofiber/fiber/v2 v2.52.5/go.mod h1:KEOE+cXMhXG0zHc9d8+E38hoX+ZN7bhOtgeF2oT6jrQ=
-github.com/gofiber/fiber/v3 v3.0.0-beta.4 h1:KzDSavvhG7m81NIsmnu5l3ZDbVS4feCidl4xlIfu6V0=
-github.com/gofiber/fiber/v3 v3.0.0-beta.4/go.mod h1:/WFUoHRkZEsGHyy2+fYcdqi109IVOFbVwxv1n1RU+kk=
 github.com/gofiber/fiber/v3 v3.0.0-rc.1 h1:034MxesK6bqGkidP+QR+Ysc1ukOacBWOHCarCKC1xfg=
 github.com/gofiber/fiber/v3 v3.0.0-rc.1/go.mod h1:hFdT00oT0XVuQH1/z2i5n1pl/msExHDUie1SsLOkCuM=
-github.com/gofiber/schema v1.2.0 h1:j+ZRrNnUa/0ZuWrn/6kAtAufEr4jCJ+JuTURAMxNSZg=
-github.com/gofiber/schema v1.2.0/go.mod h1:YYwj01w3hVfaNjhtJzaqetymL56VW642YS3qZPhuE6c=
 github.com/gofiber/schema v1.6.0 h1:rAgVDFwhndtC+hgV7Vu5ItQCn7eC2mBA4Eu1/ZTiEYY=
 github.com/gofiber/schema v1.6.0/go.mod h1:WNZWpQx8LlPSK7ZaX0OqOh+nQo/eW2OevsXs1VZfs/s=
 github.com/gofiber/template v1.8.3 h1:hzHdvMwMo/T2kouz2pPCA0zGiLCeMnoGsQZBTSYgZxc=
@@ -29,87 +23,104 @@ github.com/gofiber/template/handlebars/v2 v2.1.10 h1:Qc+uUMULCqW60LF4VKO1REpiyDA
 github.com/gofiber/template/handlebars/v2 v2.1.10/go.mod h1:84WH9st5OJi255EGjuMAOqUVQ+Q2jUNhUKYbS5DgAcI=
 github.com/gofiber/utils v1.1.0 h1:vdEBpn7AzIUJRhe+CiTOJdUcTg4Q9RK+pEa0KPbLdrM=
 github.com/gofiber/utils v1.1.0/go.mod h1:poZpsnhBykfnY1Mc0KeEa6mSHrS3dV0+oBWyeQmb2e0=
-github.com/gofiber/utils/v2 v2.0.0-beta.7 h1:NnHFrRHvhrufPABdWajcKZejz9HnCWmT/asoxRsiEbQ=
-github.com/gofiber/utils/v2 v2.0.0-beta.7/go.mod h1:J/M03s+HMdZdvhAeyh76xT72IfVqBzuz/OJkrMa7cwU=
 github.com/gofiber/utils/v2 v2.0.0-rc.1 h1:b77K5Rk9+Pjdxz4HlwEBnS7u5nikhx7armQB8xPds4s=
 github.com/gofiber/utils/v2 v2.0.0-rc.1/go.mod h1:Y1g08g7gvST49bbjHJ1AVqcsmg93912R/tbKWhn6V3E=
+github.com/google/pprof v0.0.0-20250317173921-a4b03ec1a45e h1:ijClszYn+mADRFY17kjQEVQ1XRhq2/JR1M3sGqeJoxs=
+github.com/google/pprof v0.0.0-20250317173921-a4b03ec1a45e/go.mod h1:boTsfXsheKC2y+lKOCMpSfarhxDeIzfZG1jqGcPl3cA=
 github.com/google/uuid v1.6.0 h1:NIvaJDMOsjHA8n1jAhLSgzrAzy1Hgr+hNrb57e+94F0=
 github.com/google/uuid v1.6.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
 github.com/joho/godotenv v1.5.1 h1:7eLL/+HRGLY0ldzfGMeQkb7vMd0as4CfYvUVzLqw0N0=
 github.com/joho/godotenv v1.5.1/go.mod h1:f4LDr5Voq0i2e/R5DDNOoa2zzDfwtkZa6DnEwAbqwq4=
-github.com/klauspost/compress v1.17.11 h1:In6xLpyWOi1+C7tXUUWv2ot1QvBjxevKAaI6IXrJmUc=
-github.com/klauspost/compress v1.17.11/go.mod h1:pMDklpSncoRMuLFrf1W9Ss9KT+0rH90U12bZKk7uwG0=
 github.com/klauspost/compress v1.18.0 h1:c/Cqfb0r+Yi+JtIEq73FWXVkRonBlf0CRNYc8Zttxdo=
 github.com/klauspost/compress v1.18.0/go.mod h1:2Pp+KzxcywXVXMr50+X0Q/Lsb43OQHYWRCY2AiWywWQ=
 github.com/mailgun/raymond/v2 v2.0.48 h1:5dmlB680ZkFG2RN/0lvTAghrSxIESeu9/2aeDqACtjw=
 github.com/mailgun/raymond/v2 v2.0.48/go.mod h1:lsgvL50kgt1ylcFJYZiULi5fjPBkkhNfj4KA0W54Z18=
-github.com/mattn/go-colorable v0.1.13 h1:fFA4WZxdEF4tXPZVKMLwD8oUnCTTo08duU7wxecdEvA=
-github.com/mattn/go-colorable v0.1.13/go.mod h1:7S9/ev0klgBDR4GtXTXX8a3vIGJpMovkB8vQcUbaXHg=
 github.com/mattn/go-colorable v0.1.14 h1:9A9LHSqF/7dyVVX6g0U9cwm9pG3kP9gSzcuIPHPsaIE=
 github.com/mattn/go-colorable v0.1.14/go.mod h1:6LmQG8QLFO4G5z1gPvYEzlUgJ2wF+stgPZH1UqBm1s8=
-github.com/mattn/go-isatty v0.0.16/go.mod h1:kYGgaQfpe5nmfYZH+SKPsOc2e4SrIfOl2e/yFXSvRLM=
 github.com/mattn/go-isatty v0.0.20 h1:xfD0iDuEKnDkl03q4limB+vH+GxLEtL/jb4xVJSWWEY=
 github.com/mattn/go-isatty v0.0.20/go.mod h1:W+V8PltTTMOvKvAeJH7IuucS94S2C6jfK/D7dTCTo3Y=
 github.com/mattn/go-runewidth v0.0.15 h1:UNAjwbU9l54TA3KzvqLGxwWjHmMgBUVhBiTjelZgg3U=
 github.com/mattn/go-runewidth v0.0.15/go.mod h1:Jdepj2loyihRzMpdS35Xk/zdY8IAYHsh153qUoGf23w=
-github.com/mattn/go-sqlite3 v1.14.24 h1:tpSp2G2KyMnnQu99ngJ47EIkWVmliIizyZBfPrBWDRM=
+github.com/ncruces/go-strftime v0.1.9 h1:bY0MQC28UADQmHmaF5dgpLmImcShSi2kHU9XLdhx/f4=
-github.com/mattn/go-sqlite3 v1.14.24/go.mod h1:Uh1q+B4BYcTPb+yiD3kU8Ct7aC0hY9fxUwlHK0RXw+Y=
+github.com/ncruces/go-strftime v0.1.9/go.mod h1:Fwc5htZGVVkseilnfgOVb9mKy6w1naJmn9CehxcKcls=
 github.com/nfnt/resize v0.0.0-20180221191011-83c6a9932646 h1:zYyBkD/k9seD2A7fsi6Oo2LfFZAehjjQMERAvZLEDnQ=
 github.com/nfnt/resize v0.0.0-20180221191011-83c6a9932646/go.mod h1:jpp1/29i3P1S/RLdc7JQKbRpFeM1dOBd8T9ki5s+AY8=
-github.com/philhofer/fwd v1.1.3-0.20240916144458-20a13a1f6b7c h1:dAMKvw0MlJT1GshSTtih8C2gDs04w8dReiOGXrGLNoY=
-github.com/philhofer/fwd v1.1.3-0.20240916144458-20a13a1f6b7c/go.mod h1:RqIHx9QI14HlwKwm98g9Re5prTQ6LdeRQn+gXJFxsJM=
 github.com/philhofer/fwd v1.2.0 h1:e6DnBTl7vGY+Gz322/ASL4Gyp1FspeMvx1RNDoToZuM=
 github.com/philhofer/fwd v1.2.0/go.mod h1:RqIHx9QI14HlwKwm98g9Re5prTQ6LdeRQn+gXJFxsJM=
 github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec h1:W09IVJc94icq4NjY3clb7Lk8O1qJ8BdBEF8z0ibU0rE=
+github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec/go.mod h1:qqbHyh8v60DhA7CoWK5oRCqLrMHRGoxYCSS9EjAz6Eo=
 github.com/rivo/uniseg v0.2.0 h1:S1pD9weZBuJdFmowNwbpi7BJ8TNftyUImj/0WQi72jY=
 github.com/rivo/uniseg v0.2.0/go.mod h1:J6wj4VEh+S6ZtnVlnTBMWIodfgj8LQOQFoIToxlJtxc=
+github.com/shamaton/msgpack/v2 v2.3.0 h1:eawIa7lQmwRv0V6rdmL/5Ev9KdJHk07eQH3ceJi3BUw=
+github.com/shamaton/msgpack/v2 v2.3.0/go.mod h1:6khjYnkx73f7VQU7wjcFS9DFjs+59naVWJv1TB7qdOI=
 github.com/sirupsen/logrus v1.8.1 h1:dJKuHgqk1NNQlqoA6BTlM1Wf9DOH3NBjQyu0h9+AZZE=
 github.com/sirupsen/logrus v1.8.1/go.mod h1:yWOB1SBYBC5VeMP7gHvWumXLIWorT60ONWic61uBYv0=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/testify v1.2.2/go.mod h1:a8OnRcib4nhh0OaRAV+Yts87kKdq0PP7pXfy6kDkUVs=
 github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
-github.com/stretchr/testify v1.10.0 h1:Xv5erBjTwe/5IxqUQTdXv5kgmIvbHo3QQyRwhJsOfJA=
-github.com/stretchr/testify v1.10.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
 github.com/stretchr/testify v1.11.0 h1:ib4sjIrwZKxE5u/Japgo/7SJV3PvgjGiRNAvTVGqQl8=
-github.com/tinylib/msgp v1.2.5 h1:WeQg1whrXRFiZusidTQqzETkRpGjFjcIhW6uqWH09po=
+github.com/stretchr/testify v1.11.0/go.mod h1:wZwfW3scLgRK+23gO65QZefKpKQRnfz6sD981Nm4B6U=
-github.com/tinylib/msgp v1.2.5/go.mod h1:ykjzy2wzgrlvpDCRc4LA8UXy6D8bzMSuAF3WD57Gok0=
 github.com/tinylib/msgp v1.4.0 h1:SYOeDRiydzOw9kSiwdYp9UcBgPFtLU2WDHaJXyHruf8=
 github.com/tinylib/msgp v1.4.0/go.mod h1:cvjFkb4RiC8qSBOPMGPSzSAx47nAsfhLVTCZZNuHv5o=
 github.com/valyala/bytebufferpool v1.0.0 h1:GqA5TC/0021Y/b9FG4Oi9Mr3q7XYx6KllzawFIhcdPw=
 github.com/valyala/bytebufferpool v1.0.0/go.mod h1:6bBcMArwyJ5K/AmCkWv1jt77kVWyCJ6HpOuEn7z0Csc=
-github.com/valyala/fasthttp v1.58.0 h1:GGB2dWxSbEprU9j0iMJHgdKYJVDyjrOwF9RE59PbRuE=
-github.com/valyala/fasthttp v1.58.0/go.mod h1:SYXvHHaFp7QZHGKSHmoMipInhrI5StHrhDTYVEjK/Kw=
 github.com/valyala/fasthttp v1.66.0 h1:M87A0Z7EayeyNaV6pfO3tUTUiYO0dZfEJnRGXTVNuyU=
 github.com/valyala/fasthttp v1.66.0/go.mod h1:Y4eC+zwoocmXSVCB1JmhNbYtS7tZPRI2ztPB72EVObs=
-github.com/valyala/tcplisten v1.0.0 h1:rBHj/Xf+E1tRGZyWIWwJDiRY0zc1Js+CV5DqwacVSA8=
-github.com/valyala/tcplisten v1.0.0/go.mod h1:T0xQ8SeCZGxckz9qRXTfG43PvQ/mcWh7FwZEA7Ioqkc=
 github.com/x448/float16 v0.8.4 h1:qLwI1I70+NjRFUR3zs1JPUCgaCXSh3SW62uAKT1mSBM=
 github.com/x448/float16 v0.8.4/go.mod h1:14CWIYCyZA/cWjXOioeEpHeN/83MdbZDRQHoFcYsOfg=
 github.com/xyproto/randomstring v1.0.5 h1:YtlWPoRdgMu3NZtP45drfy1GKoojuR7hmRcnhZqKjWU=
 github.com/xyproto/randomstring v1.0.5/go.mod h1:rgmS5DeNXLivK7YprL0pY+lTuhNQW3iGxZ18UQApw/E=
-golang.org/x/crypto v0.31.0 h1:ihbySMvVjLAeSH1IbfcRTkD/iNscyz8rGzjF/E5hV6U=
-golang.org/x/crypto v0.31.0/go.mod h1:kDsLvtWBEx7MV9tJOj9bnXsPbxwJQ6csT/x4KIN4Ssk=
 golang.org/x/crypto v0.42.0 h1:chiH31gIWm57EkTXpwnqf8qeuMUi0yekh6mT2AvFlqI=
 golang.org/x/crypto v0.42.0/go.mod h1:4+rDnOTJhQCx2q7/j6rAN5XDw8kPjeaXEUR2eL94ix8=
-golang.org/x/net v0.31.0 h1:68CPQngjLL0r2AlUKiSxtQFKvzRVbnzLwMUn5SzcLHo=
+golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b h1:M2rDM6z3Fhozi9O7NWsxAkg/yqS/lQJ6PmkyIV3YP+o=
-golang.org/x/net v0.31.0/go.mod h1:P4fl1q7dY2hnZFxEk4pPSkDHF+QqjitcnDjUQyMM+pM=
+golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b/go.mod h1:3//PLf8L/X+8b4vuAfHzxeRUl04Adcb341+IGKfnqS8=
+golang.org/x/image v0.24.0 h1:AN7zRgVsbvmTfNyqIbbOraYL8mSwcKncEj8ofjgzcMQ=
+golang.org/x/image v0.24.0/go.mod h1:4b/ITuLfqYq1hqZcjofwctIhi7sZh2WaCjvsBNjjya8=
+golang.org/x/mod v0.27.0 h1:kb+q2PyFnEADO2IEF935ehFUXlWiNjJWtRNgBLSfbxQ=
+golang.org/x/mod v0.27.0/go.mod h1:rWI627Fq0DEoudcK+MBkNkCe0EetEaDSwJJkCcjpazc=
 golang.org/x/net v0.44.0 h1:evd8IRDyfNBMBTTY5XRF1vaZlD+EmWx6x8PkhR04H/I=
 golang.org/x/net v0.44.0/go.mod h1:ECOoLqd5U3Lhyeyo/QDCEVQ4sNgYsqvCZ722XogGieY=
+golang.org/x/sync v0.17.0 h1:l60nONMj9l5drqw6jlhIELNv9I0A4OFgRsG9k2oT9Ug=
+golang.org/x/sync v0.17.0/go.mod h1:9KTHXmSnoGruLpwFjVSX0lNNA75CykiMECbovNTZqGI=
 golang.org/x/sys v0.0.0-20191026070338-33540a1f6037/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
-golang.org/x/sys v0.0.0-20220811171246-fbc7d0a398ab/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.28.0 h1:Fksou7UEQUWlKvIdsqzJmUmCX3cZuD2+P3XyyzwMhlA=
-golang.org/x/sys v0.28.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
 golang.org/x/sys v0.36.0 h1:KVRy2GtZBrk1cBYA7MKu5bEZFxQk4NIDV6RLVcC8o0k=
 golang.org/x/sys v0.36.0/go.mod h1:OgkHotnGiDImocRcuBABYBEXf8A9a87e/uXjp9XT3ks=
-golang.org/x/text v0.21.0 h1:zyQAAkrwaneQ066sspRyJaG9VNi/YJ1NfzcGB3hZ/qo=
-golang.org/x/text v0.21.0/go.mod h1:4IBbMaMmOPCJ8SecivzSH54+73PCFmPWxNTLm+vZkEQ=
 golang.org/x/text v0.29.0 h1:1neNs90w9YzJ9BocxfsQNHKuAT4pkghyXc4nhZ6sJvk=
 golang.org/x/text v0.29.0/go.mod h1:7MhJOA9CD2qZyOKYazxdYMF85OwPdEr9jTtBpO7ydH4=
+golang.org/x/tools v0.36.0 h1:kWS0uv/zsvHEle1LbV5LE8QujrxB3wfQyxHfhOk0Qkg=
+golang.org/x/tools v0.36.0/go.mod h1:WBDiHKJK8YgLHlcQPYQzNCkUxUypCaa5ZegCVutKm+s=
 gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
 gopkg.in/yaml.v2 v2.4.0 h1:D8xgwECY7CYvx+Y2n4sBz93Jn9JRvxdiyyo8CTfuKaY=
 gopkg.in/yaml.v2 v2.4.0/go.mod h1:RDklbk79AGWmwhnvt/jBztapEOGDOx6ZbXqjP6csGnQ=
 gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
 gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
 gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
+modernc.org/cc/v4 v4.26.2 h1:991HMkLjJzYBIfha6ECZdjrIYz2/1ayr+FL8GN+CNzM=
+modernc.org/cc/v4 v4.26.2/go.mod h1:uVtb5OGqUKpoLWhqwNQo/8LwvoiEBLvZXIQ/SmO6mL0=
+modernc.org/ccgo/v4 v4.28.0 h1:rjznn6WWehKq7dG4JtLRKxb52Ecv8OUGah8+Z/SfpNU=
+modernc.org/ccgo/v4 v4.28.0/go.mod h1:JygV3+9AV6SmPhDasu4JgquwU81XAKLd3OKTUDNOiKE=
+modernc.org/fileutil v1.3.8 h1:qtzNm7ED75pd1C7WgAGcK4edm4fvhtBsEiI/0NQ54YM=
+modernc.org/fileutil v1.3.8/go.mod h1:HxmghZSZVAz/LXcMNwZPA/DRrQZEVP9VX0V4LQGQFOc=
+modernc.org/gc/v2 v2.6.5 h1:nyqdV8q46KvTpZlsw66kWqwXRHdjIlJOhG6kxiV/9xI=
+modernc.org/gc/v2 v2.6.5/go.mod h1:YgIahr1ypgfe7chRuJi2gD7DBQiKSLMPgBQe9oIiito=
+modernc.org/goabi0 v0.2.0 h1:HvEowk7LxcPd0eq6mVOAEMai46V+i7Jrj13t4AzuNks=
+modernc.org/goabi0 v0.2.0/go.mod h1:CEFRnnJhKvWT1c1JTI3Avm+tgOWbkOu5oPA8eH8LnMI=
+modernc.org/libc v1.66.3 h1:cfCbjTUcdsKyyZZfEUKfoHcP3S0Wkvz3jgSzByEWVCQ=
+modernc.org/libc v1.66.3/go.mod h1:XD9zO8kt59cANKvHPXpx7yS2ELPheAey0vjIuZOhOU8=
+modernc.org/mathutil v1.7.1 h1:GCZVGXdaN8gTqB1Mf/usp1Y/hSqgI2vAGGP4jZMCxOU=
+modernc.org/mathutil v1.7.1/go.mod h1:4p5IwJITfppl0G4sUEDtCr4DthTaT47/N3aT6MhfgJg=
+modernc.org/memory v1.11.0 h1:o4QC8aMQzmcwCK3t3Ux/ZHmwFPzE6hf2Y5LbkRs+hbI=
+modernc.org/memory v1.11.0/go.mod h1:/JP4VbVC+K5sU2wZi9bHoq2MAkCnrt2r98UGeSK7Mjw=
+modernc.org/opt v0.1.4 h1:2kNGMRiUjrp4LcaPuLY2PzUfqM/w9N23quVwhKt5Qm8=
+modernc.org/opt v0.1.4/go.mod h1:03fq9lsNfvkYSfxrfUhZCWPk1lm4cq4N+Bh//bEtgns=
+modernc.org/sortutil v1.2.1 h1:+xyoGf15mM3NMlPDnFqrteY07klSFxLElE2PVuWIJ7w=
+modernc.org/sortutil v1.2.1/go.mod h1:7ZI3a3REbai7gzCLcotuw9AC4VZVpYMjDzETGsSMqJE=
+modernc.org/sqlite v1.39.0 h1:6bwu9Ooim0yVYA7IZn9demiQk/Ejp0BtTjBWFLymSeY=
+modernc.org/sqlite v1.39.0/go.mod h1:cPTJYSlgg3Sfg046yBShXENNtPrWrDX8bsbAQBzgQ5E=
+modernc.org/strutil v1.2.1 h1:UneZBkQA+DX2Rp35KcM69cSsNES9ly8mQWD71HKlOA0=
+modernc.org/strutil v1.2.1/go.mod h1:EHkiggD70koQxjVdSBM3JKM7k6L0FbGE5eymy9i3B9A=
+modernc.org/token v1.1.0 h1:Xl7Ap9dKaEs5kLoOQeQmPWevfnk/DM5qcLcYlA8ys6Y=
+modernc.org/token v1.1.0/go.mod h1:UGzOrNV1mAFSEB63lOFHIpNRUVMvYTc6yu1SMY/XTDM=

main.go

@@ -27,8 +27,8 @@ import (
 	"syscall"
 	"time"
 
+	"github.com/HugoSmits86/nativewebp"
 	"github.com/caarlos0/env/v11"
-	"github.com/chai2010/webp"
 	"github.com/gofiber/fiber/v3"
 	"github.com/gofiber/fiber/v3/middleware/helmet"
 	"github.com/gofiber/fiber/v3/middleware/static"
@@ -36,8 +36,8 @@ import (
 	"github.com/google/uuid"
 	"github.com/joho/godotenv"
 	"github.com/juls0730/passport/middleware"
-	_ "github.com/mattn/go-sqlite3"
 	"github.com/nfnt/resize"
+	_ "modernc.org/sqlite"
 )
 
 //go:embed assets/** templates/** schema.sql
@@ -174,7 +174,7 @@ func NewApp(dbPath string, options map[string]any) (*App, error) {
 		connectionOpts += fmt.Sprintf("%s=%v", k, v)
 	}
 
-	db, err := sql.Open("sqlite3", fmt.Sprintf("%s?%s", dbPath, connectionOpts))
+	db, err := sql.Open("sqlite", fmt.Sprintf("%s?%s", dbPath, connectionOpts))
 	if err != nil {
 		return nil, err
 	}
@@ -451,8 +451,9 @@ func UploadFile(file *multipart.FileHeader, fileName, contentType string, c fibe
 	case "image/png":
 		img, err = png.Decode(srcFile)
 	case "image/webp":
-		img, err = webp.Decode(srcFile)
+		img, err = nativewebp.Decode(srcFile)
 	case "image/svg+xml":
+		// does not fall through (my C brain was tripping over this)
 	default:
 		return "", errors.New("unsupported file type")
 	}
@@ -479,8 +480,8 @@ func UploadFile(file *multipart.FileHeader, fileName, contentType string, c fibe
 		resizedImg := resize.Resize(64, 0, img, resize.MitchellNetravali)
 
 		var buf bytes.Buffer
-		options := &webp.Options{Lossless: true, Quality: 80}
+		options := &nativewebp.Options{}
-		if err := webp.Encode(&buf, resizedImg, options); err != nil {
+		if err := nativewebp.Encode(&buf, resizedImg, options); err != nil {
 			return "", err
 		}
 
@@ -552,19 +553,10 @@ func (manager *CategoryManager) GetCategories() []Category {
 
 // Get Category by ID, returns nil if not found
 func (manager *CategoryManager) GetCategory(id int64) *Category {
-	rows, err := manager.db.Query(`
+	row := manager.db.QueryRow(`SELECT id, name, icon FROM categories WHERE id = ?`, id)
-		SELECT id, name, icon
-		FROM categories 
-		WHERE id = ?
-	`, id)
-
-	if err != nil {
-		return nil
-	}
-	defer rows.Close()
 
 	var cat Category
-	if err := rows.Scan(&cat.ID, &cat.Name, &cat.Icon); err != nil {
+	if err := row.Scan(&cat.ID, &cat.Name, &cat.Icon); err != nil {
 		return nil
 	}
 
@@ -639,17 +631,30 @@ func (manager *CategoryManager) DeleteCategory(id int64) error {
 
 	for _, icon := range icons {
 		if icon == "" {
+			slog.Debug("blank icon")
 			continue
 		}
 
 		if err := os.Remove(filepath.Join("public/", icon)); err != nil {
-			return err
+			// dont error to the user if the icon doesnt exist, just log it
+			slog.Error("Failed to delete icon", "icon", icon, "error", err)
 		}
 	}
 
 	return nil
 }
 
+func (manager *CategoryManager) GetLink(id int64) *Link {
+	row := manager.db.QueryRow(`SELECT id, category_id, name, description, icon, url FROM links WHERE id = ?`, id)
+
+	var link Link
+	if err := row.Scan(&link.ID, &link.CategoryID, &link.Name, &link.Description, &link.Icon, &link.URL); err != nil {
+		return nil
+	}
+
+	return &link
+}
+
 func (manager *CategoryManager) GetLinks(categoryID int64) []Link {
 	rows, err := manager.db.Query(`
 		SELECT id, category_id, name, description, icon, url 
@@ -710,7 +715,7 @@ func (manager *CategoryManager) DeleteLink(id any) error {
 
 	if icon != "" {
 		if err := os.Remove(filepath.Join("public/", icon)); err != nil {
-			return err
+			slog.Error("Failed to delete icon", "icon", icon, "error", err)
 		}
 	}
 
@@ -775,6 +780,7 @@ func main() {
 	}
 
 	app, err := NewApp(dbPath, map[string]any{
+		"_time_format":  "sqlite",
 		"cache":         "shared",
 		"mode":          "rwc",
 		"_journal_mode": "WAL",
@@ -939,7 +945,7 @@ func main() {
 			return c.Next()
 		})
 
-		api.Post("/categories", func(c fiber.Ctx) error {
+		api.Post("/category", func(c fiber.Ctx) error {
 			var req struct {
 				Name string `form:"name"`
 			}
@@ -950,7 +956,9 @@ func main() {
 			}
 
 			if req.Name == "" {
-				return fmt.Errorf("name and icon are required")
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Name is required",
+				})
 			}
 
 			file, err := c.FormFile("icon")
@@ -991,7 +999,9 @@ func main() {
 			})
 
 			if err != nil {
-				return err
+				return c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to create category: %v", err),
+				})
 			}
 
 			return c.Status(fiber.StatusCreated).JSON(fiber.Map{
@@ -1000,12 +1010,11 @@ func main() {
 			})
 		})
 
-		api.Post("/links", func(c fiber.Ctx) error {
+		api.Post("/category/:id/link", func(c fiber.Ctx) error {
 			var req struct {
 				Name        string `form:"name"`
 				Description string `form:"description"`
 				URL         string `form:"url"`
-				CategoryID  int64  `form:"category_id"`
 			}
 			if err := c.Bind().Form(&req); err != nil {
 				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
@@ -1014,7 +1023,22 @@ func main() {
 			}
 
 			if req.Name == "" || req.URL == "" {
-				return fmt.Errorf("name and url are required")
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Name and URL are required",
+				})
+			}
+
+			categoryID, err := strconv.ParseInt(c.Params("id"), 10, 64)
+			if err != nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to parse category ID: %v", err),
+				})
+			}
+
+			if app.CategoryManager.GetCategory(categoryID) == nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Category not found",
+				})
 			}
 
 			file, err := c.FormFile("icon")
@@ -1050,7 +1074,7 @@ func main() {
 			UploadFile(file, iconPath, contentType, c)
 
 			link, err := app.CategoryManager.CreateLink(app.CategoryManager.db, Link{
-				CategoryID:  req.CategoryID,
+				CategoryID:  categoryID,
 				Name:        req.Name,
 				Description: req.Description,
 				Icon:        iconPath,
@@ -1069,27 +1093,70 @@ func main() {
 			})
 		})
 
-		api.Delete("/links/:id", func(c fiber.Ctx) error {
+		api.Delete("/category/:categoryID/link/:linkID", func(c fiber.Ctx) error {
-			id := c.Params("id")
+			linkID, err := strconv.ParseInt(c.Params("linkID"), 10, 64)
-
-			err = app.CategoryManager.DeleteLink(id)
 			if err != nil {
-				return err
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to parse link ID: %v", err),
+				})
+			}
+
+			categoryID, err := strconv.ParseInt(c.Params("categoryID"), 10, 64)
+			if err != nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to parse category ID: %v", err),
+				})
+			}
+
+			if app.CategoryManager.GetCategory(categoryID) == nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Category not found",
+				})
+			}
+
+			link := app.CategoryManager.GetLink(linkID)
+			if link == nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Link not found",
+				})
+			}
+
+			if link.CategoryID != categoryID {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Invalid category ID",
+				})
+			}
+
+			err = app.CategoryManager.DeleteLink(linkID)
+			if err != nil {
+				return c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to delete link: %v", err),
+				})
 			}
 
 			return c.SendStatus(fiber.StatusOK)
 		})
 
-		api.Delete("/categories/:id", func(c fiber.Ctx) error {
+		api.Delete("/category/:id", func(c fiber.Ctx) error {
 			// id = parseInt(c.Params("id"))
 			id, err := strconv.ParseInt(c.Params("id"), 10, 64)
 			if err != nil {
-				return err
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to parse category ID: %v", err),
+				})
+			}
+
+			if app.CategoryManager.GetCategory(id) == nil {
+				return c.Status(fiber.StatusBadRequest).JSON(fiber.Map{
+					"message": "Category not found",
+				})
 			}
 
 			err = app.CategoryManager.DeleteCategory(id)
 			if err != nil {
-				return err
+				return c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
+					"message": fmt.Sprintf("Failed to delete category: %v", err),
+				})
 			}
 
 			return c.SendStatus(fiber.StatusOK)

middleware/admin.go

@@ -2,6 +2,8 @@ package middleware
 
 import (
 	"database/sql"
+	"fmt"
+	"log/slog"
 	"time"
 
 	"github.com/gofiber/fiber/v3"
@@ -27,12 +29,18 @@ func AdminMiddleware(db *sql.DB) func(c fiber.Ctx) error {
 			WHERE session_id = ?
 		`, sessionToken).Scan(&session.SessionID, &session.ExpiresAt)
 		if err != nil {
-			return c.Next()
+			slog.Error("Failed to check session", "error", err)
+			return c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
+				"message": fmt.Sprintf("Failed to check session: %v", err),
+			})
 		}
 
 		sessionExpiry, err := time.Parse("2006-01-02 15:04:05-07:00", session.ExpiresAt)
 		if err != nil {
-			return c.Next()
+			slog.Error("Failed to parse session expiry", "error", err)
+			return c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
+				"message": fmt.Sprintf("Failed to parse session expiry: %v", err),
+			})
 		}
 
 		if sessionExpiry.Before(time.Now()) {

styles/main.css

@@ -35,3 +35,15 @@ h2 {
 h3 {
     font-size: 1.25rem;
 }
+
+input:not(.search) {
+    @apply px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#2E2E32] placeholder:text-[#8A8E90] text-white focus-visible:outline-none transition-colors duration-300 ease-out overflow-hidden;
+    
+    &[type="file"] {
+        @apply p-0 cursor-pointer;
+
+        &::file-selector-button {
+            @apply px-2 py-2 mr-1 bg-[hsl(240,6%,18%)] text-white cursor-pointer;
+        }
+    }
+}

templates/views/admin/index.hbs

@@ -1,187 +1,212 @@
-<section class="flex justify-center w-full transition-[filter] duration-300 ease-[cubic-bezier(0.45,_0,_0.55,_1)]">
+<div id="blur-target" class="transition-[filter] ease-[cubic-bezier(0.45,0,0.55,1)] duration-300">
-    <div class="w-full sm:w-4/5 p-2.5">
+    <header class="flex w-full p-3">
-        {{#each Categories}}
+        <a href="/"
-        <div class="flex items-center">
+            class="flex items-center flex-row gap-2 text-white border-b hover:border-transparent justify-center">
-            <img class="object-contain mr-2 select-none" width="32" height="32" draggable="false" alt="{{this.Name}}"
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
-                src="{{this.Icon}}" />
+                viewBox="0 0 24 24"><!-- Icon from Tabler Icons by Paweł Kuna - https://github.com/tabler/tabler-icons/blob/master/LICENSE -->
-            <h2 class="capitalize">{{this.Name}}</h2>
+                <g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
-            <button onclick="deleteCategory({{this.ID}})"
+                    <path d="m9 14l-4-4l4-4" />
-                class="w-fit h-fit flex p-0.5 bg-[#1C1C21] border-solid border-[#211F23] rounded-md hover:bg-[#29292e] cursor-pointer"><svg
+                    <path d="M5 10h11a4 4 0 1 1 0 8h-1" />
-                    xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
+                </g>
-                    <path fill="none" stroke="#ff1919" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+            </svg>
-                        d="M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3" />
+            Return to home
-                </svg></button>
+        </a>
-        </div>
+    </header>
-        <div class="p-2.5 grid grid-cols-[repeat(auto-fill,_minmax(min(330px,_100%),_1fr))] gap-2">
+
-            {{#each this.Links}}
+    <section class="flex justify-center w-full">
-            <div
+        <div class="w-full sm:w-4/5 p-2.5">
-                class="rounded-2xl bg-[#211F23] p-2.5 flex flex-row items-center shadow-md hover:shadow-xl transition-[shadow,transform,translate] ease-[cubic-bezier(0.16,1,0.3,1)] hover:-translate-y-1 relative">
+            {{#each Categories}}
-                <img class="object-contain mr-2 select-none rounded-md" width="64" height="64" draggable="false"
+            <div class="flex items-center" key="category-{{this.ID}}">
-                    src="{{this.Icon}}" alt="{{this.Name}}" />
+                <img class="object-contain mr-2 select-none" width="32" height="32" draggable="false"
-                <div>
+                    alt="{{this.Name}}" src="{{this.Icon}}" />
-                    <h3>{{this.Name}}</h3>
+                <h2 class="capitalize break-all">{{this.Name}}</h2>
-                    <p class="text-[#D7D7D7]">{{this.Description}}</p>
+                <button onclick="deleteCategory({{this.ID}})"
-                </div>
+                    class="w-fit h-fit flex p-0.5 bg-[#1C1C21] border-solid border-[#211F23] rounded-md hover:bg-[#29292e] cursor-pointer"><svg
-                <button onclick="deleteLink({{this.ID}})"
-                    class="w-fit h-fit flex p-0.5 bg-[#1C1C21] border-solid border-[#211F23] rounded-md hover:bg-[#29292e] cursor-pointer absolute right-1 top-1"><svg
                         xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
                         <path fill="none" stroke="#ff1919" stroke-linecap="round" stroke-linejoin="round"
                             stroke-width="2"
                             d="M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3" />
                     </svg></button>
             </div>
+            <div class="p-2.5 grid grid-cols-[repeat(auto-fill,_minmax(min(330px,_100%),_1fr))] gap-2">
+                {{#each this.Links}}
+                <div key="link-{{this.ID}}"
+                    class="rounded-2xl bg-[#211F23] p-2.5 flex flex-row items-center shadow-md hover:shadow-xl transition-[shadow,transform,translate] ease-[cubic-bezier(0.16,1,0.3,1)] hover:-translate-y-1 relative">
+                    <img class="mr-2 select-none rounded-md aspect-square object-cover" width="64" height="64"
+                        draggable="false" src="{{this.Icon}}" alt="{{this.Name}}" />
+                    <div class="break-all">
+                        <h3>{{this.Name}}</h3>
+                        <p class="text-[#D7D7D7]">{{this.Description}}</p>
+                    </div>
+                    <button onclick="deleteLink({{this.ID}}, {{this.CategoryID}})"
+                        class="w-fit h-fit flex p-0.5 bg-[#1C1C21] border-solid border-[#211F23] rounded-md hover:bg-[#29292e] cursor-pointer absolute right-1 top-1"><svg
+                            xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
+                            <path fill="none" stroke="#ff1919" stroke-linecap="round" stroke-linejoin="round"
+                                stroke-width="2"
+                                d="M4 7h16m-10 4v6m4-6v6M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3" />
+                        </svg></button>
+                </div>
+                {{/each}}
+                <div onclick="openModal('link', {{this.ID}})"
+                    class="rounded-2xl border border-dashed border-[#656565] p-2.5 flex flex-row items-center shadow-md hover:shadow-xl transition-[shadow,transform] ease-[cubic-bezier(0.16,1,0.3,1)] pointer-cursor select-none cursor-pointer">
+                    <svg class="mr-2" xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24">
+                        <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
+                            stroke-width="2" d="M12 5v14m-7-7h14" />
+                    </svg>
+                    <div>
+                        <h3>Add a link</h3>
+                    </div>
+                </div>
+            </div>
             {{/each}}
-            <div onclick="openLinkModal({{this.ID}})"
+            <div class="flex items-center">
-                class="rounded-2xl border border-dashed border-[#656565] p-2.5 flex flex-row items-center shadow-md hover:shadow-xl transition-[shadow,transform] ease-[cubic-bezier(0.16,1,0.3,1)] pointer-cursor select-none cursor-pointer">
+                <svg class="mr-2" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24">
-                <svg class="mr-2" xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24">
                     <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
                         stroke-width="2" d="M12 5v14m-7-7h14" />
                 </svg>
-                <div>
+                <h2 onclick="openModal('category')" class="text-[#656565] underline decoration-dashed cursor-pointer">
-                    <h3>Add a link</h3>
+                    Add a new category
-                </div>
+                </h2>
             </div>
         </div>
-        {{/each}}
+    </section>
-        <div class="flex items-center">
-            <svg class="mr-2" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24">
-                <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                    d="M12 5v14m-7-7h14" />
-            </svg>
-            <h2 onclick="openCategoryModal()" class="text-[#656565] underline decoration-dashed cursor-pointer">
-                Add a new category
-            </h2>
-        </div>
-    </div>
-</section>
-<div id="linkModal"
-    class="flex modal-bg fixed top-0 left-0 bottom-0 right-0 bg-[#00000070] justify-center items-center">
-    <div class="bg-[#151316] rounded-xl overflow-hidden w-fit p-4 modal">
-        <h3>Add A link</h3>
-        <form id="link-form" action="/api/links" method="post" class="flex flex-col gap-y-3 my-2">
-            <div>
-                <label for="linkName">Name</label>
-                <input
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
-                    type="text" name="name" placeholder="Name" id="linkName" />
-            </div>
-            <div>
-                <label for="linkDesc">Description</label>
-                <input
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
-                    type="text" name="description" placeholder="Description" id="linkDesc" />
-            </div>
-            <div>
-                <label for="linkURL">URL</label>
-                <input
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
-                    type="text" name="url" placeholder="URL" id="linkURL" />
-            </div>
-            <div>
-                <label for="linkIcon">Icon</label>
-                <input class="w-full text-white py-2 px-4 rounded bg-[#1C1C21] border border-[#56565b]/30" type="file"
-                    name="icon" id="linkIcon" accept="image/*" />
-            </div>
-            <button class="px-4 py-2 rounded-md w-full bg-[#8A42FF] text-white border-0" type="submit">Add</button>
-        </form>
-        <span id="link-message"></span>
-    </div>
 </div>
-<div id="categoryModal"
+
+<div id="modal-container"
     class="flex modal-bg fixed top-0 left-0 bottom-0 right-0 bg-[#00000070] justify-center items-center">
     <div class="bg-[#151316] rounded-xl overflow-hidden w-fit p-4 modal">
-        <h3>Create A category</h3>
+        <div id="category-contents" class="hidden">
-        <form id="category-form" action="/api/categories" method="post"
+            <h3>Create A category</h3>
-            class="flex flex-col gap-y-3 my-2 [&>div]:flex [&>div]:flex-col [&>div]:gap-1">
+            <form id="category-form" action="/api/categories" method="post"
-            <div>
+                class="flex flex-col gap-y-3 my-2 [&>div]:flex [&>div]:flex-col [&>div]:gap-1">
-                <label for="categoryName">Name</label>
+                <div>
-                <input
+                    <label for="categoryName">Name</label>
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
+                    <input required type="text" name="name" id="categoryName" />
-                    type="text" name="name" placeholder="Name" id="categoryName" />
+                </div>
-            </div>
+                <div>
-            <div>
+                    <label for="linkIcon">Icon</label>
-                <label for="linkIcon">Icon</label>
+                    <input type="file" name="icon" id="linkIcon" accept=".svg" required />
-                <input class="w-full text-white py-2 px-4 rounded bg-[#1C1C21] border border-[#56565b]/30" type="file"
+                </div>
-                    name="icon" id="linkIcon" accept=".svg" />
+                <button class="px-4 py-2 rounded-md w-full bg-[#8A42FF] text-white border-0" type="submit">Create
-            </div>
+                    category</button>
-            <button class="px-4 py-2 rounded-md w-full bg-[#8A42FF] text-white border-0" type="submit">Create</button>
+            </form>
-        </form>
+            <span id="category-message"></span>
-        <span id="category-message"></span>
+        </div>
+
+        <div id="link-contents" class="hidden">
+            <h3>Add A link</h3>
+            <form id="link-form" action="/api/links" method="post"
+                class="flex flex-col gap-y-3 my-2 [&>div]:flex [&>div]:flex-col [&>div]:gap-1">
+                <div>
+                    <label for="linkName">Name</label>
+                    <input required type="text" name="name" id="linkName" />
+                </div>
+                <div>
+                    <label for="linkDesc">Description (optional)</label>
+                    <input type="text" name="description" id="linkDesc" />
+                </div>
+                <div>
+                    <label for="linkURL">URL</label>
+                    <input required type="url" name="url" id="linkURL" />
+                </div>
+                <div>
+                    <label for="linkIcon">Icon</label>
+                    <input required type="file" name="icon" id="linkIcon" accept="image/*" />
+                </div>
+                <button class="px-4 py-2 rounded-md w-full bg-[#8A42FF] text-white border-0" type="submit">Add
+                    link</button>
+            </form>
+            <span id="link-message"></span>
+        </div>
     </div>
 </div>
 
 <script>
     // idfk what this variable capitalization is, it's a mess
-    let linkModalBg = document.getElementById("linkModal");
+    let modalContainer = document.getElementById("modal-container");
-    let linkModal = linkModalBg.querySelector("div");
+    let modal = modalContainer.querySelector("div");
-    let categoryModalBg = document.getElementById("categoryModal");
+    let pageElement = document.getElementById("blur-target");
-    let categoryModal = categoryModalBg.querySelector("div");
-    let pageElement = document.querySelector("section");
     let targetCategoryID = null;
+    let activeModal = null;
 
-    function openCategoryModal() {
+    function openModal(modalKind, categoryID) {
-        pageElement.style.filter = "blur(20px)";
+        activeModal = modalKind;
-
-        categoryModalBg.classList.add("is-visible");
-        categoryModal.classList.add("is-visible");
-    }
-
-    function closeCategoryModal() {
-        pageElement.style.filter = "";
-
-        categoryModalBg.classList.remove("is-visible");
-        categoryModal.classList.remove("is-visible");
-    }
-
-    function openLinkModal(categoryID) {
         targetCategoryID = categoryID;
 
         pageElement.style.filter = "blur(20px)";
+        document.getElementById(modalKind + "-contents").classList.remove("hidden");
 
-        linkModalBg.classList.add("is-visible");
+        modalContainer.classList.add("is-visible");
-        linkModal.classList.add("is-visible");
+        modal.classList.add("is-visible");
+        document.getElementById(modalKind + "-form").reset();
     }
 
-    function closeLinkModal() {
+    function closeModal() {
         pageElement.style.filter = "";
 
-        linkModalBg.classList.remove("is-visible");
+        modalContainer.classList.remove("is-visible");
-        linkModal.classList.remove("is-visible");
+        modal.classList.remove("is-visible");
+
+        setTimeout(() => {
+            document.getElementById(activeModal + "-contents").classList.add("hidden");
+            activeModal = null;
+        }, 300)
+
+        document.getElementById(activeModal + "-form").querySelectorAll("[required]").forEach((el) => {
+            el.classList.remove("invalid:border-[#861024]!");
+        });
+
+        targetCategoryID = null;
     }
 
-    async function deleteLink(linkID) {
+    modalContainer.addEventListener("click", (event) => {
-        let res = await fetch(`/api/links/${linkID}`, {
+        if (event.target === modalContainer) {
+            closeModal();
+        }
+    });
+
+    async function deleteLink(linkID, categoryID) {
+        let res = await fetch(`/api/category/${categoryID}/link/${linkID}`, {
             method: "DELETE"
         });
 
         if (res.status === 200) {
-            location.reload();
+            let linkEl = document.querySelector(`[key="link-${linkID}"]`);
+            linkEl.remove();
         }
     }
 
     async function deleteCategory(categoryID) {
-        let res = await fetch(`/api/categories/${categoryID}`, {
+        let res = await fetch(`/api/category/${categoryID}`, {
             method: "DELETE"
         });
 
         if (res.status === 200) {
-            location.reload();
+            let categoryEl = document.querySelector(`[key="category-${categoryID}"]`);
+            // get the next element and remove it (its the link grid)
+            let nextEl = categoryEl.nextElementSibling;
+            nextEl.remove();
+            categoryEl.remove();
         }
     }
 
+    document.getElementById("link-form").querySelector("button").addEventListener("click", (event) => {
+        document.getElementById("link-form").querySelectorAll("[required]").forEach((el) => {
+            el.classList.add("invalid:border-[#861024]!");
+        });
+    });
+
     document.getElementById("link-form").addEventListener("submit", async (event) => {
         event.preventDefault();
         let data = new FormData(event.target);
 
-        data.append("category_id", targetCategoryID);
+        let res = await fetch(`/api/category/${targetCategoryID}/link`, {
-
-        let res = await fetch(`/api/links`, {
             method: "POST",
             body: data
         });
 
         if (res.status === 201) {
-            closeLinkModal();
+            closeModal('link');
             document.getElementById("link-form").reset();
             location.reload();
         } else {
@@ -190,17 +215,23 @@
         }
     });
 
+    document.getElementById("category-form").querySelector("button").addEventListener("click", (event) => {
+        document.getElementById("category-form").querySelectorAll("[required]").forEach((el) => {
+            el.classList.add("invalid:border-[#861024]!");
+        });
+    });
+
     document.getElementById("category-form").addEventListener("submit", async (event) => {
         event.preventDefault();
         let data = new FormData(event.target);
 
-        let res = await fetch(`/api/categories`, {
+        let res = await fetch(`/api/category`, {
             method: "POST",
             body: data
         });
 
         if (res.status === 201) {
-            closeCategoryModal()
+            closeModal('category');
             document.getElementById("category-form").reset();
             location.reload();
         } else {
@@ -208,20 +239,6 @@
             document.getElementById("link-message").innerText = json.message;
         }
     });
-
-    linkModalBg.addEventListener("click", (event) => {
-        if (event.target === linkModalBg) {
-            targetCategoryID = null;
-            closeLinkModal();
-        }
-    });
-
-    categoryModalBg.addEventListener("click", (event) => {
-        if (event.target === categoryModalBg) {
-            targetCategoryID = null;
-            closeCategoryModal();
-        }
-    });
 </script>
 
 <style>

templates/views/admin/login.hbs

@@ -6,12 +6,8 @@
                 Login
             </h2>
             <form action="/admin/login" method="post" class="flex flex-col gap-y-3 my-2">
-                <input
+                <input type="text" name="username" placeholder="Username" />
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
+                <input type="password" name="password" placeholder="Password" />
-                    type="text" name="username" placeholder="Username" />
-                <input
-                    class="px-4 py-2 rounded-md w-full bg-[#1C1C21] border border-[#56565b]/30 text-white focus-visible:outline-none"
-                    type="password" name="password" placeholder="Password" />
                 <button class="px-4 py-2 rounded-md w-full bg-[#8A42FF] text-white border-0"
                     type="submit">Login</button>
             </form>

templates/views/index.hbs

@@ -62,7 +62,7 @@
         </div>
         <form class="w-full max-w-3xl" action="{{ SearchProviderURL }}" method="GET">
             <input name="{{ SearchParam }}" aria-label="Search bar"
-                class="w-full bg-[#1C1C21] border border-[#56565b]/30 rounded-full px-3 py-1 text-white h-7 focus-visible:outline-none placeholder:italic placeholder:text-[#434343]"
+                class="w-full bg-[#1C1C21] border border-[#2E2E32] rounded-full px-3 py-1 text-white h-7 focus-visible:outline-none placeholder:italic placeholder:text-[#434343] search"
                 placeholder="Search..." />
         </form>
     </div>
@@ -70,23 +70,24 @@
 <section class="flex justify-center w-full">
     <div class="w-full sm:w-4/5 p-2.5">
         {{#each Categories}}
-        <div class="flex items-center w-fit">
+        <div class="flex items-center mt-2 first:mt-0">
-            <img class="object-contain mr-2 select-none text-white" width="32" height="32" draggable="false" alt="{{this.Name}}"
+            <img class="object-contain mr-2 select-none" width="32" height="32" draggable="false" alt="{{this.Name}}"
                 src="{{this.Icon}}" />
-            <h2 class="capitalize w-fit">{{this.Name}}</h2>
+            <h2 class="capitalize break-all">{{this.Name}}</h2>
         </div>
         <div class="p-2.5 grid grid-cols-[repeat(auto-fill,_minmax(min(330px,_100%),_1fr))] gap-2">
-            {{#each this.Links}}
+            {{#each this.Links}} <a href="{{this.URL}}"
-            <a href="{{this.URL}}"
                 class="underline-none text-unset rounded-2xl bg-[#211F23] p-2.5 flex flex-row items-center shadow-md hover:shadow-xl transition-[shadow,transform,translate] ease-[cubic-bezier(0.16,1,0.3,1)] hover:-translate-y-1"
                 draggable="false" target="_blank" rel="noopener noreferrer">
-                <img class="object-contain mr-2 select-none rounded-md" width="64" height="64" draggable="false"
+                <img class="mr-2 select-none rounded-md aspect-square object-cover" width="64" height="64"
-                    src="{{this.Icon}}" alt="{{this.Name}}" />
+                    draggable="false" src="{{this.Icon}}" alt="{{this.Name}}" />
-                <div>
+                <div class="break-all">
                     <h3>{{this.Name}}</h3>
                     <p class="text-[#D7D7D7]">{{this.Description}}</p>
                 </div>
             </a>
+            {{else}}
+            <p class="text-[#D7D7D7]">No links here, add one!</p>
             {{/each}}
         </div>
         {{/each}}