<script setup lang="ts">
import { MdPreview } from 'md-editor-v3'
import { useChatRctStore } from '@stores/chatrct.store'

import 'md-editor-v3/lib/preview.css'
import 'md-editor-v3/lib/style.css'

const id = 'chatrct-prompt'
const store = useChatRctStore()
const chatText = computed(() => store.prompt_gen())
</script>

<template>
  <VCard>
    <div
      v-if="store.loading"
      class="loading-container"
    >
      <VProgressCircular
        :size="60"
        color="primary"
        indeterminate
      />

      <span> Je recherche vos données. Veuillez patienter ...</span>
    </div>
    <MdPreview
      v-else
      :editor-id="id"
      :model-value="chatText"
    />
  </VCard>
</template>
