Beta

.github/workflows/deploy.yml

@@ -16,7 +16,9 @@ on:
 
 jobs:
   deploy:
-    runs-on: ubuntu-24.04
+    runs-on: ubuntu-latest
+    outputs:
+      is_latest: ${{ steps.latest_tag.outputs.is_latest }}
     env:
       DOCKERHUB_USERNAME: ${{ secrets.DOCKERHUB_USERNAME }}
     steps:
@@ -107,7 +109,7 @@ jobs:
 
   release-binaries:
     if: startsWith(github.ref, 'refs/tags/')
-    runs-on: ubuntu-24.04
+    runs-on: ubuntu-latest
     strategy:
       matrix:
         include:
@@ -143,3 +145,48 @@ jobs:
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: gh release upload "${GITHUB_REF_NAME}" dynacat-${{ matrix.goos }}-${{ matrix.goarch }}.tar.gz --clobber
+
+  notify-discord:
+    needs: [deploy, release-binaries]
+    if: startsWith(github.ref, 'refs/tags/') && needs.deploy.outputs.is_latest == 'true'
+    runs-on: ubuntu-slim
+    permissions: {}
+    steps:
+      - name: Announce the release on Discord
+        env:
+          DISCORD_WEBHOOK_URL: ${{ secrets.DISCORD_WEBHOOK_URL }}
+          TAG: ${{ github.ref_name }}
+        run: |
+          if [ -z "${DISCORD_WEBHOOK_URL}" ]; then
+            echo "DISCORD_WEBHOOK_URL is not set, skipping the announcement"
+            exit 0
+          fi
+
+          payload="$(jq -n \
+            --arg version "${TAG#v}" \
+            --arg timestamp "$(TZ=Europe/Warsaw date +%Y-%m-%dT%H:%M:%S.%3N%:z)" \
+            '{
+              username: "Github Update",
+              avatar_url: "https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/github-light.svg",
+              embeds: [{
+                title: "New Dynacat Release - \($version)",
+                url: "https://github.com/Panonim/dynacat/releases/latest",
+                color: 5793266,
+                timestamp: $timestamp,
+                footer: { text: "Europe/Warsaw" }
+              }]
+            }')"
+
+          status="$(printf 'url = "%s"\n' "${DISCORD_WEBHOOK_URL}" | curl --config - \
+            --silent --show-error --output response.txt --write-out '%{http_code}' \
+            --request POST \
+            --header 'Content-Type: application/json' \
+            --data "${payload}")"
+
+          if [ "${status}" -lt 200 ] || [ "${status}" -ge 300 ]; then
+            echo "Discord webhook failed with HTTP ${status}"
+            cat response.txt
+            exit 1
+          fi
+
+          echo "Announced ${TAG#v} on Discord (HTTP ${status})"

Dockerfile

@@ -1,4 +1,4 @@
-FROM golang:1.25.0-alpine3.21 AS builder
+FROM golang:1.26-alpine AS builder
 
 WORKDIR /app
 

README.md

@@ -3,7 +3,7 @@
 <p align="center">
   <a href="https://dynacat.artur.zone/configuration">Configuration</a> •
   <a href="https://discord.gg/mUqTzrfjFP">Discord</a> •
-  <a href="https://www.paypal.com/paypalme/imartur">Sponsor</a> 
+  <a href="https://ko-fi.com/panonim">Sponsor</a> 
 </p>
 <p align="center">
   <a href="https://github.com/Panonim/dynawidgets">Dynawidgets repo</a> •
@@ -55,8 +55,49 @@ Easily create your own theme by tweaking a few numbers or choose from one of the
 
 <br>
 
