<template>
  <MyCv />
  <div class="menu">
    <button @click="downloadPdf()">
      <DownloadIcon width="32" height="32" />
    </button>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import { useSelectedSkill } from "@/stores/selectedSkill";
import MyCv from "@/components/cv/MyCv.vue";
import DownloadIcon from "@/components/icons/DownloadIcon.vue";

export default defineComponent({
  name: "app",
  components: {
    MyCv,
    DownloadIcon,
  },
  setup() {
    const store = useSelectedSkill();

    return {
      unselect: store.unselect,
    };
  },
  methods: {
    downloadPdf() {
      this.unselect();
      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
      // @ts-ignore
      window.downloadPdf();
    },
  },
});
</script>

<style>
.menu {
  display: flex;
  flex-direction: column;
  padding-left: 12px;
  padding-top: 6px;
}
</style>
