import Main from "@/templates/Main"
import RecentEdits from "@/containers/RecentEdits"
import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card"

import { Button } from "@/components/ui/button"
export default function Home() {
   return (
      <>
         <Main pageTitle="Home">
            <div className="flex-1 flex flex-col overflow-auto">
               <div className="@container/main flex flex-col">
                  <div className="p-4 lg:p-6 flex flex-1">
                     <div className="border w-full">
                        <div className="border-b py-2 px-4 lg:px-6 bg-sidebar">
                           <h2 className="scroll-m-20 font-semibold">Welcome</h2>
                        </div>
                        <div className="p-4 lg:p-6">
                           <p className="leading-7 [&:not(:first-child)]:mt-6 font-normal">
                              <HoverCard>
                                 <HoverCardTrigger asChild>
                                    <Button
                                       variant="outline"
                                       size="sm"
                                       className="rounded-none mr-1 font-normal text-base"
                                    >
                                       Eólas
                                    </Button>
                                 </HoverCardTrigger>
                                 <HoverCardContent className="w-70 rounded-none">
                                    <div className="flex justify-between gap-4">
                                       <div className="space-y-1">
                                          <h4 className="text-sm font-semibold">🇮🇪</h4>
                                          <p className="text-sm">
                                             Irish for "knowledge", especially knowledge gained
                                             through practical experience.
                                          </p>
                                       </div>
                                    </div>
                                 </HoverCardContent>
                              </HoverCard>
                              is{" "}
                              <a
                                 className="text-black underline-offset-3 font-medium underline hover:text-gray-700"
                                 href="#"
                              >
                                 my
                              </a>{" "}
                              technical knowledge management system, or "second-brain", comprising
                              notes from the study of software engineering and computer science.
                           </p>
                        </div>
                     </div>
                  </div>

                  {/*
									
									<div className="bg-muted rounded-none p-3 font-medium text-sm text-muted-foreground my-4 mb-6">
										<p className="">
											{" "}
											<span className="mr-2">🇮🇪</span> "Eólas" is Irish for "knowledge",
											especially knowledge gained through practical experience.
										</p>
									</div>


I'm
                              <a
                                 className="text-black underline-offset-3 font-medium underline hover:text-gray-700"
                                 href="#"
                              >
                                 Thomas
                              </a>
                              .


									*/}
                  <div className="px-4 lg:px-6 flex-1 flex">
                     <RecentEdits />
                  </div>
               </div>
            </div>
         </Main>
      </>
   )
}