chore: update minor dependencies

.env.example

@@ -1,6 +1,5 @@
-NODE_ENV=development
 HOST=0.0.0.0
 ORIGIN=https://dl.emersa.it
 YTDLP_PATH=./yt-dlp
 PUBLIC_VERSION=0.6.3
-HTTPS_PROXY=
+HTTPS_PROXY=

.forgejo/workflows/ci.yaml

@@ -1,4 +1,4 @@
-name: Bump deps (only minor versions)
+name: Just some continuos integration
 
 on: [push]
 
@@ -15,7 +15,16 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: '20'
-      - name: Prepare, Check, Lint and Format
+      - name: Format things if needed
         run: |
-          npm i
+          npm install
           npm run prepare
+          npm run lint
+          npm run format
+          git config --global user.name "forgejo-bot"
+          git config --global user.email "bot@pweapon.org"
+          git add --all || exit 0
+          git commit -m "chore: lint and format" || exit 0
+          git push origin HEAD:${GITHUB_REF#refs/heads/}
+        env:
+          GITHUB_TOKEN: ${{ secrets.FORGEJO_TOKEN }}

package-lock.json

@@ -1,17 +1,17 @@
 {
 	"name": "dl.emersa.it",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "dl.emersa.it",
-			"version": "1.0.1",
+			"version": "1.0.2",
 			"dependencies": {
 				"@tailwindcss/forms": "^0.5.10",
 				"@tailwindcss/postcss": "^4.1.4",
 				"@tailwindcss/typography": "^0.5.16",
-				"@types/node": "^22.14.1",
+				"@types/node": "^22.15.2",
 				"winston": "^3.17.0",
 				"youtube-dl-exec": "^3.0.20"
 			},
@@ -26,17 +26,17 @@
 				"eslint-config-prettier": "^10.1.2",
 				"eslint-plugin-svelte": "^3.5.1",
 				"globals": "^16.0.0",
-				"mdsvex": "^0.12.4",
+				"mdsvex": "^0.12.5",
 				"prettier": "^3.5.3",
 				"prettier-plugin-svelte": "^3.3.3",
 				"prettier-plugin-tailwindcss": "^0.6.11",
-				"svelte": "^5.28.1",
+				"svelte": "^5.28.2",
 				"svelte-check": "^4.1.6",
 				"sveltekit-sse": "^0.13.19",
 				"tailwindcss": "^4.1.4",
 				"typescript": "^5.8.3",
 				"typescript-eslint": "^8.31.0",
-				"vite": "^6.3.2"
+				"vite": "^6.3.3"
 			}
 		},
 		"node_modules/@alloc/quick-lru": {
@@ -1639,9 +1639,9 @@
 			}
 		},
 		"node_modules/@types/node": {
-			"version": "22.14.1",
-			"resolved": "https://registry.npmjs.org/@types/node/-/node-22.14.1.tgz",
-			"integrity": "sha512-u0HuPQwe/dHrItgHHpmw3N2fYCR6x4ivMNbPHRkBVP4CvN+kiRrKHWk3i8tXiO/joPwXLMYvF9TTF0eqgHIuOw==",
+			"version": "22.15.2",
+			"resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.2.tgz",
+			"integrity": "sha512-uKXqKN9beGoMdBfcaTY1ecwz6ctxuJAcUlwE55938g0ZJ8lRxwAZqRz2AJ4pzpt5dHdTPMB863UZ0ESiFUcP7A==",
 			"license": "MIT",
 			"dependencies": {
 				"undici-types": "~6.21.0"
@@ -2718,10 +2718,11 @@
 			}
 		},
 		"node_modules/fdir": {
-			"version": "6.4.3",
-			"resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.3.tgz",
-			"integrity": "sha512-PMXmW2y1hDDfTSRc9gaXIuCCRpuoz3Kaz8cUelp3smouvfT632ozg2vrT6lJsHKKOF59YLbOGfAWGUcKEfRMQw==",
+			"version": "6.4.4",
+			"resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
+			"integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
 			"dev": true,
+			"license": "MIT",
 			"peerDependencies": {
 				"picomatch": "^3 || ^4"
 			},
@@ -3461,9 +3462,9 @@
 			}
 		},
 		"node_modules/mdsvex": {
-			"version": "0.12.4",
-			"resolved": "https://registry.npmjs.org/mdsvex/-/mdsvex-0.12.4.tgz",
-			"integrity": "sha512-m7m2VN7gKl9OAwRbUju6EDH1zzQf9tU5jFFEAEW13am2GuGstNYyYEY35J0vmCSviC5xgwsnQGYoCg+lYMxKRQ==",
+			"version": "0.12.5",
+			"resolved": "https://registry.npmjs.org/mdsvex/-/mdsvex-0.12.5.tgz",
+			"integrity": "sha512-JQy8CBbGF1IvpxZTmGJigRiD1s2BKfLKS9xCLPKngjHToY8WMYLZ8WFGRpuR6x4C4bxipSuLm2LctwL2fVXaEQ==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -4431,9 +4432,9 @@
 			}
 		},
 		"node_modules/svelte": {
-			"version": "5.28.1",
-			"resolved": "https://registry.npmjs.org/svelte/-/svelte-5.28.1.tgz",
-			"integrity": "sha512-iOa9WmfNG95lSOSJdMhdjJ4Afok7IRAQYXpbnxhd5EINnXseG0GVa9j6WPght4eX78XfFez45Fi+uRglGKPV/Q==",
+			"version": "5.28.2",
+			"resolved": "https://registry.npmjs.org/svelte/-/svelte-5.28.2.tgz",
+			"integrity": "sha512-FbWBxgWOpQfhKvoGJv/TFwzqb4EhJbwCD17dB0tEpQiw1XyUEKZJtgm4nA4xq3LLsMo7hu5UY/BOFmroAxKTMg==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
@@ -4591,13 +4592,13 @@
 			}
 		},
 		"node_modules/tinyglobby": {
-			"version": "0.2.12",
-			"resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.12.tgz",
-			"integrity": "sha512-qkf4trmKSIiMTs/E63cxH+ojC2unam7rJ0WrauAzpT3ECNTxGRMlaXxVbfxMUC/w0LaYk6jQ4y/nGR9uBO3tww==",
+			"version": "0.2.13",
+			"resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz",
+			"integrity": "sha512-mEwzpUgrLySlveBwEVDMKk5B57bhLPYovRfPAXD5gA/98Opn0rCDj3GtLwFvCvH5RK9uPCExUROW5NjDwvqkxw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
-				"fdir": "^6.4.3",
+				"fdir": "^6.4.4",
 				"picomatch": "^4.0.2"
 			},
 			"engines": {
@@ -4804,18 +4805,18 @@
 			}
 		},
 		"node_modules/vite": {
-			"version": "6.3.2",
-			"resolved": "https://registry.npmjs.org/vite/-/vite-6.3.2.tgz",
-			"integrity": "sha512-ZSvGOXKGceizRQIZSz7TGJ0pS3QLlVY/9hwxVh17W3re67je1RKYzFHivZ/t0tubU78Vkyb9WnHPENSBCzbckg==",
+			"version": "6.3.3",
+			"resolved": "https://registry.npmjs.org/vite/-/vite-6.3.3.tgz",
+			"integrity": "sha512-5nXH+QsELbFKhsEfWLkHrvgRpTdGJzqOZ+utSdmPTvwHmvU6ITTm3xx+mRusihkcI8GeC7lCDyn3kDtiki9scw==",
 			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"esbuild": "^0.25.0",
-				"fdir": "^6.4.3",
+				"fdir": "^6.4.4",
 				"picomatch": "^4.0.2",
 				"postcss": "^8.5.3",
 				"rollup": "^4.34.9",
-				"tinyglobby": "^0.2.12"
+				"tinyglobby": "^0.2.13"
 			},
 			"bin": {
 				"vite": "bin/vite.js"

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "dl.emersa.it",
 	"private": true,
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",
@@ -25,23 +25,23 @@
 		"eslint-config-prettier": "^10.1.2",
 		"eslint-plugin-svelte": "^3.5.1",
 		"globals": "^16.0.0",
-		"mdsvex": "^0.12.4",
+		"mdsvex": "^0.12.5",
 		"prettier": "^3.5.3",
 		"prettier-plugin-svelte": "^3.3.3",
 		"prettier-plugin-tailwindcss": "^0.6.11",
-		"svelte": "^5.28.1",
+		"svelte": "^5.28.2",
 		"svelte-check": "^4.1.6",
 		"sveltekit-sse": "^0.13.19",
 		"tailwindcss": "^4.1.4",
 		"typescript": "^5.8.3",
 		"typescript-eslint": "^8.31.0",
-		"vite": "^6.3.2"
+		"vite": "^6.3.3"
 	},
 	"dependencies": {
 		"@tailwindcss/forms": "^0.5.10",
 		"@tailwindcss/postcss": "^4.1.4",
 		"@tailwindcss/typography": "^0.5.16",
-		"@types/node": "^22.14.1",
+		"@types/node": "^22.15.2",
 		"winston": "^3.17.0",
 		"youtube-dl-exec": "^3.0.20"
 	}

