feat(proofs): display the proof receipt privacy status in the proof f…

…ooter (#468)
openfoodfacts · Mar 20, 2024 · f1ca0fe · f1ca0fe
1 parent a12ead6
commit f1ca0fe
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 4 deletions.
diff --git a/src/components/ProofEditDialog.vue b/src/components/ProofEditDialog.vue
@@ -8,7 +8,7 @@
       <v-divider></v-divider>
 
       <v-card-text v-if="proof.type === 'RECEIPT'">
-        <h3>{{ $t('ProofEdit.PrivateWarning') }}</h3>
+        <h3>{{ $t('ProofDetail.Privacy') }}</h3>
         <v-switch
           v-model="isPublic"
           color="green"

diff --git a/src/components/ProofFooter.vue b/src/components/ProofFooter.vue
@@ -2,6 +2,7 @@
   <v-row>
     <v-col :cols="userIsProofOwner ? '11' : '12'">
       <ProofTypeChip class="mr-1" :proof="proof"></ProofTypeChip>
+      <ProofPrivateChip v-if="proof.type === 'RECEIPT'" class="mr-1" :proof="proof"></ProofPrivateChip>
       <PriceCountChip :count="proof.price_count" :withLabel="true" @click="goToProof()"></PriceCountChip>
       <RelativeDateTimeChip :dateTime="proof.created"></RelativeDateTimeChip>
     </v-col>
@@ -18,6 +19,7 @@ import { useAppStore } from '../store'
 export default {
   components: {
     'ProofTypeChip': defineAsyncComponent(() => import('../components/ProofTypeChip.vue')),
+    'ProofPrivateChip': defineAsyncComponent(() => import('../components/ProofPrivateChip.vue')),
     'PriceCountChip': defineAsyncComponent(() => import('../components/PriceCountChip.vue')),
     'RelativeDateTimeChip': defineAsyncComponent(() => import('../components/RelativeDateTimeChip.vue')),
     'ProofActionMenuButton': defineAsyncComponent(() => import('../components/ProofActionMenuButton.vue'))

diff --git a/src/components/ProofPrivateChip.vue b/src/components/ProofPrivateChip.vue
@@ -0,0 +1,15 @@
+<template>
+  <v-chip label size="small" density="comfortable">
+    <v-icon start :icon="proof.is_public ? 'mdi-lock-open-check' : 'mdi-lock-alert'"></v-icon>
+    <span v-if="proof.is_public" class="text-green">{{ $t('ProofDetail.Public') }}</span>
+    <span v-else class="text-red">{{ $t('ProofDetail.Private') }}</span>
+  </v-chip>
+</template>
+
+<script>
+export default {
+  props: {
+    'proof': null,
+  },
+}
+</script>
diff --git a/src/components/ProofTypeChip.vue b/src/components/ProofTypeChip.vue
@@ -1,6 +1,6 @@
 <template>
   <v-chip label size="small" density="comfortable">
-    <v-icon start icon="mdi-paperclip"></v-icon>
+    <v-icon start icon="mdi-image"></v-icon>
     <span v-if="proof.type === 'GDPR_REQUEST'">
       <a :href="OFF_WIKI_GDPR_REQUEST_URL" target="_blank">
         {{ proofTypeName }}

diff --git a/src/views/AddPriceMultiple.vue b/src/views/AddPriceMultiple.vue
@@ -78,8 +78,8 @@
                   @change="updateIsPublicProof">
                   <template v-slot:label>
                     <v-icon start size="small" :icon="proofIsPublic ? 'mdi-lock-open-check' : 'mdi-lock-alert'" :color="proofIsPublic ? 'green' : 'red'"></v-icon>
-                    <span :style="{ color: proofIsPublic ? 'green' : 'red' }">
-                      {{ proofIsPublic ? $t('AddPriceMultiple.ProofDetails.Public') : $t('AddPriceMultiple.ProofDetails.Private') }}
+                    <span :class="proofIsPublic ? 'text-green' : 'text-red'">
+                      {{ proofIsPublic ? $t('ProofDetail.Public') : $t('ProofDetail.Private') }}
                     </span>
                   </template>
                 </v-switch>