From 8049428fb1ed30e312241516242571f1cf4ed92e Mon Sep 17 00:00:00 2001
From: Lorenz Padberg <lorenz.padberg@iterativ.ch>
Date: Wed, 15 May 2024 23:30:30 +0200
Subject: [PATCH] Fix update problem with assignments

---
 .../assignment/SubmissionInput.vue            | 26 ++++++++++++++++---
 1 file changed, 23 insertions(+), 3 deletions(-)

diff --git a/client/src/components/content-blocks/assignment/SubmissionInput.vue b/client/src/components/content-blocks/assignment/SubmissionInput.vue
index 4fa88ca9..954978e5 100644
--- a/client/src/components/content-blocks/assignment/SubmissionInput.vue
+++ b/client/src/components/content-blocks/assignment/SubmissionInput.vue
@@ -3,7 +3,7 @@
     <textarea
       :placeholder="placeholder"
       :readonly="readonly"
-      :value="inputText"
+      v-model="editText"
       :class="{ 'submission-form__textarea--readonly': readonly }"
       data-cy="submission-textarea"
       rows="1"
@@ -23,11 +23,14 @@
     >
       <loading-icon class="submission-form__save-status-icon submission-form__saving-icon" />
     </div>
+
+
   </div>
 </template>
 
 <script setup lang="ts">
-import { defineAsyncComponent } from 'vue';
+  import {defineAsyncComponent, ref, watch} from 'vue';
+  import EmojiBar from "@/components/ui/EmojiBar.vue";
 const TickCircleIcon = defineAsyncComponent(() => import('@/components/icons/TickCircleIcon.vue'));
 const LoadingIcon = defineAsyncComponent(() => import('@/components/icons/LoadingIcon.vue'));
 
@@ -38,12 +41,29 @@ interface Props {
   placeholder: string;
 }
 
-withDefaults(defineProps<Props>(), {
+const props = withDefaults(defineProps<Props>(), {
   placeholder: 'Ergebnis erfassen',
 });
 
+const editText = ref(props.inputText)
+
 const emit = defineEmits(['input']);
 
+const  containsEmoji = (text: String) =>{
+  const emojis= ['🖐️', '👍', '👎', '👏', '👋', '🎉', '😍', '😮', '🤔']
+  const graphemes = Array.from(text);
+  const lastGrapheme = graphemes[graphemes.length - 1];
+  return emojis.includes(lastGrapheme);
+}
+
+watch(() => props.inputText, (newValue) => {
+  // TODO: Lorenz this is an ugly fix!
+  if (containsEmoji(newValue)){
+      editText.value = newValue;
+  }
+});
+
+
 const input = (e: Event) => {
   const value = (e.target as HTMLInputElement).value;
   emit('input', value);