Notable TA section created

src/layouts/taSection.astro

@@ -1,13 +1,20 @@
 ---
 export interface Props {
 	title: string;
+    abovetext?: string;
 }
 
-const { title } = Astro.props;
+const { abovetext, title } = Astro.props;
+let h2text;
+if (abovetext === undefined) {
+    h2text = "The full list of my completed TAs can be found on my Youtube channel."
+} else {
+    h2text = ""
+}
 ---
 <div>
     <h1>{title}</h1>
-    <h2>The full list of my completed TAs can be found on my Youtube channel. This is only a small selection of the most notable TAs</h2>
+    <h2>{h2text}</h2>
     <div class="container ta-container">
         <slot />
     </div>

src/pages/ta-collection.astro

@@ -11,10 +11,18 @@ import TaSection from '../layouts/taSection.astro';
 import TaCard from '../components/taCard.astro';
 import tadata from '../../static/_tadata.json'
 
+const important_data = tadata.filter(function (el) {
+  return ["Ibuki 3T (Lostbelt 5.5)", "DB 7T (No Duplicates)", "Kingprotea 1T"].includes(el.title);
+});
+
+
 const description = "A collection of TAs previously completed be Firq."
 ---
 
 <Layout title="TA Collection - Firq FGO Site" currentpage="ta-collection" descriptionOverride={description}>
+	<TaSection title="Notable TAs" abovetext="">
+		{important_data.map((item) => (<TaCard {...item}/>))}
+	</TaSection>
     <TaSection title="Completed TAs">
 		{tadata.map((item) => (<TaCard {...item}/>))}
 	</TaSection>