<template>
    <mx-progress :progress="progress" class="h-3 shadow-up shadow-green-100"/>
</template>

<script setup>
import {computed} from 'vue';
import {useInjectPaperService} from "@/components/mx-paper/usePaperInjection";
import {useInjectQuestionService} from "@/components/mx-question/useQuestionInjection";

const {questions} = useInjectPaperService()
const {answeredQuestions} = useInjectQuestionService()
const progress = computed(() => questions.value.length ? answeredQuestions.value.length / questions.value.length : 0)
</script>

<style scoped>

</style>