Add forgejo build workflow

.forgejo/workflows/build.yaml

@@ -0,0 +1,116 @@
+name: WebUI CI
+
+on: [push]
+
+env:
+  PUBLIC_BASE_URL: ''
+
+jobs:
+  check-changes:
+    runs-on: docker
+    outputs:
+      all_changed_and_modified_files_count: ${{ steps.changed-files.outputs.all_changed_and_modified_files_count }}
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Get changed files count
+        id: changed-files
+        uses: tj-actions/changed-files@v45
+        with:
+          files_ignore: 'doc/**,README.md,Dockerfile,.*'
+          files_ignore_separator: ','
+      - name: Print changed files count
+        run: >
+          echo "Changed files count: ${{ 
+            steps.changed-files.outputs.all_changed_and_modified_files_count }}"
+
+  build:
+    needs: check-changes
+    runs-on: docker
+    container:
+      image: ghcr.io/catthehacker/ubuntu:js-22.04
+    if: ${{ needs.check-changes.outputs.all_changed_and_modified_files_count >= 1 }}
+    permissions:
+      contents: write
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: recursive
+      - uses: actions/setup-node@v3
+        with:
+          node-version: lts/*
+          cache: yarn
+          cache-dependency-path: '**/yarn.lock'
+      - uses: actions/cache@v3
+        with:
+          path: |
+            ~/.cache/pip
+            ~/node_modules
+          key: ${{ runner.os }}-pio
+      - uses: actions/setup-python@v4
+        with:
+          python-version: '>=3.10'
+      - name: Get current date
+        id: dateAndTime
+        run: echo "dateAndTime=$(date +'%Y-%m-%d-%H:%M')" >> $GITHUB_OUTPUT
+      - name: Install mklittlefs
+        run: >
+          git clone https://github.com/earlephilhower/mklittlefs.git /tmp/mklittlefs &&
+          cd /tmp/mklittlefs &&
+          git submodule update --init &&
+          make dist
+      - name: Install yarn
+        run: yarn && yarn postinstall
+      - name: Run linter
+        run: yarn lint
+      - name: Build WebUI
+        run: yarn build
+      - name: Get current block
+        id: getBlockHeight
+        run: echo "blockHeight=$(curl -s https://mempool.space/api/blocks/tip/height)" >> $GITHUB_OUTPUT
+      - name: Write block height to file
+        env:
+          BLOCK_HEIGHT: ${{ steps.getBlockHeight.outputs.blockHeight }}
+        run: mkdir -p output && echo "$BLOCK_HEIGHT" > output/version.txt
+      - name: gzip build for LittleFS
+        run: find dist -type f ! -name ".*" -exec sh -c 'mkdir -p "build_gz/$(dirname "${1#dist/}")" && gzip -k "$1" -c > "build_gz/${1#dist/}".gz' _ {} \;
+      - name: Write git rev to file
+        run: echo "$GITHUB_SHA" > build_gz/fs_hash.txt && echo "$GITHUB_SHA" > output/commit.txt
+      - name: Check GZipped directory size
+        run: |
+          THRESHOLD=409600
+          DIRECTORY_SIZE=$(du -b -s build_gz | awk '{print $1}')
+          if [ "$DIRECTORY_SIZE" -gt "$THRESHOLD" ]; then
+            echo "Directory size exceeds the threshold of $THRESHOLD bytes"
+            exit 1
+          else
+            echo "Directory size is within the threshold"
+          fi
+      - name: Create tarball
+        run: tar czf webui.tgz --strip-components=1 dist
+      - name: Build LittleFS
+        run: |
+          set -e
+          /tmp/mklittlefs/mklittlefs -c build_gz -s 409600 output/littlefs.bin
+      - name: Upload artifacts
+        uses: https://code.forgejo.org/forgejo/upload-artifact@v4
+        with:
+          path: |
+            webui.tgz
+            output/littlefs.bin
+      - name: Create release
+        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+        uses: https://code.forgejo.org/actions/forgejo-release@v2.4.0
+        with:
+          url: 'https://git.btclock.dev/'
+          repo: '${{ github.repository }}'
+          direction: upload
+          tag: ${{ steps.getBlockHeight.outputs.blockHeight }}
+          sha: '${{ github.sha }}'
+          release-dir: output
+          token: ${{ secrets.TOKEN }}
+          override: false
+          verbose: false
+          release-notes-assistant: false

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+	"i18n-ally.localesPaths": ["src/lib/i18n", "src/lib/locales"]
+}

