feat(artboard): implement 8 new templates

apps/client/src/pages/builder/sidebars/left/index.tsx

@@ -2,7 +2,7 @@ import { Plus, PlusCircle } from "@phosphor-icons/react";
 import {
   Award,
   Certification,
-  CustomSectionItem,
+  CustomSection,
   Education,
   Experience,
   Interest,
@@ -172,7 +172,7 @@ export const LeftSidebar = () => {
             <Fragment key={section.id}>
               <Separator />
 
-              <SectionBase<CustomSectionItem>
+              <SectionBase<CustomSection>
                 id={`custom.${section.id}`}
                 title={(item) => item.name}
                 description={(item) => item.description}

apps/client/src/pages/builder/sidebars/right/sections/template.tsx

@@ -19,7 +19,7 @@ export const TemplateSection = () => {
       </header>
 
       <main className="grid grid-cols-2 gap-4">
-        {templatesList.map(({ id, name, image }) => (
+        {templatesList.map(({ id, name }) => (
           <HoverCard key={id} openDelay={0} closeDelay={0}>
             <HoverCardTrigger asChild>
               <Button
@@ -35,7 +35,12 @@ export const TemplateSection = () => {
             </HoverCardTrigger>
 
             <HoverCardContent className="max-w-xs overflow-hidden border-none bg-white p-0">
-              <img alt={name} src={image} loading="lazy" className="aspect-[1/1.4142]" />
+              <img
+                alt={name}
+                loading="lazy"
+                src="/templates/sample.jpg"
+                className="aspect-[1/1.4142]"
+              />
             </HoverCardContent>
           </HoverCard>
         ))}

apps/client/src/pages/builder/sidebars/right/sections/typography.tsx

@@ -75,6 +75,8 @@ export const TypographySection = () => {
               disabled={typography.font.family === font}
               onClick={() => {
                 setValue("metadata.typography.font.family", font);
+                setValue("metadata.typography.font.subset", "latin");
+                setValue("metadata.typography.font.variants", ["regular"]);
               }}
               className={cn(
                 "flex h-12 items-center justify-center overflow-hidden rounded border text-center text-sm ring-primary transition-colors hover:bg-secondary-accent focus:outline-none focus:ring-1 disabled:opacity-100",