diff --git a/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.html b/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.html
index c61abb7f4..58d556f85 100644
--- a/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.html
+++ b/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.html
@@ -35,7 +35,7 @@
       } @else if (previewUrl()) {
         <div class="s3-widget__file-icon">
           <mat-icon>insert_drive_file</mat-icon>
-          <span class="s3-widget__filename">{{(internalValue() || value()) | slice:-30}}</span>
+          <span class="s3-widget__filename">{{displayFilename()}}</span>
         </div>
       }
     </div>
diff --git a/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.ts b/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.ts
index 40e0a22ad..b1bb53888 100644
--- a/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.ts
+++ b/frontend/src/app/components/ui-components/record-edit-fields/s3/s3.component.ts
@@ -69,6 +69,13 @@ export class S3EditComponent implements OnInit {
 		}
 	});
 
+	readonly displayFilename = computed(() => {
+		const val = this.internalValue() || this.value();
+		if (!val) return '';
+		const name = val.split('/').pop() || val;
+		return name.length > 40 ? '...' + name.slice(-37) : name;
+	});
+
 	readonly isImage = computed(() => {
 		const p = this.params();
 		const val = this.internalValue() || this.value();