import {createSignal, onMount} from "solid-js"
import {ishover} from "../App";

interface Review {
    reviewID: number;
    discordID: string;
    reviewText: string;
    timestamp: string;
}

interface NeoReview extends Review {
    global_name: string;
    username: string
}


export default function Reviews() {
    const [reviews, setReviews] = createSignal<NeoReview[]>([]);
    onMount(() => {
        fetch("https://review.exhq.dev/getreviews")
            .then(response => response.json())
            .then((data: Review[]) => {
                const promises = data.map(review => (
                    fetch(`https://dc-lookup.spiro.exhq.dev/v1/user/${review.discordID}`)
                        .then(response => response.json())
                        .then(user => ({
                            ...review,
                            global_name: user.global_name,
                            username: user.username
                        }))
                ));

                Promise.all(promises)
                    .then(yeah => {
                        setReviews(yeah);
                    })
                    .catch(error => console.error("Error fetching Discord user data:", error));
            })
            .catch(error => console.error("Error fetching reviews:", error));
    });


    return (
        <>
            <a style={{
                display: ishover() ? "inline" : "none"
            }}
               href="https://discord.com/oauth2/authorize?client_id=1208380910525743134&response_type=token&redirect_uri=https%3A%2F%2Fexhq.dev%2Freview%2F&scope=identify">
                <p class="fadein">add your reviews here</p>
            </a>
            <h1 class="reviewheadertext">Reviews</h1>
            <div
                class="actualreviewdiv">
                {reviews().length > 0 ? (
                    reviews().reverse().map((review) => (
                        <div>
                            <SingleReview {...review} />
                        </div>
                    ))
                ) : (
                    <div>Loading reviews...</div>
                )}
            </div>
        </>

    )
}


export const theImager = async (id: string): Promise<string> => (await fetch(`https://dc-lookup.spiro.exhq.dev/v1/user/${id}`)
    .then(res => res.json()).then(data => "https://proxy.spiro.exhq.dev/_/plain/"+data.avatar.link).catch(() => "https://http.cat/status/100"));

function SingleReview(props: NeoReview) {
    const [imageSrc, setImageSrc] = createSignal("");

    onMount(async () => {
        const url = await theImager(props.discordID);
        setImageSrc(url);
    });

    return (
        <div class="singlereview">
            <img
                src={imageSrc()}
                alt="User Avatar"
                style={{"max-width": "3em", "border-radius": "30%"}}
            />
            <div class="reviewinfo">
                <div class="reviewname">
                    {props.global_name === null ? props.username : props.global_name}
                </div>
                <div class="reviewtext">{props.reviewText}</div>
            </div>
        </div>
    );
}

export async function sendReview(review: string, token: string): Promise<boolean> {
    try {
        const response = await fetch(`https://review.exhq.dev/sendreview?review=${review}`, {
            headers: {
                "Auth": token,
            },
            method: "POST"
        });

        if (response.status !== 200) {
            return false;
        }

        return true;
    } catch (error) {
        return false;
    }
}