From 216809779775b3258b2837ce1a8d9d1aa7dac970 Mon Sep 17 00:00:00 2001
From: Gabriel Gehrig <uhrgw@student.kit.edu>
Date: Fri, 15 Sep 2023 12:13:59 +0200
Subject: [PATCH] Final changes in category pages

---
 .../uncertainty/UncertaintyDetailPage.vue     |  2 +-
 app/src/components/util/ExampleSection.vue    | 20 +++++++++++++++----
 app/src/data/categories/location.ts           |  2 +-
 app/src/data/categories/type.ts               |  2 +-
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/app/src/components/uncertainty/UncertaintyDetailPage.vue b/app/src/components/uncertainty/UncertaintyDetailPage.vue
index b139d13..417f7be 100644
--- a/app/src/components/uncertainty/UncertaintyDetailPage.vue
+++ b/app/src/components/uncertainty/UncertaintyDetailPage.vue
@@ -16,7 +16,7 @@
             <RelationshipItem v-for="(relation, index) in props.uncertainty.relations" :relationship="relation" :key="index" :value="relation.relatedToId" @click="$emit('selected-uncertainty-id', relation.relatedToId.toString())"/>
         </div>
         <div class="additionalHelp">
-            <ExampleSection :description="props.uncertainty.exampleScenario" :imagePath="imagePath" :collaborationUrl="props.uncertainty.communityAnnotationUrl"/>
+            <ExampleSection header="Example Section" :description="props.uncertainty.exampleScenario" :imagePath="imagePath" :collaborationUrl="props.uncertainty.communityAnnotationUrl"/>
         </div>
     </main>
 </template>
diff --git a/app/src/components/util/ExampleSection.vue b/app/src/components/util/ExampleSection.vue
index 6564db0..a27130d 100644
--- a/app/src/components/util/ExampleSection.vue
+++ b/app/src/components/util/ExampleSection.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="example-section">
-        <div class="scenario">
-            <h3>Example Scenario:</h3>
+        <div class="scenario" v-if="props.header !== undefined || props.description !== undefined">
+            <h3 v-if="props.header !== undefined">{{props.header}}</h3>
             <p v-for="section in descriptionSections" :key="section">{{ section }}</p>
         </div>
         <div class="supporting-image">
@@ -14,11 +14,13 @@
 
 </template>
 <script setup lang="ts">
+import { computed } from 'vue';
+
 
 const props = defineProps({
         description: {
             type: String,
-            required: true
+            required: false
         },
         imagePath: {
             type: String,
@@ -28,9 +30,19 @@ const props = defineProps({
             type: String,
             required: true
         },
+        header: {
+            type: String,
+            required: false
+        }
         });
 
-const descriptionSections = props.description.split("\n");
+const descriptionSections = computed(() =>{
+    if (props.description !== undefined) {
+        return props.description.split("\n");
+    } else {
+        return '';
+    }
+});
 
 </script>
 <style scoped>
diff --git a/app/src/data/categories/location.ts b/app/src/data/categories/location.ts
index 8d71e18..c756d7d 100644
--- a/app/src/data/categories/location.ts
+++ b/app/src/data/categories/location.ts
@@ -8,7 +8,7 @@ const location : Category = {
     "name": "Location",
     "definition": "Describes where an uncertainty manifests itself within the architecture.",
     "description": "",
-    "exampleScenario": 'Within a system environment is the system structure. Within the system structure resides the system behaviour. The system behaviour is influenced by the input.',
+    "exampleScenario": 'The system environment is outside of the system structure. Within the system structure resides the system behaviour. The system behaviour is influenced by the input.',
     "options": [Input, systemBehaviour, systemEnvironment, systemStructure ],
     "imagePath": "location.png",
     "discussionUrl": "https://github.com/abunai-dev/UncertaintySourceArchive/issues/3"
diff --git a/app/src/data/categories/type.ts b/app/src/data/categories/type.ts
index 92faaf5..dae10a3 100644
--- a/app/src/data/categories/type.ts
+++ b/app/src/data/categories/type.ts
@@ -6,7 +6,7 @@ const type : Category = {
     "name": "Type",
     "definition": "How much is known about the uncertainty and how can it be described.",
     "description": "",
-    "exampleScenario": 'When an uncertainty is classified as "Recognized Ignorance", it is not tangible. When it is classified as "Scenario Uncertainty", it is tangible but not quantifiable. When it is classified as "Statistical Uncertainty", it is quantifiable ',
+    "exampleScenario": 'When there is recognized ignorance, one does not have any knowledge of the uncertainty. When there is scenario uncertainty, one knows the possible outcomes of the uncertainty. When there is statistical uncertainty, one knows the probability distribution of the uncertainty.',
     "options": [ recognizedIgnorance, scenarioUncertainty, statisticalUncertainty ],
     "imagePath": "type.png",
     "discussionUrl": "https://github.com/abunai-dev/UncertaintySourceArchive/issues/24"