feat: Custom script path for Plausible

src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte

@@ -1,13 +1,32 @@
 <script lang="ts">
+	import { session } from '$app/stores';
+
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
+	import Explainer from '$lib/components/Explainer.svelte';
 	import { t } from '$lib/translations';
 	export let service;
 	export let readOnly;
+	export let isRunning;
 </script>
 
 <div class="flex space-x-1 py-5 font-bold">
 	<div class="title">Plausible Analytics</div>
 </div>
+<div class="grid grid-cols-2 items-center px-10">
+	<label for="scriptName">Script Name</label>
+	<input
+		name="scriptName"
+		id="scriptName"
+		readonly={!$session.isAdmin && !isRunning}
+		disabled={!$session.isAdmin || isRunning}
+		placeholder="plausible.js"
+		bind:value={service.plausibleAnalytics.scriptName}
+		required
+	/>
+	<Explainer
+		text="Useful if you would like to rename the collector script to prevent it blocked by AdBlockers."
+	/>
+</div>
 <div class="grid grid-cols-2 items-center px-10">
 	<label for="email">{$t('forms.email')}</label>
 	<input

src/routes/services/[id]/_Services/_Services.svelte

@@ -188,7 +188,7 @@
 			{/if}
 
 			{#if service.type === 'plausibleanalytics'}
-				<PlausibleAnalytics bind:service {readOnly} />
+				<PlausibleAnalytics bind:service {isRunning} {readOnly} />
 			{:else if service.type === 'minio'}
 				<MinIo {service} />
 			{:else if service.type === 'vscodeserver'}

src/routes/services/[id]/plausibleanalytics/index.json.ts

@@ -12,15 +12,28 @@ export const post: RequestHandler = async (event) => {
 		name,
 		fqdn,
 		exposePort,
-		plausibleAnalytics: { email, username }
+		plausibleAnalytics: { email, username, scriptName }
 	} = await event.request.json();
 
 	if (fqdn) fqdn = fqdn.toLowerCase();
 	if (email) email = email.toLowerCase();
 	if (exposePort) exposePort = Number(exposePort);
-
+	if (scriptName) {
+		scriptName = scriptName.toLowerCase();
+		if (scriptName.startsWith('/')) {
+			scriptName = scriptName.replaceAll(/\//gi, '');
+		}
+	}
 	try {
-		await db.updatePlausibleAnalyticsService({ id, fqdn, name, email, username, exposePort });
+		await db.updatePlausibleAnalyticsService({
+			id,
+			fqdn,
+			name,
+			email,
+			username,
+			exposePort,
+			scriptName
+		});
 		return { status: 201 };
 	} catch (error) {
 		return ErrorHandler(error);