affilaites page meta tags (#1367)

* affilaites page meta tags

* Update affiliates.py

---------

Co-authored-by: pourhakimi <[email protected]>
Co-authored-by: Alek Petuskey <[email protected]>

Author: LineIndent

assets/previews/affiliates_preview.png

@@ -7,35 +7,26 @@
 from pcweb.pages.framework.views.footer_index import footer_index
 from pcweb.pages.hosting.views.features import grid
 
-numbers = {
-    "1": """
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
-            <path d="M10.5 8.5L12.5 7V17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
-            <path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
-            </svg>
-            """,
-    "2": """
-           <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none" class="text-purple-10">
-    <path d="M9 10C9 8.34315 10.3431 7 12 7C13.6569 7 15 8.34315 15 10C15 12.0786 12.1196 13.9172 10.3503 14.8505C9.54685 15.2743 9 16.0917 9 17H15" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-    <path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-</svg>
-           
-           """,
-    "3": """
-    
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
-    <path d="M12.5 12H11.5M12.5 12C13.8807 12 15 10.8807 15 9.5C15 8.11929 13.8807 7 12.5 7H11.5C10.1193 7 9 8.11929 9 9.5M12.5 12C13.8807 12 15 13.1193 15 14.5C15 15.8807 13.8807 17 12.5 17H11.5C10.1193 17 9 15.8807 9 14.5" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-    <path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-</svg>
-    """,
-    "4": """
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
-    <path d="M15 7V12.5M15 12.5V17M15 12.5H9.43601C9.19521 12.5 9 12.3048 9 12.064C9 12.0216 9.00619 11.9794 9.01839 11.9387L10.5 7" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-    <path d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
-</svg>
-    
-    """,
-}
+
+meta_tags = [
+    {"property": "og:url", "content": "https://reflex.dev/affiliates/"},
+    {"property": "og:type", "content": "website"},
+    {"property": "og:title", "content": "Reflex Affiliates · Earn by sharing Reflex"},
+    {
+        "property": "og:description",
+        "content": "Join the Reflex affiliate program and earn rewards today.",
+    },
+    {"property": "og:image", "content": "/previews/affiliates_preview.png"},
+    {"name": "twitter:card", "content": "summary_large_image"},
+    {"property": "twitter:domain", "content": "reflex.dev"},
+    {"property": "twitter:url", "content": "https://reflex.dev/affiliates/"},
+    {"name": "twitter:title", "content": "Reflex Affiliate Program"},
+    {
+        "name": "twitter:description",
+        "content": "Join the Reflex affiliate program and earn rewards today.",
+    },
+    {"name": "twitter:image", "content": "/previews/affiliates_preview.png"},
+]
 
 
 def affiliates_title():
@@ -73,14 +64,6 @@ def step_box(step_number: str) -> rx.Component:
     """Helper function to create a step number box with consistent styling."""
     return rx.box(
         rx.box(
-            # rx.text(
-            #     f"Step {step_number}",
-            #     class_name="text-md text-center text-slate-10",
-            # ),
-            # rx.html(
-            #     numbers[step_number],
-            #     filter=rx.color_mode_cond("", "invert(0.85)"),
-            # ),
             color=rx.color("accent", 5),
             class_name="w-full h-[5rem] flex items-center justify-center p-3 col-start-2 row-span-full row-start-1 bg-[size:10px_10px] bg-fixed bg-[image:repeating-linear-gradient(315deg,currentColor_0,currentColor_1px,_transparent_0,_transparent_50%)]",
         ),
@@ -190,7 +173,11 @@ def features_small_screen():
     )
 
 
-@rx.page(route="/affiliates", title="Affiliates · Reflex")
+@rx.page(
+    route="/affiliates",
+    title="Affiliates · Reflex",
+    meta=meta_tags,
+)
 def affiliates() -> rx.Component:
     return rx.box(
         index_colors(),