Allow to edit review

Author: epou

src/components/identificationTasks/IdentificationTaskGridItem.vue

@@ -23,7 +23,7 @@
     <figcaption v-if="task.result" class="absolute bottom-0 left-0 p-2">
       <IdentificationTaskResultTag class="bg-white/80!" :result="task.result" />
     </figcaption>
-    <figcaption v-else-if="$can('add', 'Review') && !task.review"
+    <figcaption v-else-if="$can('add', subject('Review', { 'identification_task': task }))"
       class="absolute bottom-0 left-0 p-2 flex gap-2 w-full bg-linear-to-t from-black to-transparent">
       <TaxonTreeSelect class="flex-1" placeholder="Select taxon"
         @on-change="(taxon) => taxon ? submitReview(taxon) : null" />
@@ -35,6 +35,7 @@
 
 <script setup lang="ts">
 import { ref } from 'vue';
+import { subject } from '@casl/ability';
 import { useToast } from 'primevue/usetoast';
 
 import type { IdentificationTask, Taxon, IdentificationTasksApiReviewCreateRequest } from 'mosquito-alert';

src/services/ability.ts

@@ -69,29 +69,27 @@ export default function defineAbilityFor(userPermission: UserPermission | null)
   }
 
   function grantReviewPermissions(perms: ReviewPermission, countryId?: number) {
+    const countryCondition = buildCountryCondition(countryId)
+    const remappedCountryCondition = countryCondition
+      ? Object.fromEntries(
+          Object.entries(countryCondition).map(([key, value]) => [
+            `identification_task.${key}`,
+            value,
+          ]),
+        )
+      : {}
     if (perms.add) {
-      const countryCondition = buildCountryCondition(countryId)
-      const remappedCountryCondition = countryCondition
-        ? Object.fromEntries(
-            Object.entries(countryCondition).map(([key, value]) => [
-              `identification_task.${key}`,
-              value,
-            ]),
-          )
-        : {}
       can('add', 'Review', {
-        'identification_task.status': {
-          $in: [
-            IdentificationTaskStatus.Conflict,
-            IdentificationTaskStatus.Done,
-            IdentificationTaskStatus.Review,
-          ],
-        },
         'identification_task.review': null,
         ...remappedCountryCondition,
       })
     }
-    if (perms.change) can('change', 'Review', buildCountryCondition(countryId))
+    if (perms.change) {
+      can('change', 'Review', {
+        'identification_task.review': { $ne: null },
+        ...remappedCountryCondition,
+      })
+    }
     if (perms.view) can('view', 'Review', buildCountryCondition(countryId))
     if (perms.delete) can('delete', 'Review', buildCountryCondition(countryId))
   }

src/views/identification_task/DetailView.vue

@@ -17,7 +17,11 @@
         <span>Identification task: </span>
         <span class="text-surface-900 dark:text-surface-0">{{ identificationTask?.observation.uuid }}</span>
       </div>
-      <div class="ml-auto">
+      <div class="flex ml-auto gap-2 items-center">
+        <Button
+          v-if="$can(identificationTask?.review == null ? 'add' : 'change', subject('Review', { 'identification_task': identificationTask }))"
+          icon="pi pi-pencil" size='small' severity="secondary" outlined @click="isReviewing = true"
+          :disabled="isReviewing" v-tooltip.top="'Edit review'" />
         <IdentificationTaskStatusTag v-if="identificationTask" :status="identificationTask?.status" />
       </div>
     </div>
@@ -164,7 +168,8 @@
     </div>
   </div>
 
-  <ReviewDialog v-if="$can('add', subject('Review', { 'identification_task': identificationTask }))"
+  <ReviewDialog
+    v-if="$can('add', subject('Review', { 'identification_task': identificationTask })) && identificationTask?.result"
     :identification-task="identificationTask" :visible="!isReviewing" :loading="isSubmittingReview || loading"
     @agree="submitReview(CreateAgreeReviewRequestAction.Agree)" @disagree="isReviewing = true" />