fix(frontend): variable editor now acceps including 3000 chars + show length

frontend/src/lib/components/VariableEditor.svelte

@@ -60,7 +60,7 @@
 
 	const MAX_VARIABLE_LENGTH = 3000
 
-	$: valid = variable.value.length < MAX_VARIABLE_LENGTH
+	$: valid = variable.value.length <= MAX_VARIABLE_LENGTH
 
 	async function createVariable(): Promise<void> {
 		await VariableService.createVariable({
@@ -116,7 +116,8 @@
 	<div slot="content">
 		<div class="text-gray-700 text-2xs mb-6">
 			Variables have a globally unique name represented by their path. When passed to scripts, <pre
-				class="inline text-red-700 bg-gray-50 rounded round-sm">/</pre>
+				class="inline text-red-700 bg-gray-50 rounded round-sm">/</pre
+			>
 			are converted to
 			<pre class="inline text-red-700 bg-gray-50 rounded round-sm">_</pre>
 		</div>
@@ -154,12 +155,12 @@
 					<Password
 						bind:password={variable.value}
 						placeholder={'******** (only fill to update value)'}
-						label={'variable (max 3000 characters)'}
+						label={`Secret value (${variable.value.length}/3000 characters)`}
 					/>
 				</div>
 			{:else}
 				<div>
-					<span>Variable (max 3000 characters)</span>
+					<span>Variable value ({variable.value.length}/3000 characters)</span>
 					<AutosizedTextarea bind:value={variable.value} minRows={5} />
 				</div>
 			{/if}