scripts/release.sh

@@ -14,4 +14,5 @@ __dir="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
 version="${1:?Error: No argument provided. Usage: $0 <version>}" 
 
 npm version "v${version}"
-git push --tags
+git push --tags
+git push

src/lib/components/Loader.svelte

@@ -1,28 +0,0 @@
-<div class="w-[150px]">
-	<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"
-		><linearGradient id="a3"
-			><stop offset="0" stop-color="#FF156D" stop-opacity="0"></stop><stop
-				offset="1"
-				stop-color="#FF156D"
-			></stop></linearGradient
-		><circle
-			fill="none"
-			stroke="url(#a3)"
-			stroke-width="15"
-			stroke-linecap="round"
-			stroke-dasharray="0 44 0 44 0 44 0 44 0 360"
-			cx="100"
-			cy="100"
-			r="70"
-			transform-origin="center"
-			><animateTransform
-				type="rotate"
-				attributeName="transform"
-				calcMode="discrete"
-				dur="2"
-				values="360;324;288;252;216;180;144;108;72;36"
-				repeatCount="indefinite"
-			></animateTransform></circle
-		></svg
-	>
-</div>

src/lib/components/ProgressBar.svelte

@@ -15,7 +15,7 @@
 			<div
 				class="h-full bg-gradient-to-r from-green-400 to-green-600 transition-all duration-300"
 				style="width: {progress}%"
