From 2afabb99482309b3c4e66e88f9483ab821c536e7 Mon Sep 17 00:00:00 2001
From: Jonas Metzener <jonas.metzener@adfinis-sygroup.ch>
Date: Thu, 28 Nov 2019 13:45:58 +0100
Subject: [PATCH] fix(form): fix cf-field-value for choice and multiple choice
 questions

---
 addon/components/cf-field-value.js            | 27 ++++---------------
 .../components/cf-field-value-test.js         |  5 ++++
 2 files changed, 10 insertions(+), 22 deletions(-)

diff --git a/addon/components/cf-field-value.js b/addon/components/cf-field-value.js
index f353fd6fb..8b1fbc120 100644
--- a/addon/components/cf-field-value.js
+++ b/addon/components/cf-field-value.js
@@ -2,14 +2,9 @@ import moment from "moment";
 import Component from "@ember/component";
 import layout from "../templates/components/cf-field-value";
 import { computed } from "@ember/object";
-import { camelize } from "@ember/string";
 import { queryManager } from "ember-apollo-client";
 import getFileAnswerInfoQuery from "ember-caluma/gql/queries/get-fileanswer-info";
 
-function getOptionKey(questionType) {
-  return `${camelize(questionType.replace(/Question$/, ""))}Options`;
-}
-
 export default Component.extend({
   layout,
 
@@ -17,30 +12,17 @@ export default Component.extend({
 
   tagName: "span",
 
-  value: computed("field.answer.value", function() {
-    const field = this.get("field");
-    const options = field.question[getOptionKey(field.question.__typename)];
+  value: computed("field.{selected,answer.value}", function() {
+    const field = this.field;
 
     switch (field.question.__typename) {
       case "ChoiceQuestion":
       case "DynamicChoiceQuestion": {
-        const option = options.edges.find(
-          edge => edge.node.slug === field.answer.value
-        );
-        return { label: option ? option.node.label : field.answer.value };
+        return field.selected;
       }
       case "MultipleChoiceQuestion":
       case "DynamicMultipleChoiceQuestion": {
-        const answerValue = field.answer.value || [];
-        const selectedOptions = options.edges.filter(edge =>
-          answerValue.includes(edge.node.slug)
-        );
-        return {
-          label:
-            selectedOptions && selectedOptions.length
-              ? selectedOptions.map(edge => edge.node.label).join(", ")
-              : answerValue.join(", ")
-        };
+        return { label: field.selected.map(({ label }) => label).join(", ") };
       }
       case "FileQuestion": {
         const answerValue = field.answer.value;
@@ -61,6 +43,7 @@ export default Component.extend({
         };
     }
   }),
+
   actions: {
     async download(fileAnswerId) {
       const { downloadUrl } = await this.apollo.watchQuery(
diff --git a/tests/integration/components/cf-field-value-test.js b/tests/integration/components/cf-field-value-test.js
index b9b409b0f..0b59c668f 100644
--- a/tests/integration/components/cf-field-value-test.js
+++ b/tests/integration/components/cf-field-value-test.js
@@ -8,6 +8,10 @@ module("Integration | Component | cf-field-value", function(hooks) {
 
   test("it renders multiple choice questions", async function(assert) {
     this.set("field", {
+      selected: [
+        { slug: "option-a", label: "A" },
+        { slug: "option-b", label: "B" }
+      ],
       question: {
         __typename: "MultipleChoiceQuestion",
         multipleChoiceOptions: {
@@ -45,6 +49,7 @@ module("Integration | Component | cf-field-value", function(hooks) {
 
   test("it renders choice questions", async function(assert) {
     this.set("field", {
+      selected: { slug: "option-c", label: "C" },
       question: {
         __typename: "ChoiceQuestion",
         choiceOptions: {