import { RouterLink } from "vue-router";
import useHead from "@/useHead.ts";
import DjTooltip from "@/DjTooltip.tsx";

export default {
    name: "ge-main",
    setup() {
        useHead({ title: "Generative Energy" });
        return () => (
            <>
                <header>
                    <h1>Generative Energy</h1>
                </header>
                <div class="text-slab">
                    <p>
                        This page is dedicated to Dr. Raymond Peat († 2022), who has had a profound impact on my health
                        and my life in general. Hover over the links below for more detail.
                    </p>
                </div>
                <h2>Projects</h2>
                <div class="text-slab">
                    <ul>
                        <li>
                            <DjTooltip tooltip="Convert to and from grains, set ratios, etc.">
                                <RouterLink to={{ name: "GECalculator" }}>Thyroid Calculator</RouterLink>
                            </DjTooltip>
                        </li>
                        <li>
                            <DjTooltip tooltip="A selection of articles by Ray that I have translated in my spare time into German.">
                                <RouterLink to={{ name: "GEDeutsch" }}>Ray Peat Articles in German</RouterLink>
                            </DjTooltip>
                        </li>
                    </ul>
                </div>
                <h2>Links</h2>
                <div class="text-slab">
                    <ul>
                        <li>
                            <DjTooltip tooltip="Full text search of the majority of Ray's interviews. Extremely helpful and fun to use.">
                                <a href="https://bioenergeic.life">bioenergetic.life - A Ray Peat Search Engine</a>
                            </DjTooltip>
                        </li>
                        <li>
                            <DjTooltip tooltip="Ray's original website with articles and bookstore">
                                <a href="https://raypeat.com">raypeat.com</a>
                            </DjTooltip>
                        </li>
                    </ul>
                </div>
            </>
        );
    },
};
