Hide the submission options menu from users who cannot delete

web/src/app/components/main-page/secondary-side-panel/submission-panel/submission-panel.component.html

@@ -34,6 +34,7 @@
       </div>
       <button
         mat-icon-button
+        *ngIf="canDeleteSubmission()"
         [matMenuTriggerFor]="menu"
         aria-label="Submission options"
         i18n-aria-label="@@app.submissionPanel.options"

web/src/app/components/main-page/secondary-side-panel/submission-panel/submission-panel.component.spec.ts

@@ -95,8 +95,10 @@ describe('SubmissionPanelComponent', () => {
     submissionService = jasmine.createSpyObj('SubmissionService', [
       'getSubmission$',
       'deleteSubmission',
+      'canDeleteSubmission',
     ]);
     submissionService.deleteSubmission.and.resolveTo();
+    submissionService.canDeleteSubmission.and.returnValue(true);
     navigationService = jasmine.createSpyObj('NavigationService', [
       'getTaskId$',
       'getLocationOfInterestId$',
@@ -148,6 +150,27 @@ describe('SubmissionPanelComponent', () => {
     expect(component).toBeTruthy();
   });
 
+  it('offers deletion when the service allows it', fakeAsync(() => {
+    initializeWithSubmission(Map({}));
+
+    expect(component.canDeleteSubmission()).toBeTrue();
+    const [survey, submission] =
+      submissionService.canDeleteSubmission.calls.mostRecent().args;
+    expect(survey).toBe(mockSurvey);
+    expect(submission.id).toBe(mockSubmission.id);
+  }));
+
+  it('hides deletion when the user may not delete the submission', fakeAsync(() => {
+    submissionService.canDeleteSubmission.and.returnValue(false);
+    initializeWithSubmission(Map({}));
+
+    expect(component.canDeleteSubmission()).toBeFalse();
+  }));
+
+  it('cannot delete before a submission has loaded', () => {
+    expect(component.canDeleteSubmission()).toBeFalse();
+  });
+
   it('should select geometry', fakeAsync(() => {
     const task = new Task('task1', TaskType.DRAW_AREA, 'Draw Area', true, 1);
     initializeWithSubmission(Map({}));
@@ -270,7 +293,7 @@ describe('SubmissionPanelComponent', () => {
 
   it('getTaskSubmissionResult returns result for a known task', fakeAsync(() => {
     const result = new Result('answer');
-    initializeWithSubmission(Map({task1: result}));
+    initializeWithSubmission(Map({ task1: result }));
     expect(
       component.getTaskSubmissionResult(
         new Task('task1', TaskType.TEXT, 'Text', true, 1)
@@ -293,6 +316,8 @@ describe('SubmissionPanelComponent', () => {
     expect(component.asStringOrNumber(new Result(42))).toBe(42);
     expect(component.asDate(new Result(date))).toBe(date);
     expect(component.asGeometry(new Result(point))).toBe(point);
-    expect(component.asMultipleSelection(new Result(null)) as unknown).toBeNull();
+    expect(
+      component.asMultipleSelection(new Result(null)) as unknown
+    ).toBeNull();
   });
 });

web/src/app/components/main-page/secondary-side-panel/submission-panel/submission-panel.component.ts

@@ -59,6 +59,13 @@ export class SubmissionPanelComponent {
     return submission.job?.getTasksSorted().filter(t => !t.addLoiTask);
   });
 
+  readonly canDeleteSubmission = computed(() => {
+    const survey = this.activeSurvey();
+    const submission = this.submission();
+    if (!survey || !submission) return false;
+    return this.submissionService.canDeleteSubmission(survey, submission);
+  });
+
   readonly submittedTasks = computed(() => {
     const currentTasks = this.tasks();
     if (!currentTasks || currentTasks.size === 0) return [];
@@ -73,7 +80,7 @@ export class SubmissionPanelComponent {
       loi: this.selectedLoi(),
       submissionId: this.submissionId(),
     }),
-    stream: ({params: {survey, loi, submissionId}}) =>
+    stream: ({ params: { survey, loi, submissionId } }) =>
       survey && loi && submissionId
         ? this.submissionService.getSubmission$(survey, loi, submissionId)
         : of(null),
@@ -141,8 +148,7 @@ export class SubmissionPanelComponent {
   asGeometry = (r: Result): Geometry => r.value as Geometry;
   asDate = (r: Result): Date => r.value as Date;
   asString = (r: Result): string => r.value as string;
-  asStringOrNumber = (r: Result): string | number =>
-    r.value as string | number;
+  asStringOrNumber = (r: Result): string | number => r.value as string | number;
 
   selectGeometry(task: Task): void {
     const survey = this.activeSurvey();