Merge pull request #313 from sysadminsmedia/tonya/sanitise-translatio…

…ns-when-using-v-html Sanitise translations when using v-html
sysadminsmedia · Oct 31, 2024 · 8d65b70 · 8d65b70
2 parents e2740a9 + 40b1793
commit 8d65b70
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/frontend/pages/tools.vue b/frontend/pages/tools.vue
@@ -40,7 +40,7 @@
           <DetailAction @action="modals.import = true">
             <template #title> {{ $t("tools.import_export_set.import") }} </template>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <div v-html="$t('tools.import_export_set.import_sub')"></div>
+            <div v-html="DOMPurify.sanitize($t('tools.import_export_set.import_sub'))"></div>
             <template #button> {{ $t("tools.import_export_set.import_button") }} </template>
           </DetailAction>
           <DetailAction @action="getExportCSV()">
@@ -57,7 +57,7 @@
             <span> {{ $t("tools.actions") }} </span>
             <template #description>
               <!-- eslint-disable-next-line vue/no-v-html -->
-              <div v-html="$t('tools.actions_sub')"></div>
+              <div v-html="DOMPurify.sanitize($t('tools.actions_sub'))"></div>
             </template>
           </BaseSectionHeader>
         </template>
@@ -75,13 +75,13 @@
           <DetailAction @action="resetItemDateTimes">
             <template #title> {{ $t("tools.actions_set.zero_datetimes") }} </template>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <div v-html="$t('tools.actions_set.zero_datetimes_sub')"></div>
+            <div v-html="DOMPurify.sanitize($t('tools.actions_set.zero_datetimes_sub'))"></div>
             <template #button> {{ $t("tools.actions_set.zero_datetimes_button") }} </template>
           </DetailAction>
           <DetailAction @action="setPrimaryPhotos">
             <template #title> {{ $t("tools.actions_set.set_primary_photo") }} </template>
             <!-- eslint-disable-next-line vue/no-v-html -->
-            <div v-html="$t('tools.actions_set.set_primary_photo_sub')"></div>
+            <div v-html="DOMPurify.sanitize($t('tools.actions_set.set_primary_photo_sub'))"></div>
             <template #button> {{ $t("tools.actions_set.set_primary_photo_button") }} </template>
           </DetailAction>
         </div>
@@ -91,6 +91,7 @@
 </template>
 
 <script setup lang="ts">
+  import DOMPurify from "dompurify";
   import MdiFileChart from "~icons/mdi/file-chart";
   import MdiArrowRight from "~icons/mdi/arrow-right";
   import MdiDatabase from "~icons/mdi/database";