package.json

@@ -41,9 +41,10 @@
 	"type": "module",
 	"dependencies": {
 		"@fontsource/libre-franklin": "^5.0.17",
+		"@sveltestrap/sveltestrap": "^6.2.7",
 		"bootstrap": "^5.3.3",
 		"date-fns": "^3.5.0",
 		"svelte-i18n": "^4.0.0",
-		"sveltestrap": "^5.11.3"
+		"svelte-preprocess": "^6.0.3"
 	}
 }

patches/@sveltejs+kit+2.13.0+001+initial.patch

@@ -1,13 +1,17 @@
 diff --git a/node_modules/@sveltejs/kit/src/exports/vite/index.js b/node_modules/@sveltejs/kit/src/exports/vite/index.js
-index e80fb78..4536af4 100644
+index ad519c9..44d7d66 100644
 --- a/node_modules/@sveltejs/kit/src/exports/vite/index.js
 +++ b/node_modules/@sveltejs/kit/src/exports/vite/index.js
-@@ -637,7 +637,7 @@ async function kit({ svelte_config }) {
+@@ -644,9 +644,9 @@ async function kit({ svelte_config }) {
+ 							input,
+ 							output: {
  								format: 'esm',
- 								entryFileNames: ssr ? '[name].js' : `${prefix}/[name].[hash].${ext}`,
+-								entryFileNames: ssr ? '[name].js' : `${prefix}/[name].[hash].${ext}`,
- 								chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[name].[hash].${ext}`,
+-								chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[name].[hash].${ext}`,
 -								assetFileNames: `${prefix}/assets/[name].[hash][extname]`,
++								entryFileNames: ssr ? '[name].js' : `${prefix}/[hash].${ext}`,
++								chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[hash].${ext}`,
 +								assetFileNames: `${prefix}/assets/[hash][extname]`,
  								hoistTransitiveImports: false,
- 								sourcemapIgnoreList
+ 								sourcemapIgnoreList,
- 							},
+ 								manualChunks:

src/lib/style/app.scss

@@ -1,6 +1,6 @@
-@import '../node_modules/bootstrap/scss/functions';
+@import 'bootstrap/scss/functions';
-@import '../node_modules/bootstrap/scss/variables';
+@import 'bootstrap/scss/variables';
-@import '../node_modules/bootstrap/scss/variables-dark';
+@import 'bootstrap/scss/variables-dark';
 
 @import '@fontsource/libre-franklin';
 
@@ -30,31 +30,31 @@ $input-font-size-sm: $font-size-base * 0.875;
 
 // $border-radius:               .675rem;
 
-@import '../node_modules/bootstrap/scss/mixins';
+@import 'bootstrap/scss/mixins';
-@import '../node_modules/bootstrap/scss/maps';
+@import 'bootstrap/scss/maps';
-@import '../node_modules/bootstrap/scss/utilities';
+@import 'bootstrap/scss/utilities';
 
-@import '../node_modules/bootstrap/scss/root';
+@import 'bootstrap/scss/root';
-@import '../node_modules/bootstrap/scss/reboot';
+@import 'bootstrap/scss/reboot';
-@import '../node_modules/bootstrap/scss/type';
+@import 'bootstrap/scss/type';
-@import '../node_modules/bootstrap/scss/containers';
+@import 'bootstrap/scss/containers';
-@import '../node_modules/bootstrap/scss/grid';
+@import 'bootstrap/scss/grid';
-@import '../node_modules/bootstrap/scss/forms';
+@import 'bootstrap/scss/forms';
-@import '../node_modules/bootstrap/scss/buttons';
+@import 'bootstrap/scss/buttons';
-@import '../node_modules/bootstrap/scss/button-group';
+@import 'bootstrap/scss/button-group';
-@import '../node_modules/bootstrap/scss/pagination';
+@import 'bootstrap/scss/pagination';
 
-@import '../node_modules/bootstrap/scss/dropdown';
+@import 'bootstrap/scss/dropdown';
 
-@import '../node_modules/bootstrap/scss/navbar';
+@import 'bootstrap/scss/navbar';
-@import '../node_modules/bootstrap/scss/nav';
+@import 'bootstrap/scss/nav';
-@import '../node_modules/bootstrap/scss/card';
+@import 'bootstrap/scss/card';
-@import '../node_modules/bootstrap/scss/progress';
+@import 'bootstrap/scss/progress';
-@import '../node_modules/bootstrap/scss/tooltip';
+@import 'bootstrap/scss/tooltip';
-@import '../node_modules/bootstrap/scss/toasts';
+@import 'bootstrap/scss/toasts';
 
-@import '../node_modules/bootstrap/scss/helpers';
+@import 'bootstrap/scss/helpers';
-@import '../node_modules/bootstrap/scss/utilities/api';
+@import 'bootstrap/scss/utilities/api';
 
 @include media-breakpoint-down(xl) {
 	html {

src/routes/+layout.svelte

@@ -10,7 +10,7 @@
 		NavLink,
 		Navbar,
 		NavbarBrand
-	} from 'sveltestrap';
+	} from '@sveltestrap/sveltestrap';
 
 	import { page } from '$app/stores';
 	import { locale, locales, isLoading } from 'svelte-i18n';

src/routes/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { PUBLIC_BASE_URL } from '$lib/config';
 
-	import { Container, Row, Toast, ToastBody } from 'sveltestrap';
+	import { Container, Row, Toast, ToastBody } from '@sveltestrap/sveltestrap';
 	import Settings from './Settings.svelte';
 	import Status from './Status.svelte';
 	import Control from './Control.svelte';

src/routes/Control.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { PUBLIC_BASE_URL } from '$lib/config';
 	import { _ } from 'svelte-i18n';
-	import { Button, Card, CardBody, CardHeader, CardTitle, Col } from 'sveltestrap';
+	import { Button, Card, CardBody, CardHeader, CardTitle, Col } from '@sveltestrap/sveltestrap';
 
 	export let settings = {};
 

src/routes/Settings.svelte

@@ -18,7 +18,7 @@
 		InputGroupText,
 		Label,
 		Row
-	} from 'sveltestrap';
+	} from '@sveltestrap/sveltestrap';
 
 	export let settings;
 

src/routes/Status.svelte

@@ -1,6 +1,14 @@
 <script lang="ts">
 	import { _ } from 'svelte-i18n';
-	import { Card, CardBody, CardHeader, CardTitle, Col, Progress, Tooltip } from 'sveltestrap';
+	import {
+		Card,
+		CardBody,
+		CardHeader,
+		CardTitle,
+		Col,
+		Progress,
+		Tooltip
+	} from '@sveltestrap/sveltestrap';
 	import Rendered from './Rendered.svelte';
 	import { writable } from 'svelte/store';
 

vite.config.ts

@@ -13,6 +13,15 @@ export default defineConfig({
 			}
 		}
 	},
+	css: {
+		preprocessorOptions: {
+			scss: {
+				quietDeps: true,
+				silenceDeprecations: ['import'],
+				api: 'modern'
+			}
+		}
+	},
 	test: {
 		include: ['src/**/*.{test,spec}.{js,ts}']
 	}