<script setup lang="ts">

import * as log from 'loglevel';
import {useLearningPathStore} from '@/stores/learningPath';
import {useUserStore} from '@/stores/user';

import LearningPathDiagram from '@/components/circle/LearningPathDiagram.vue';
import ItFullScreenModal from '@/components/ui/ItFullScreenModal.vue';


log.debug('LearningPathView created');

const props = defineProps<{
  learningPathSlug: string,
  show: boolean

}>()


const learningPathStore = useLearningPathStore();
const userStore = useUserStore();

const emits = defineEmits(['closemodal'])

</script>
<template>
  <ItFullScreenModal
    :show="show"
    @closemodal="$emit('closemodal')">
    <div class="bg-white" v-if="learningPathStore.learningPath">
      <h1 class="m-6">{{ learningPathStore.learningPath.title }}</h1>
      <div class="learningpath flex flex-col">
        <div class="flex flex-col h-max">
          <div class="bg-red py-8">
            <LearningPathDiagram class="max-w-[1680px] w-full"
                                 height="2000"
                                 identifier="verticalVisualization"
                                 v-bind:vertical="true"></LearningPathDiagram>
          </div>
        </div>
      </div>
    </div>
  </ItFullScreenModal>
</template>
<style scoped>
</style>
