Update S3 connection information

svelte/src/filesystem/edit_window/SharingOptions.svelte

@@ -45,6 +45,16 @@ const toggle_example = () => {
 
 let share_link = $derived(window.location.protocol+"//"+window.location.host+"/d/"+file.id)
 const s3_endpoint = window.location.protocol+"//s3."+window.location.host
+
+// S3 clients know the directory by its UUID, which is what the ID is when it's
+// decoded from base58. Clients like Proxmox Backup Server only accept lowercase
+// bucket names
+const base58 = "123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz"
+let s3_bucket = $derived(
+	[...file.id].reduce((n, c) => n * 58n + BigInt(base58.indexOf(c)), 0n)
+		.toString(16).padStart(32, "0")
+		.replace(/^(.{8})(.{4})(.{4})(.{4})/, "$1-$2-$3-$4-")
+)
 </script>
 
 {#if $user.subscription.file_sharing === false}
@@ -79,15 +89,27 @@ const s3_endpoint = window.location.protocol+"//s3."+window.location.host
 		<legend>S3 access</legend>
 		<p>
 			This directory can be used as a bucket by backup tools and other
-			software which supports Amazon S3. The directory ID is the access key,
-			and the passwords above are the secret keys. Each password's permissions
-			decide what it can do.
+			software which supports Amazon S3. The name of the bucket is also the
+			access key, and the passwords above are the secret keys. Each password's
+			permissions decide what it can do.
 		</p>
 		<table>
 			<tbody>
-				<tr><td>Endpoint</td><td>{s3_endpoint}</td><td><CopyButton text={s3_endpoint}>Copy</CopyButton></td></tr>
-				<tr><td>Bucket and access key</td><td>{file.id}</td><td><CopyButton text={file.id}>Copy</CopyButton></td></tr>
-				<tr><td>Region</td><td>us-east-1 (any region works)</td><td></td></tr>
+				<tr>
+					<td>Endpoint</td>
+					<td>{s3_endpoint}</td>
+					<td><CopyButton text={s3_endpoint}>Copy</CopyButton></td>
+				</tr>
+				<tr>
+					<td>Bucket ID / Access key</td>
+					<td>{s3_bucket}</td>
+					<td><CopyButton text={s3_bucket}>Copy</CopyButton></td>
+				</tr>
+				<tr>
+					<td>Region</td>
+					<td>us-east-1 (any region works)</td>
+					<td></td>
+				</tr>
 			</tbody>
 		</table>
 	</fieldset>