[dyad] Adding a tracking tab to show tracking tools - wrote 4 file(s)

src/components/meta-form.tsx

@@ -16,6 +16,7 @@ import { AnalysisTab } from "./analysis-tab";
 import { SocialTab } from "./social-tab";
 import { LinksDisplay } from "./links-display";
 import { SystemDisplay } from "./system-display";
+import { TrackingDisplay } from "./tracking-display";
 import type { MetaData } from "@/lib/types";
 
 export function MetaForm() {
@@ -130,6 +131,10 @@ export function MetaForm() {
     const systemColor: IndicatorColor =
       metaData.systems && metaData.systems.length > 0 ? "green" : "gray";
 
+    // Tracking Tab
+    const trackingColor: IndicatorColor =
+      metaData.trackers && metaData.trackers.length > 0 ? "green" : "gray";
+
     return {
       analysis: analysisColor,
       headlines: headlinesColor,
@@ -139,6 +144,7 @@ export function MetaForm() {
       faq: faqColor,
       schema: schemaColor,
       system: systemColor,
+      tracking: trackingColor,
     };
   }, [metaData, editableTitle, editableDescription]);
 
@@ -236,6 +242,12 @@ export function MetaForm() {
                 System
               </TabsTrigger>
             )}
+            {metaData.trackers && metaData.trackers.length > 0 && (
+              <TabsTrigger value="tracking">
+                {tabColors && <TabIndicator color={tabColors.tracking} />}
+                Tracking
+              </TabsTrigger>
+            )}
             {metaData.faq && metaData.faq.length > 0 && (
               <TabsTrigger value="faq">
                 {tabColors && <TabIndicator color={tabColors.faq} />}
@@ -331,6 +343,12 @@ export function MetaForm() {
               <SystemDisplay systems={metaData.systems} />
             </TabsContent>
           )}
+
+          {metaData.trackers && metaData.trackers.length > 0 && (
+            <TabsContent value="tracking">
+              <TrackingDisplay trackers={metaData.trackers} />
+            </TabsContent>
+          )}
         </Tabs>
       )}
     </div>