import { apiFetch } from "@/api/auth";
import { Button } from "@/components/ui/button";
import { useEffect, useState } from "react";

export function Video() {

    const refresh = async () => {
        await apiFetch(`/protected/refreshfiles`, {
            method: "POST",
        });
    }

    const create = async () => {
        await apiFetch(`/protected/createclip`, {
            method: "POST",
        });
    }

    return (
        <div className="flex flex-1 flex-col gap-4 py-16">
            <div>
                <Button
                    onClick={() => { refresh() }}
                >Refresh</Button>
                <Button
                    onClick={() => { create() }}
                >Create Clip</Button>
            </div>
            <video controls width="600">
                <source
                    src={`${import.meta.env.VITE_API_URL}/protected/video`}
                    type="video/mp4"
                />
                Your browser does not support the video tag.
            </video>
        </div>
    );
}