+## Installation
+There are currently two ways in which you can use Dynacat, the UI editorand editing yaml files manually.
+If you'd like to use the UI here's the recommended configuration. 
+
+The quickest start is to grab the ready-made directory structure:
+
+```bash
+mkdir dynacat && cd dynacat && \
+curl -sL https://github.com/Panonim/dynacat-compose-template/releases/latest/download/dynacat.tar.gz | tar -xzf - && \
+docker compose up -d
+```
+
+<details>
+<summary><strong>Docker compose file</strong></summary>
+<br>
+
+```yaml
+services:
+  dynacat:
+    container_name: dynacat
+    image: panonim/dynacat
+    restart: unless-stopped
+    volumes:
+      - ./config:/app/config
+      - ./assets:/app/assets
+      - /etc/localtime:/etc/localtime:ro
+      # Optionally, also mount docker socket if you want to use the docker containers widget
+      # - /var/run/docker.sock:/var/run/docker.sock:ro
+    ports:
+      - 8080:8080
+    env_file: .env
+```
+</details>
+
+If you'd like a more detailed instructions they can be found in [the docs](https://dynacat.artur.zone/#installation).
+
 ## Configuration
-Configuration is done through YAML files, to learn more about how the layout works, how to add more pages and how to configure widgets, visit the [configuration documentation](https://dynacat.artur.zone/configuration#configuring-dynacat).
+There are two ways to configure Dynacat, and they work on the same files:
+
+* **UI editor** - drag widgets into columns, change their options and pick your colors from the dashboard itself. Dynacat writes the result back into your YAML. See the [UI editor documentation](https://dynacat.artur.zone/ui-editor).
+* **YAML by hand** - edit the config files directly. To learn more about how the layout works, how to add more pages and how to configure widgets, visit the [configuration documentation](https://dynacat.artur.zone/configuration#configuring-dynacat).
+
+The editor is an addition to the config file, not a replacement, so hand written config keeps working exactly as before.
 
 <details>
 <summary><strong>Preview example configuration file</strong></summary>
@@ -194,13 +235,14 @@ You can list multiple origins. Each entry must be a full origin including the sc
 
 <div style='text-align: center;'>
 
-**If you like this project, please consider [sponsoring](https://www.paypal.com/paypalme/imartur).**
+**If you like this project, please consider [sponsoring](https://ko-fi.com/panonim).**
 
-<a href="https://www.star-history.com/?repos=panonim%2Fdynacat&type=date&legend=bottom-right">
- <picture>
-   <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/image?repos=panonim/dynacat&type=date&theme=dark&legend=bottom-right" />
-   <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/image?repos=panonim/dynacat&type=date&legend=bottom-right" />
-   <img alt="Star History Chart" src="https://api.star-history.com/image?repos=panonim/dynacat&type=date&legend=bottom-right" />
- </picture>
-</a>
+<div style="display: flex; justify-content: center;">
+  <a href="https://www.star-history.com/?repos=panonim%2Fdynacat&type=date&legend=top-left">
+   <picture>
+     <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/chart?repos=panonim/dynacat&type=date&theme=dark&legend=top-left" />
+     <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/chart?repos=panonim/dynacat&type=date&legend=top-left" />
+     <img alt="Star History Chart" src="https://api.star-history.com/chart?repos=panonim/dynacat&type=date&legend=top-left" />
+   </picture>
+  </a>
 </div>

docs/assets/app.js

@@ -1648,7 +1648,9 @@ async function renderHome() {
     { page: 'themes', title: 'Themes', desc: 'Browse dark and light theme options', icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>` },
     { page: 'preconfigured-pages', title: 'Preconfigured Pages', desc: 'Ready-to-use page layouts', icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="16" rx="2"/><path d="M3 10h18"/><path d="M8 10v10"/></svg>` },
     { page: 'custom-api', title: 'Custom API', desc: 'Build widgets from any HTTP JSON API', icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M8 6L3 12l5 6"/><path d="M16 6l5 6-5 6"/><path d="M13 4l-2 16"/></svg>` },
-    { page: 'extensions', title: 'Extensions', desc: 'Extend Dynacat with custom HTML and scripts', icon: `<svg fill="currentColor" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M16 32.005c-0.634 0-1.231-0.246-1.68-0.693l-13.641-13.64c-0.923-0.927-0.923-2.436-0.002-3.361l4.997-4.996c0.308-0.309 0.782-0.382 1.17-0.179 0.386 0.202 0.598 0.632 0.522 1.062-0.051 0.286-0.074 0.515-0.074 0.723 0 2.188 1.78 4.005 3.969 4.005 2.191 0 3.79-1.817 3.79-4.005 0-2.191-1.599-3.971-3.79-3.971-0.205 0-0.433 0.024-0.719 0.074-0.434 0.080-0.86-0.135-1.062-0.521-0.202-0.388-0.129-0.862 0.179-1.17l4.659-4.66c0.902-0.898 2.463-0.896 3.361-0.002l3.411 3.413c0.712-2.213 2.79-3.82 5.235-3.82 3.032 0 5.499 2.468 5.499 5.501 0 2.446-1.605 4.523-3.82 5.234l3.314 3.312c0.925 0.928 0.925 2.436 0.001 3.363l-13.639 13.64c-0.451 0.45-1.047 0.696-1.681 0.696zM5.465 12.351l-3.372 3.371c-0.145 0.146-0.145 0.389 0.002 0.537l13.636 13.637c0.191 0.189 0.342 0.192 0.537-0.002l13.636-13.637c0.146-0.148 0.146-0.387-0.001-0.536l-4.809-4.806c-0.301-0.301-0.379-0.76-0.194-1.143s0.589-0.61 1.016-0.557l0.152 0.020c0.084 0.011 0.168 0.025 0.256 0.025 1.93 0 3.499-1.569 3.499-3.497 0-1.931-1.57-3.501-3.499-3.501s-3.498 1.571-3.498 3.501c0 0.080 0.012 0.158 0.023 0.236l0.021 0.178c0.045 0.422-0.18 0.826-0.563 1.009-0.38 0.181-0.838 0.104-1.137-0.196l-4.904-4.907c-0.192-0.19-0.342-0.192-0.537 0.002l-3.035 3.035c2.603 0.644 4.356 2.999 4.356 5.798 0 3.291-2.498 6.004-5.79 6.004-2.798-0-5.152-1.972-5.795-4.572z"></path></svg>` }
+    { page: 'widget-editor', title: 'Widget Editor', desc: 'Build custom-api widgets visually, no template needed', icon: `<svg viewBox="0 0 24 24" fill="currentColor"><path d="M21 13.1C20.9 13.1 20.7 13.2 20.6 13.3L19.6 14.3L21.7 16.4L22.7 15.4C22.9 15.2 22.9 14.8 22.7 14.6L21.4 13.3C21.3 13.2 21.2 13.1 21 13.1M19.1 14.9L13 20.9V23H15.1L21.2 16.9L19.1 14.9M21 3H13V9H21V3M19 7H15V5H19V7M13 18.06V11H21V11.1C20.24 11.1 19.57 11.5 19.19 11.89L18.07 13H15V16.07L13 18.06M11 3H3V13H11V3M9 11H5V5H9V11M11 20.06V15H3V21H11V20.06M9 19H5V17H9V19Z"/></svg>` },
+    { page: 'authentication', title: 'Authentication', desc: 'Secure your dashboard with password or OIDC login', icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>` },
+    { page: 'ui-editor', title: 'UI Editor', desc: 'Drag, drop and theme the dashboard from the page itself', icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg>` }
   ];
 
   const featureCards = features.map((f) => `
@@ -1764,7 +1766,13 @@ async function renderHome() {
             <div class="home-community-icon home-community-icon--paypal">
               <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="20" height="20"><path d="M 7.0605469 3 L 6.890625 3.7871094 C 5.7016624 9.2479375 3.6254717 18.772869 3.1191406 21.123047 L 2.859375 22.332031 L 9.0507812 22.332031 L 8.3027344 25.789062 L 8.0410156 27 L 14.269531 27 L 15.611328 20.818359 L 15.615234 20.791016 C 15.636144 20.657946 15.818727 20.3125 16.251953 20.3125 L 19.037109 20.3125 C 22.964605 20.3125 26.033464 17.949799 26.826172 14.244141 C 27.206892 12.461829 26.958544 10.794863 25.96875 9.5625 L 25.966797 9.5605469 C 25.181609 8.5834265 24.021371 7.9626769 22.751953 7.7460938 L 22.746094 7.7460938 L 22.740234 7.7441406 C 22.740234 7.7441406 22.096706 7.7226549 21.791016 7.7011719 L 21.791016 7.6796875 L 21.789062 7.6621094 C 21.696016 6.1144528 20.953798 4.8776 19.953125 4.109375 C 18.952452 3.34115 17.731428 3 16.566406 3 L 7.0605469 3 z M 8.671875 5 L 16.566406 5 C 17.328384 5 18.143298 5.2415375 18.734375 5.6953125 C 19.300581 6.1299939 19.687687 6.7308496 19.773438 7.6679688 L 12.773438 7.6679688 C 12.457437 7.6679688 12.205719 7.8836875 12.136719 8.1796875 L 12.134766 8.1796875 L 11.072266 13.033203 L 11.0625 13.03125 L 9.4824219 20.332031 L 5.3378906 20.332031 C 5.9673617 17.422949 7.5530735 10.1381 8.671875 5 z M 21.613281 9.6757812 C 22.121649 9.694727 22.420091 9.7203931 22.421875 9.7207031 C 23.258178 9.8651652 23.974812 10.27449 24.408203 10.814453 C 24.969043 11.511889 25.16621 12.435467 24.869141 13.826172 L 24.871094 13.826172 C 24.24976 16.730513 22.225613 18.3125 19.037109 18.3125 L 16.251953 18.3125 C 14.825179 18.3125 13.815761 19.353539 13.638672 20.480469 L 12.65625 25 L 10.519531 25 L 10.675781 24.277344 L 11.529297 20.332031 L 12.539062 15.662109 L 13.826172 15.662109 C 17.611668 15.662109 20.730896 13.612438 21.613281 9.6757812 z" fill="currentColor"/></svg>
             </div>
-            <span class="home-community-label">Sponsor</span>
+            <span class="home-community-label">Paypal</span>
+          </a>
+          <a class="home-community-card home-community-card--kofi" href="https://ko-fi.com/panonim" target="_blank" rel="noopener">
+            <div class="home-community-icon home-community-icon--kofi">
+              <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32" fill="currentColor"><path d="M31.844 11.932c-1.032-5.448-6.48-6.125-6.48-6.125h-24.4c-0.808 0-0.907 1.063-0.907 1.063s-0.109 9.767-0.027 15.767c0.22 3.228 3.448 3.561 3.448 3.561s11.021-0.031 15.953-0.067c3.251-0.568 3.579-3.423 3.541-4.98 5.808 0.323 9.896-3.776 8.871-9.219zM17.093 16.615c-1.661 1.932-5.348 5.297-5.348 5.297s-0.161 0.161-0.417 0.031c-0.099-0.073-0.14-0.12-0.14-0.12-0.595-0.588-4.491-4.063-5.381-5.271-0.943-1.287-1.385-3.599-0.119-4.948 1.265-1.344 4.005-1.448 5.817 0.541 0 0 2.083-2.375 4.625-1.281 2.536 1.095 2.443 4.016 0.963 5.751zM25.323 17.251c-1.24 0.156-2.244 0.036-2.244 0.036v-7.573h2.359c0 0 2.631 0.735 2.631 3.516 0 2.552-1.313 3.557-2.745 4.021z"/></svg>
+            </div>
+            <span class="home-community-label">Ko-fi</span>
           </a>
         </div>
       </section>

docs/assets/style.css

@@ -1247,10 +1247,12 @@ body {
 .home-community-icon--discord { color: #7289DA; }
 .home-community-icon--issues  { color: #FBBF24; }
 .home-community-icon--paypal  { color: #0070BA; }
+.home-community-icon--kofi    { color: #D9605C; }
 
 .home-community-card--discord { background: rgba(88, 101, 242, 0.12); }
 .home-community-card--issues  { background: rgba(245, 158, 11, 0.1); }
 .home-community-card--paypal  { background: rgba(0, 112, 186, 0.12); }
+.home-community-card--kofi    { background: rgba(217, 96, 92, 0.1); }
 
 .home-community-label {
   display: inline-block;