fix: read-only permission

apps/ui/src/routes/services/[id]/_Menu.svelte

@@ -2,6 +2,7 @@
 	export let service: any;
 	export let template: any;
 	import { page } from '$app/stores';
+	import { appSession } from '$lib/store';
 	import ServiceLinks from './_ServiceLinks.svelte';
 </script>
 
@@ -106,6 +107,7 @@
 			</svg>Service</a
 		>
 	</li>
+	{#if $appSession.isAdmin}
 	<li class="menu-title">
 		<span>Advanced</span>
 	</li>
@@ -132,4 +134,5 @@
 			</svg>Danger Zone</a
 		>
 	</li>
+	{/if}
 </ul>

apps/ui/src/routes/services/[id]/_Secret.svelte

@@ -8,7 +8,7 @@
 	import { del, post } from '$lib/api';
 	import { errorNotification } from '$lib/common';
 	import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
-	import { addToast } from '$lib/store';
+	import { addToast, appSession } from '$lib/store';
 	import { createEventDispatcher } from 'svelte';
 
 	const dispatch = createEventDispatcher();
@@ -77,6 +77,7 @@
 	/>
 </td>
 
+{#if $appSession.isAdmin}
 <td>
 	{#if isNewSecret}
 		<div class="flex items-center justify-center">
@@ -93,3 +94,4 @@
 		</div>
 	{/if}
 </td>
+{/if}

apps/ui/src/routes/services/[id]/index.svelte

@@ -165,6 +165,7 @@
 		}
 	}
 	async function changeSettings(name: any) {
+		if (!$appSession.isAdmin) return
 		try {
 			if (name === 'dualCerts') {
 				dualCerts = !dualCerts;
@@ -277,7 +278,7 @@
 		<div class="grid grid-flow-row gap-2 px-4">
 			<div class="mt-2 grid grid-cols-2 items-center">
 				<label for="name">{$t('forms.name')}</label>
-				<input name="name" id="name" class="w-full" bind:value={service.name} required />
+				<input name="name" id="name" class="w-full" disabled={!$appSession.isAdmin} bind:value={service.name} required />
 			</div>
 			<div class="grid grid-cols-2 items-center">
 				<label for="version">Version / Tag</label>
@@ -386,7 +387,7 @@
 			<div class="grid grid-cols-2 items-center">
 				<Setting
 					id="dualCerts"
-					disabled={$status.service.isRunning}
+					disabled={$status.service.isRunning || !$appSession.isAdmin}
 					dataTooltip={$t('forms.must_be_stopped_to_modify')}
 					bind:setting={dualCerts}
 					title={$t('application.ssl_www_and_non_www')}

apps/ui/src/routes/services/[id]/secrets.svelte

@@ -25,7 +25,7 @@
 	import { get } from '$lib/api';
 	import { t } from '$lib/translations';
 	import pLimit from 'p-limit';
-	import { addToast } from '$lib/store';
+	import { addToast, appSession } from '$lib/store';
 	import { saveSecret } from './utils';
 	const limit = pLimit(1);
 
@@ -83,7 +83,12 @@
 				{#each secrets as secret}
 					{#key secret.id}
 						<tr>
-							<Secret name={secret.name} value={secret.value} readonly={secret.readOnly} on:refresh={refreshSecrets} />
+							<Secret
+								name={secret.name}
+								value={secret.value}
+								readonly={secret.readOnly}
+								on:refresh={refreshSecrets}
+							/>
 						</tr>
 					{/key}
 				{/each}
@@ -93,18 +98,20 @@
 			</tbody>
 		</table>
 	</div>
-	<form on:submit|preventDefault={getValues} class="mb-12 w-full">
-		<div class="flex flex-row border-b border-coolgray-500 mb-6 space-x-2 pt-10">
-			<div class="flex flex-row space-x-2">
-				<div class="title font-bold pb-3 ">Paste <code>.env</code> file</div>
-				<button type="submit" class="btn btn-sm bg-primary">Add Secrets in Batch</button>
+	{#if $appSession.isAdmin}
+		<form on:submit|preventDefault={getValues} class="mb-12 w-full">
+			<div class="flex flex-row border-b border-coolgray-500 mb-6 space-x-2 pt-10">
+				<div class="flex flex-row space-x-2">
+					<div class="title font-bold pb-3 ">Paste <code>.env</code> file</div>
+					<button type="submit" class="btn btn-sm bg-primary">Add Secrets in Batch</button>
+				</div>
 			</div>
-		</div>
 
-		<textarea
-			placeholder={`PORT=1337\nPASSWORD=supersecret`}
-			bind:value={batchSecrets}
-			class="mb-2 min-h-[200px] w-full"
-		/>
-	</form>
+			<textarea
+				placeholder={`PORT=1337\nPASSWORD=supersecret`}
+				bind:value={batchSecrets}
+				class="mb-2 min-h-[200px] w-full"
+			/>
+		</form>
+	{/if}
 </div>

apps/ui/src/routes/services/[id]/storages.svelte

@@ -26,6 +26,7 @@
 	import { get } from '$lib/api';
 	import { t } from '$lib/translations';
 	import Explainer from '$lib/components/Explainer.svelte';
+	import { appSession } from '$lib/store';
 
 	const { id } = $page.params;
 	async function refreshStorage() {
@@ -81,10 +82,11 @@
 				{/key}
 			{/each}
 		{/if}
-
-		<div class="title" class:pt-10={persistentStorages.filter((s) => s.predefined).length > 0}>
-			Add New Volume
-		</div>
-		<Storage on:refresh={refreshStorage} isNew {services} />
+		{#if $appSession.isAdmin}
+			<div class="title" class:pt-10={persistentStorages.filter((s) => s.predefined).length > 0}>
+				Add New Volume
+			</div>
+			<Storage on:refresh={refreshStorage} isNew {services} />
+		{/if}
 	</div>
 </div>