<script setup>
import { ShareIcon } from "@heroicons/vue/24/outline";
import { useForm, usePage } from "@inertiajs/vue3";

const page = usePage();

// define props
const props = defineProps({
    unshareall: {
        type: Boolean,
        default: false,
        required: false,
    },
    selected: {
        type: Array,
        required: false,
    },
});

// create form
const form = useForm({
    email: null,
    all: false,
    Ids: [],
    parent_id: null,
});

// unshare function
const unshare = () => {
    // define form fields
    form.all = props.unshareall;
    form.Ids = props.selected;
    if (page.props.folder) {
        form.parent_id = page.props.folder.id;
    }

    // post to file.share
    form.post(route("file.unshare"), {
        preserveScroll: true,
    });
};
</script>

<template>
    <button
        @click="unshare()"
        class="border-gray-700 border px-3 py-2 rounded hover:bg-rose-600 hover:border-rose-600 flex flex justify-center items-center gap-2"
    >
        <ShareIcon class="h-5 w-5" aria-hidden="true" /> Unshare
    </button>
</template>
