feat: added filter live and all sorted ps alphabetically

app/(tabs)/index.tsx

@@ -20,12 +20,14 @@ export default function HomeScreen() {
   const { shows, error, loading } = useShowContext();
   const { streamingServices } = useStreamingServiceContext();
   const [filteredShows, setFilteredShows] = React.useState(shows);
+  const [activeFilter, setActiveFilter] = React.useState<string>("all");
 
   React.useEffect(() => {
     setFilteredShows(shows);
   }, [shows]);
 
   const handleFilter = (type: string) => {
+    setActiveFilter(type);
     if (type === "all") {
       setFilteredShows(shows);
       return;
@@ -90,6 +92,38 @@ export default function HomeScreen() {
                 marginLeft: 10,
               }}
             >
+              {activeFilter !== "all" && (
+                <TouchableOpacity
+                  style={{
+                    padding: 2,
+                    height: 50,
+                    width: 50,
+                    alignItems: "center",
+                    justifyContent: "center",
+                    backgroundColor: "hsl(221, 39%, 80%)",
+                    borderRadius: 50,
+                  }}
+                  onPress={() => handleFilter("all")}
+                >
+                  <Text>ALLE</Text>
+                </TouchableOpacity>
+              )}
+
+              <TouchableOpacity
+                style={{
+                  padding: 2,
+                  height: 50,
+                  width: 50,
+                  alignItems: "center",
+                  justifyContent: "center",
+                  backgroundColor: "hsl(221, 39%, 80%)",
+                  borderRadius: 50,
+                }}
+                onPress={() => handleFilter("live")}
+              >
+                <Text>LIVE</Text>
+              </TouchableOpacity>
+
               {uniqueStreamingServices.map((serviceName) => {
                 const streamingService =
                   streamingServices[