import PageTemplate from "@/templates/PageTemplate"

const PageBody = () => {
   return (
      <div className="p-4 lg:p-6">
         <p className="leading-[1.5] mb-4 not-first:mt-4">
            Eólas is custom software I built because I wasn't happy with any of the main offerings
            that exist for publishing personal knowledge bases. It is a work in progress and there
            are several features I have yet to introduce.
         </p>

         <p className="leading-[1.5] mb-4 not-first:mt-4">
            Eólas is Irish for "knowledge" or "experience", gained through practice.
         </p>

         <p className="leading-[1.5] mb-4 not-first:mt-4">
            It is composed of several packages that combine to produce this interface:
         </p>

         <ul className="list-disc ml-10 mb-4 space-y-1">
            <li>
               <a
                  className="text-foreground font-medium underline-offset-4 underline hover:text-gray-700 dark:hover:text-green-300"
                  href="https://forgejo.systemsobscure.net/thomasabishop/eolas"
                  target="__blank"
               >
                  eolas
               </a>
            </li>
            <ul>
               <li className="text-sm">The raw Markdown files that I work with locally.</li>
            </ul>
            <li>
               <span>eolas-db</span>
            </li>
            <ul>
               <li className="text-sm">
                  A Python application that reads the local files, parses the content and metadata,
                  and enters the data into an SQLite database.
               </li>
            </ul>
            <li>
               <span>eolas-api</span>
            </li>
            <ul>
               <li className="text-sm">A NodeJS API that queries the SQLite database.</li>
            </ul>
            <li>
               <span>eolas-app</span>
            </li>
            <ul>
               <li className="text-sm">
                  This frontend created with React that provides the public interface.
               </li>
            </ul>
         </ul>

         <p className="leading-[1.5] mb-4 not-first:mt-4">
            The deployment of each sub-package is automated via Forgejo Actions. I also have a
            script that executes each time I push from{" "}
            <code className="rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm">
               eolas
            </code>{" "}
            to the remote. This updates the database and uploads the assets to a Garage S3 bucket.
         </p>

         <p className="leading-[1.5] mb-4 not-first:mt-4">
            Every aspect of the project, from the packages themselves to automation and version
            management and S3, is self-hosted, running on my Virtual Private Server.
         </p>

         <p>
            You can learn more about me at my website,{" "}
            <a
               className="text-foreground font-medium underline-offset-4 underline hover:text-gray-700 dark:hover:text-green-300"
               href="https://systemsobscure.blog"
               target="__blank"
            >
               Systems Obscure
            </a>
            .
         </p>
      </div>
   )
}

export default function About() {
   return <PageTemplate pageTitle="About" pageBody={<PageBody />} />
}