<template>
  <q-footer data-test-id="files-copymove-footer" elevated class="bg-white">
    <q-toolbar style="height: 60px" class="full-width">
      <div class="full-width flex no-wrap justify-between">
        <AppButton
            data-test-id="files-copymove-cancel"
            size="15px"
            flat
            class="q-px-md items-start"
            color="black"
            label="Cancel"
            @click="cancel"
        />
        <AppButton
            v-if="isCopyMoveAllowed"
            data-test-id="files-copymove-copy"
            size="15px"
            flat
            :class="showMoveAction ? 'q-px-sm' : 'q-px-md items-end'"
            color="black"
            label="Copy"
            @click="copy"
        />
        <AppButton
            v-if="showMoveAction"
            data-test-id="files-copymove-move"
            size="15px"
            flat
            class="q-px-md items-end"
            color="black"
            label="Move"
            @click="move"
        />
      </div>
    </q-toolbar>
  </q-footer>
</template>

<script>
import {mapActions, mapGetters} from 'pinia'
import { useFilesStore } from '../../store/index-pinia'

import AppButton from 'components/common/AppButton'
import { STORAGE_TYPES } from '../../enums'

export default {
  name: 'CopiedFooter',
  components: {
    AppButton,
  },
  computed: {
    ...mapGetters(useFilesStore, ['currentStorage', 'copiedFiles']),
    showMoveAction() {
      return this.currentStorage.Type !== STORAGE_TYPES.SHARED
        && this.currentStorage.Type !== STORAGE_TYPES.FAVORITES
        && this.currentStorage.Type !== STORAGE_TYPES.TRASH
        && this.copiedFiles[0].type !== STORAGE_TYPES.SHARED
    },
    isCopyMoveAllowed() {
      return this.currentStorage.Type !== STORAGE_TYPES.FAVORITES
        && this.currentStorage.Type !== STORAGE_TYPES.TRASH
    },
  },
  methods: {
    ...mapActions(useFilesStore, ['removeCopiedFiles', 'copyItems', 'moveItems']),
    cancel() {
      this.removeCopiedFiles()
    },
    copy() {
      this.copyItems()
    },
    move() {
      this.moveItems()
    },
  },
}
</script>
