<script lang="ts">
import { faRefresh, faSearch } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';

export default {
    components: {
        FontAwesomeIcon: FontAwesomeIcon
    },
    props: {
        showFilters: {
            type: Boolean,
            required: true
        }
    },
    data() {
        return {
            showFilters: this.showFilters,
            faSearch: faSearch,
            reload: faRefresh
        }
    },
    methods: {
        search(){
            this.$emit('search');
        },
        refresh(){
            this.$emit('refresh');
        }
    }
}
</script>

<template>
    <v-btn @click="search()" style="margin-right: 10px" color="#1697f6" v-if="showFilters" v-tooltip="'Search'">
        <FontAwesomeIcon :icon="faSearch"></FontAwesomeIcon>
    </v-btn>
    <v-btn @click="refresh()" style="margin-right: 10px" color="#1697f6" v-if="showFilters" v-tooltip="'Refresh'">
        <FontAwesomeIcon :icon="reload"></FontAwesomeIcon>
    </v-btn>

</template>