style: added ShowCard component

app/(tabs)/index.tsx

@@ -1,24 +1,24 @@
+import styles from "@/app/styles/indexStyles";
+import ShowCard from "@/components/ui/ShowCard";
+import { router } from "expo-router";
 import React from "react";
-import { Text, View, Image } from "react-native";
-import styles from "@/app/indexStyles";
+import { Text, View } from "react-native";
 
 export default function HomeScreen() {
   return (
     <View style={styles.mainContainer}>
       <View style={styles.header}>
         <Text style={styles.title}>FLTR</Text>
-        <View
-          style={{
-            flexDirection: "row",
-            alignItems: "center",
-            backgroundColor: "red",
-            width: "75%",
-          }}
-        >
-          <Text style={styles.categoryLabel}>Live TV</Text>
-          <Text>Hello</Text>
-        </View>
       </View>
+
+      <ShowCard
+        onPress={() => router.push("/showDetails")}
+        imageUri="https://streamcoimg-a.akamaihd.net/000/123/147/123147-Banner-L2-b81d3e6b4df34af2887f701eec382f87.jpg"
+        streamingServiceUri="https://play-lh.googleusercontent.com/e8u4F0ED6hDMzmjg5cV_C5Sxrzr3xECniwKCD2Q8QfUeVMVRLG41TrsnqroTE7uxk4E=w240-h480-rw"
+        liveBadgeText="LIVE"
+        liveBadgeContainerStyle={styles.liveBadgeContainer}
+        genres={["Reality", "Dating"]}
+      />
     </View>
   );
 }