Merge branch 'gino-m/1779/export-csv-from-pb-data' of https://github.com/google/ground-platform into gino-m/1779/export-csv-from-pb-data

Author: gino-m

web/src/app/converters/firebase-data-converter.ts

@@ -21,6 +21,7 @@ import {AuditInfo} from 'app/models/audit-info.model';
 import {MultiPolygon} from 'app/models/geometry/multi-polygon';
 import {DataCollectionStrategy, Job} from 'app/models/job.model';
 import {Role} from 'app/models/role.model';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Result} from 'app/models/submission/result.model';
 import {
   Submission,
@@ -403,14 +404,11 @@ export class FirebaseDataConverter {
   }
 
   private static resultToJS(result: Result): {} {
-    if (typeof result.value === 'string') {
+    if (typeof result.value === 'string' || typeof result.value === 'number') {
       return result.value;
     }
-    if (typeof result.value === 'number') {
-      return result.value;
-    }
-    if (result.value instanceof List) {
-      return (result.value as List<Option>).map(option => option.id).toArray();
+    if (result.value instanceof MultipleSelection) {
+      return result.value.values.map(option => option.id).toArray();
     }
     if (result.value instanceof Date) {
       return Timestamp.fromDate(result.value);

web/src/app/converters/submission-data-converter.ts

@@ -25,6 +25,7 @@ import {MultiPolygon} from 'app/models/geometry/multi-polygon';
 import {Point} from 'app/models/geometry/point';
 import {Polygon} from 'app/models/geometry/polygon';
 import {Job} from 'app/models/job.model';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Result} from 'app/models/submission/result.model';
 import {
   Submission,
@@ -122,22 +123,12 @@ function taskDataPbToModel(pb: Pb.ITaskData[], job: Job): SubmissionData {
     else if (dateTimeResponse)
       value = new Date(timestampToInt(dateTimeResponse.dateTime));
     else if (multipleChoiceResponses) {
-      value =
+      value = new MultipleSelection(
         task.multipleChoice?.options.filter(({id: optionId}) =>
           multipleChoiceResponses!.selectedOptionIds?.includes(optionId)
-        ) || List([]);
-
-      if (
-        task.multipleChoice?.hasOtherOption &&
-        multipleChoiceResponses!.otherText
-      ) {
-        value = value.push(
-          createOtherOption(
-            multipleChoiceResponses!.otherText,
-            task.multipleChoice?.options.size
-          )
-        );
-      }
+        ) || List([]),
+        multipleChoiceResponses.otherText
+      );
     } else if (drawGeometryResult)
       value = geometryPbToModel(drawGeometryResult.geometry!) as Polygon;
     else if (captureLocationResult)
@@ -266,22 +257,21 @@ export class LegacySubmissionDataConverter {
     task?: Task
   ): Result | Error {
     try {
-      if (typeof resultValue === 'number') {
-        return new Result(resultValue as number);
-      } else if (typeof resultValue === 'string') {
-        return new Result(resultValue as string);
-      } else if (resultValue instanceof Array) {
+      if (typeof resultValue === 'number' || typeof resultValue === 'string') {
+        return new Result(resultValue);
+      } else if (Array.isArray(resultValue)) {
         return new Result(
-          List(
-            resultValue.map(optionId => {
-              if (optionId.startsWith('['))
-                return createOtherOption(optionId, resultValue.length);
-              else
-                return (
-                  task?.getMultipleChoiceOption(optionId) ||
-                  new Option(optionId, optionId, optionId, -1)
-                );
-            })
+          new MultipleSelection(
+            List(
+              resultValue
+                .filter(optionId => !optionId.startsWith('['))
+                .map(
+                  optionId =>
+                    task?.getMultipleChoiceOption(optionId) ||
+                    new Option(optionId, optionId, optionId, -1)
+                )
+            ),
+            resultValue.find(optionId => optionId.startsWith('['))
           )
         );
       } else if (resultValue instanceof Timestamp) {

web/src/app/models/submission/multiple-selection.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright 2024 The Ground Authors.
+ *
+ * Licensed under the Apache License, Version 2.0 (the 'License');
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an 'AS IS' BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {List} from 'immutable';
+
+import {Option} from 'app/models/task/option.model';
+
+export class MultipleSelection {
+  constructor(
+    readonly values: List<Option>,
+    readonly otherValue?: string | null
+  ) {}
+}

web/src/app/models/submission/result.model.ts

@@ -14,11 +14,9 @@
  * limitations under the License.
  */
 
-import {List} from 'immutable';
-
 import {MultiPolygon} from 'app/models/geometry/multi-polygon';
-import {Option} from 'app/models/task/option.model';
 
+import {MultipleSelection} from './multiple-selection';
 import {Point} from '../geometry/point';
 import {Polygon} from '../geometry/polygon';
 
@@ -27,7 +25,7 @@ export class Result {
     readonly value:
       | number
       | string
-      | List<Option>
+      | MultipleSelection
       | Date
       | Point
       | Polygon

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

@@ -41,9 +41,13 @@
           <div *ngIf="getTaskSubmissionResult(task) !== undefined">
             <!-- Multiple choice task types -->
             <div *ngIf="task.type === taskType.MULTIPLE_CHOICE" class="submission-response-multiple-choice">
-              <mat-checkbox disabled="true" checked="true" *ngFor="let option of getTaskMultipleChoiceSelections(task)">
+              <mat-checkbox disabled="true" checked="true" *ngFor="let option of getTaskMultipleChoiceSelections(task).values">
                 {{option.label}}
               </mat-checkbox>
+
+              <mat-checkbox disabled="true" checked="true" *ngIf="getTaskMultipleChoiceSelections(task).otherOption">
+                Other: {{option.label}}
+              </mat-checkbox>
             </div>
             <!-- Photo task types -->
             <div *ngIf="task.type === taskType.PHOTO">

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

@@ -20,6 +20,7 @@ import {List} from 'immutable';
 import {Subscription, firstValueFrom} from 'rxjs';
 
 import {Point} from 'app/models/geometry/point';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Result} from 'app/models/submission/result.model';
 import {Submission} from 'app/models/submission/submission.model';
 import {Option} from 'app/models/task/option.model';
@@ -97,8 +98,8 @@ export class SubmissionPanelComponent implements OnInit, OnDestroy {
     return this.submission?.data.get(taskId);
   }
 
-  getTaskMultipleChoiceSelections(task: Task): List<Option> {
-    return this.getTaskSubmissionResult(task)!.value as List<Option>;
+  getTaskMultipleChoiceSelections(task: Task): MultipleSelection {
+    return this.getTaskSubmissionResult(task)!.value as MultipleSelection;
   }
 
   getCaptureLocationCoord(task: Task): string {

web/src/app/pages/main-page-container/main-page/side-panel/loi-panel/loi-panel.component.ts

@@ -20,6 +20,7 @@ import {Observable, Subscription, combineLatest} from 'rxjs';
 import {switchMap} from 'rxjs/operators';
 
 import {Job} from 'app/models/job.model';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Submission} from 'app/models/submission/submission.model';
 import {Option} from 'app/models/task/option.model';
 import {Task, TaskType} from 'app/models/task/task.model';
@@ -121,7 +122,7 @@ export class LocationOfInterestPanelComponent implements OnInit, OnDestroy {
   getOptions(task: Task, submission: Submission): List<Option> {
     const result = submission.data?.get(task.id);
     if (result && result instanceof List) {
-      return result.value as List<Option>;
+      return (result.value as MultipleSelection).values;
     } else {
       return List.of();
     }

web/src/app/pages/main-page-container/main-page/side-panel/submission-form/submission-form.component.spec.ts

@@ -36,6 +36,7 @@ import {Coordinate} from 'app/models/geometry/coordinate';
 import {Point} from 'app/models/geometry/point';
 import {Job} from 'app/models/job.model';
 import {LocationOfInterest} from 'app/models/loi.model';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Result} from 'app/models/submission/result.model';
 import {Submission} from 'app/models/submission/submission.model';
 import {Survey} from 'app/models/survey.model';
@@ -128,7 +129,7 @@ class MockModel {
     new AuditInfo(MockModel.user001, new Date(), new Date()),
     Map({
       task001: new Result('result'),
-      task003: new Result(List([MockModel.option001])),
+      task003: new Result(new MultipleSelection(List([MockModel.option001]))),
     })
   );
 }

web/src/app/pages/main-page-container/main-page/side-panel/submission-form/submission-form.component.ts

@@ -23,6 +23,7 @@ import {first, map, switchMap} from 'rxjs/operators';
 import {JobListItemActionsType} from 'app/components/job-list-item/job-list-item.component';
 import {AuditInfo} from 'app/models/audit-info.model';
 import {Job} from 'app/models/job.model';
+import {MultipleSelection} from 'app/models/submission/multiple-selection';
 import {Result} from 'app/models/submission/result.model';
 import {
   Submission,
@@ -267,7 +268,7 @@ export class SubmissionFormComponent {
     result?: Result
   ): void {
     const selectedOptionId = (
-      (result?.value as List<Option>)?.first() as Option
+      (result?.value as MultipleSelection)?.values.first() as Option
     )?.id;
     group[task.id] = task.required
       ? new FormControl(selectedOptionId, Validators.required)
@@ -278,23 +279,25 @@ export class SubmissionFormComponent {
     const selectedOption: Option = task.getMultipleChoiceOption(
       this.submissionForm?.value[task.id]
     );
-    return new Result(List([selectedOption]));
+    return new Result(new MultipleSelection(List([selectedOption])));
   }
 
   private addControlsForSelectMultipleTask(
     group: {[taskId: string]: FormControl},
     task: Task,
     result?: Result
   ): void {
-    const selectedOptions = result?.value as List<Option>;
+    const {values: selectedOptions} = result?.value as MultipleSelection;
     for (const option of task.multipleChoice!.options) {
       group[option.id] = new FormControl(selectedOptions?.contains(option));
     }
   }
 
   private extractDataForSelectMultipleTask(task: Task): Result {
-    const selectedOptions: List<Option> = task.multipleChoice!.options!.filter(
-      (option: Option) => this.submissionForm?.value[option.id]
+    const selectedOptions: MultipleSelection = new MultipleSelection(
+      task.multipleChoice!.options!.filter(
+        (option: Option) => this.submissionForm?.value[option.id]
+      )
     );
     return new Result(selectedOptions);
   }