diff --git a/app/src/interfaces/files/files.vue b/app/src/interfaces/files/files.vue
index 0e2bc8ed32..47089ef0e2 100644
--- a/app/src/interfaces/files/files.vue
+++ b/app/src/interfaces/files/files.vue
@@ -39,7 +39,23 @@
:template="templateWithDefaults"
/>
-
+
+
+
+
+
+
+
+
+
+ {{ t('open_file_in_tab') }}
+
+
+
+ {{ t('download_file') }}
+
+
+
@@ -229,7 +245,7 @@ export default defineComponent({
const downloadUrl = computed(() => {
if (relatedPrimaryKey.value === null || relationCollection.value.collection !== 'directus_files') return;
- return addTokenToURL(getRootPath() + `assets/${relatedPrimaryKey.value}`);
+ return addTokenToURL(getRootPath() + `assets/${relatedPrimaryKey.value}?download`);
});
return {
@@ -263,8 +279,22 @@ export default defineComponent({
onUpload,
showUpload,
downloadUrl,
+ getUrl,
};
+ function getUrl(junctionRow: Record, addDownload?: boolean) {
+ const { junctionField } = relationInfo.value;
+ const key = junctionRow[junctionField]?.id ?? junctionRow[junctionField] ?? null;
+
+ if (!key) return null;
+
+ if (addDownload) {
+ return addTokenToURL(getRootPath() + `assets/${key}?download`);
+ }
+
+ return addTokenToURL(getRootPath() + `assets/${key}`);
+ }
+
function emitter(newVal: any[] | null) {
emit('input', newVal);
}
@@ -311,4 +341,8 @@ export default defineComponent({
--v-icon-color: var(--danger);
}
}
+
+.remove {
+ margin-right: 4px;
+}
diff --git a/app/src/lang/translations/en-US.yaml b/app/src/lang/translations/en-US.yaml
index 73f0c37fa5..a737a244c7 100644
--- a/app/src/lang/translations/en-US.yaml
+++ b/app/src/lang/translations/en-US.yaml
@@ -416,6 +416,7 @@ replace_from_library: Replace File from Library
replace_from_url: Replace File from URL
no_file_selected: No File Selected
download_file: Download File
+open_file_in_tab: Open file in new tab
start_export: Start Export
not_available_for_local_downloads: Not available for local downloads
exporting_all_items_in_collection: Exporting all {total} items within {collection}.