new cia scenario output

src/components/CiaFlowCodeViewer.vue

@@ -4,7 +4,6 @@ import { Controls } from '@vue-flow/controls'
 import { VueFlow, useVueFlow } from '@vue-flow/core'
 import { MiniMap } from '@vue-flow/minimap'
 import Dialog from 'primevue/dialog'
-import { CodeDiff } from 'v-code-diff'
 import { nextTick, onMounted, ref, toRefs } from 'vue'
 import ClassNode from './ClassNode.vue'
 import { useLayout } from './useLayout'
@@ -112,15 +111,18 @@ function defineNodes() {
 </script>
 
 <template>
-    <Dialog v-model:visible="dialogCodeVisible" modal :header="selectionNode.classname" :style="{ width: '70vw' }">
-        <h2>Change description: </h2>{{ selectionNode.change_description }}
+    <Dialog v-model:visible="dialogCodeVisible" modal :header="'Change on: '+selectionNode.classname" class="change-modal":style="{ width: '70vw', minHeight:'75vh'}">
+      <CiaSingleImpactView :change="selectionNode"></CiaSingleImpactView>
+        <!---<h2>Change description: </h2>{{ selectionNode.change_description }}
+        
         <div class="flex items-center gap-4 mb-4">
           <CodeDiff
             :old-string="selectionNode.previous_code"
             :new-string="selectionNode.new_code"
             output-format="side-by-side"
             />
-         </div>
+         </div>-->
+
     </Dialog>
 
     <div>
@@ -145,10 +147,6 @@ function defineNodes() {
         <MiniMap />
 
         <Controls position="top-left">
-
-        
-
-
         </Controls>
     </VueFlow>
     </div>