encode asset name only when writing to s3 and when building the path after reading from the db, but keep it as-is in the db

packages/asset-uploader/src/targets/s3/upload.ts

@@ -68,7 +68,7 @@ const uploadHandler = async ({
     throw new Error(`Asset cannot be bigger than ${maxSize}MB`);
   }
 
-  const uniqueFilename = encodeURIComponent(getUniqueFilename(file.filename));
+  const uniqueFilename = getUniqueFilename(file.filename);
 
   const s3Envs = S3EnvVariables.parse(process.env);
 
@@ -78,7 +78,7 @@ const uploadHandler = async ({
   const params: PutObjectCommandInput = {
     ...ACL,
     Bucket: s3Envs.S3_BUCKET,
-    Key: uniqueFilename,
+    Key: encodeURIComponent(uniqueFilename),
     Body: buffer,
     ContentType: file.contentType,
     Metadata: {

packages/asset-uploader/src/utils/get-asset-path.ts

@@ -14,12 +14,12 @@ export const getAssetPath = (asset: DbAsset) => {
   if (asset.location === Location.REMOTE && s3Envs.success) {
     if (s3Envs.data.ASSET_CDN_URL) {
       const cndUrl = new URL(s3Envs.data.ASSET_CDN_URL);
-      cndUrl.pathname = asset.name;
+      cndUrl.pathname = encodeURIComponent(asset.name);
       return cndUrl.toString();
     }
     const s3Url = new URL(s3Envs.data.S3_ENDPOINT);
     s3Url.hostname = `${s3Envs.data.S3_BUCKET}.${s3Url.hostname}`;
-    s3Url.pathname = asset.name;
+    s3Url.pathname = encodeURIComponent(asset.name);
     return s3Url.toString();
   }