-			/>
+			></div>
 		</div>
 		<p class="mt-2 text-center text-pink-400">{progress}%</p>
 	</div>

src/lib/server/ytdlp.ts

@@ -1,7 +1,6 @@
-import { create } from 'youtube-dl-exec';
+import { create, type Flags } from 'youtube-dl-exec';
 import { env } from '$env/dynamic/private';
 import { spawn } from 'node:child_process';
-import supportedFormats from '$lib/common/supportedFormats.json';
 import { logger, mimeTypeMap } from '$lib/server/helpers';
 
 const YTDLP_PATH: string = env.YTDLP_PATH as string;
@@ -13,7 +12,7 @@ export const ytdl = create(YTDLP_PATH);
  * Fetch YouTube metadata (title, uploader/artist)
  */
 export async function getYouTubeMetadata(link: string) {
-	const options = {
+	const options: Flags = {
 		dumpSingleJson: true,
 		noCheckCertificates: true,
 		noWarnings: true,
@@ -66,10 +65,11 @@ export function streamYouTube(link: string, format: string): ReadableStream<Uint
 			process.stdout.on('data', (chunk) => {
 				try {
 					controller.enqueue(chunk);
-				} catch (ex) {
+				} catch {
 					process.kill();
 				}
 			});
+
 			process.stderr.on('data', (chunk) => logger.debug(chunk.toString()));
 			process.stdout.on('end', () => {
 				try {

src/routes/+page.svelte

@@ -1,9 +1,7 @@
 <script lang="ts">
 	import { PUBLIC_VERSION } from '$env/static/public';
 	import supportedFormats from '$lib/common/supportedFormats.json';
-	import Loader from '$lib/components/Loader.svelte';
-	import DownloadManager from '$lib/components/DownloadManager.svelte';
-	import { mount, unmount } from 'svelte';
+	import DownloadManager from '$lib/components/ProgressBar.svelte';
 
 	let source = $state('youtube');
 	let link = $state('');
@@ -12,9 +10,6 @@
 	let showModal = $state(false);
 	let href = $state('');
 	let disabled = $state(true);
-	let metadata = $state(false);
-	let logs = $state('');
-	let downloadManager: DownloadManager | null = null;
 	let progress = $state(0);
 	let filename = $state('');
 
@@ -39,18 +34,18 @@
 
 		const contentDisposition: string | null = response?.headers?.get('content-disposition');
 		filename = contentDisposition?.split('filename=')[1] || 'noname';
-		const contentLength: number = Number(response?.headers?.get('content-length'));
+		// const contentLength: number = Number(response?.headers?.get('content-length'));
 		const reader = response?.body?.getReader();
 		const chunks: Uint8Array[] = [];
 		let receivedLength = 0;
 
 		while (true) {
-			const { done, value }: ReadableStreamReadResult<Uint8Array> = await reader!.read();
+			const { done, value } = await reader!.read();
 			if (done) break;
 			if (value) {
 				chunks.push(value);
 				receivedLength += value.length;
-				progress = Math.round((receivedLength / contentLength) * 100);
+				progress = Math.round((receivedLength / 50000) * 100);
 			}
 		}
 
@@ -72,6 +67,8 @@
 		downloading = false;
 
 		link = '';
+		progress = 0;
+		filename = '';
 	};
 
 	const createAnchor = () => {
@@ -83,8 +80,9 @@
 		try {
 			new URL(link);
 			disabled = false;
-		} catch (err) {
+		} catch {
 			/*
+
 			if (err.code === 'ERR_INVALID_URL') {
 
 			}
@@ -98,8 +96,6 @@
 		searchParams.append('link', link);
 		searchParams.append('format', format);
 
-		if (metadata) searchParams.append('metadata', '1');
-
 		href = `/download?${searchParams.toString()}`;
 	};
 
@@ -118,15 +114,6 @@
 	id="wrapper"
 	class="relative mx-auto max-w-full rounded-2xl bg-black p-4 text-green-400 shadow-xl sm:max-w-sm md:max-w-md lg:max-w-lg"
 >
-	<!-- Loader Overlay -->
-	<div
-		id="loader"
-		class="absolute inset-0 z-10 hidden items-center justify-center bg-black/80 backdrop-blur-sm"
-	>
-		<Loader />
-		{@html logs}
-	</div>
-
 	<!-- Info Button -->
 	<button
 		onclick={toggleModal}
@@ -157,7 +144,7 @@
 					bind:value={source}
 					class="w-full rounded-md border border-green-400 bg-[#000f00] px-3 py-2 text-green-300 focus:border-pink-400 focus:outline-none"
 				>
-					{#each sources as source}
+					{#each sources as source (source.label)}
 						<option value={source.value}>{source.label}</option>
 					{/each}
 				</select>
@@ -171,7 +158,7 @@
 					bind:value={format}
 					class="w-full rounded-md border border-green-400 bg-[#000f00] px-3 py-2 text-green-300 focus:border-pink-400 focus:outline-none"
 				>
-					{#each formats as format}
+					{#each formats as format (format.label)}
 						<option value={format.value}>{format.label}</option>
 					{/each}
 				</select>
@@ -192,20 +179,6 @@
 			/>
 		</div>
 
-		<!-- Metadata Checkbox -->
-		<div class="flex items-center gap-2">
-			<input
-				type="checkbox"
-				id="metadata"
-				name="metadata"
-				bind:checked={metadata}
-				class="h-4 w-4 border border-green-400 bg-[#000f00] text-green-500 focus:ring-pink-400"
-			/>
-			<label for="metadata" class="text-cyan-300"
-				>Set filename (<span class="text-red-500">slow</span>)</label
-			>
-		</div>
-
 		<!-- Download Button -->
 		<a
 			id="btn-download"

src/routes/download/+server.ts

@@ -1,6 +1,6 @@
 import { error } from '@sveltejs/kit';
 import type { RequestHandler } from './$types';
-import { getYouTubeMetadata, streamYouTube, ytdl } from '$lib/server/ytdlp';
+import { getYouTubeMetadata, streamYouTube } from '$lib/server/ytdlp';
 import { isURLValid, logger, mimeTypeMap } from '$lib/server/helpers';
 
 const validateRequest = (url: URL) => {
@@ -8,7 +8,6 @@ const validateRequest = (url: URL) => {
 	const link = url.searchParams.get('link');
 	const format = url.searchParams.get('format'); // mp3, mp4
 	const source = url.searchParams.get('source'); // youtube or spotify
-	const metadata = url.searchParams.has('metadata');
 
 	// Validate input
 	if (!link || !format || !source) {
@@ -32,14 +31,12 @@ const validateRequest = (url: URL) => {
 	return {
 		link,
 		format,
-		source,
-		metadata
+		source
 	};
 };
 export const GET: RequestHandler = async ({ url }) => {
-	const { format, source, metadata, link } = validateRequest(url);
+	const { format, link } = validateRequest(url);
 	let filename = '';
-	let contentLength = 0;
 
 	logger.debug(`Requested: ${link}`);
 
@@ -47,8 +44,7 @@ export const GET: RequestHandler = async ({ url }) => {
 		logger.debug(`Fetching video data to set filename`);
 		// Fetch metadata for filename
 		const ytMetadata = await getYouTubeMetadata(link);
-		const { title, uploader, filesize_approx } = ytMetadata;
-		contentLength = filesize_approx;
+		const { title, uploader } = ytMetadata;
 		const safeTitle = `${uploader} - ${title}`;
 		filename = `${safeTitle}.${format}`;
 	} catch (err) {
@@ -62,7 +58,6 @@ export const GET: RequestHandler = async ({ url }) => {
 		return new Response(streamYouTube(link, format), {
 			headers: {
 				'Content-Type': `${mimeTypeMap.get(format)}`,
-				'Content-Length': contentLength,
 				'Content-Disposition': `attachment; filename="${filename}"`
 			}
 		});