fix: use correct icon for layer download advanced action (#2224)

Replace #2221
umap-project · Oct 21, 2024 · e100809 · e100809
2 parents 037b8e0 + a1a4904
commit e100809
Show file tree

Hide file tree

Showing 7 changed files with 20 additions and 15 deletions.
diff --git a/umap/static/umap/img/24-white.svg b/umap/static/umap/img/24-white.svg
diff --git a/umap/static/umap/img/24.svg b/umap/static/umap/img/24.svg
diff --git a/umap/static/umap/img/source/24-white.svg b/umap/static/umap/img/source/24-white.svg
diff --git a/umap/static/umap/img/source/24.svg b/umap/static/umap/img/source/24.svg
diff --git a/umap/static/umap/js/modules/data/layer.js b/umap/static/umap/js/modules/data/layer.js
@@ -802,13 +802,12 @@ export class DataLayer {
       this
     )
     if (this.umap_id) {
-      const download = DomUtil.createLink(
-        'button umap-download',
-        advancedButtons,
-        translate('Download'),
-        this._dataUrl(),
-        '_blank'
-      )
+      const filename = Utils.slugify(this.options.name)
+      const download = Utils.loadTemplate(`
+        <a class="button" href="${this._dataUrl()}" download="${filename}">
+          <i class="icon icon-24 icon-download"></i>${translate('Download')}
+        </a>`)
+      advancedButtons.appendChild(download)
     }
     const backButton = DomUtil.createButtonIcon(
       undefined,

diff --git a/umap/static/umap/js/modules/share.js b/umap/static/umap/js/modules/share.js
@@ -142,9 +142,7 @@ export default class Share {
   async format(mode) {
     const type = EXPORT_FORMATS[mode]
     const content = await type.formatter(this.map)
-    let name = this.map.options.name || 'data'
-    name = name.replace(/[^a-z0-9]/gi, '_').toLowerCase()
-    const filename = name + type.ext
+    const filename = Utils.slugify(this.map.options.name) + type.ext
     return { content, filetype: type.filetype, filename }
   }
 

diff --git a/umap/static/umap/js/modules/utils.js b/umap/static/umap/js/modules/utils.js
@@ -407,6 +407,10 @@ export class WithTemplate {
   }
 }
 
-export function deepEqual(object1, object2){
+export function deepEqual(object1, object2) {
   return JSON.stringify(object1) === JSON.stringify(object2)
 }
+
+export function slugify(str) {
+  return (str || 'data').replace(/[^a-z0-9]/gi, '_').toLowerCase()
+}