Add different profile feed filters

src/app/(authenticated)/profile/[userId].tsx

···
 import Post from "@/src/components/Post";
 import { AppBskyLabelerDefs } from "@atcute/bluesky";
 import Animated, { interpolate, useAnimatedRef, useAnimatedStyle, useScrollOffset } from "react-native-reanimated";
+import { useState } from "react";
+
+type AuthorFeedFilters =
+  | "posts_with_replies"
+  | "posts_no_replies"
+  | "posts_with_media"
+  | "posts_and_author_threads"
+  | "posts_with_video";
 
 export default function Profile() {
   const { userId } = useLocalSearchParams<{ userId: string }>();
···
 
   const flashListRef = useAnimatedRef<FlashListRef<any>>();
   const scrollOffset = useScrollOffset(flashListRef);
+
+  const [feedFilter, setFeedFilter] = useState<AuthorFeedFilters>("posts_and_author_threads");
 
   const profileQuery = useQuery({
     queryKey: ["profile", userId],
···
   });
 
   const authorFeedQuery = useInfiniteQuery({
-    queryKey: ["authorFeed", userId],
+    queryKey: ["authorFeed", userId, feedFilter],
     initialPageParam: "",
     queryFn: async ({ signal, pageParam, queryKey }) => {
       const wrapper: FetchHandler = async (pathname, init) => {
···
         const res = await ok(
           client.get("app.bsky.feed.getAuthorFeed", {
             signal,
-            params: { actor: queryKey[1] as ActorIdentifier, cursor: pageParam, filter: "posts_and_author_threads" },
+            params: { actor: queryKey[1] as ActorIdentifier, cursor: pageParam, filter: queryKey[2] },
             headers: { "atproto-accept-labelers": labelersDids.join(", ") },
           })
         );
···
                             .filter((val) => val)}
                       </View>
                     )}
+                  </View>
+                  <View style={{ flexDirection: "row" }}>
+                    <Pressable
+                      style={{ padding: 8 }}
+                      onPress={() => {
+                        setFeedFilter("posts_and_author_threads");
+                      }}
+                    >
+                      <Text style={{ fontWeight: 700, color: colorScheme === "light" ? "black" : "white" }}>Posts</Text>
+                    </Pressable>
+
+                    <Pressable
+                      style={{ padding: 8 }}
+                      onPress={() => {
+                        setFeedFilter("posts_with_replies");
+                      }}
+                    >
+                      <Text style={{ fontWeight: 700, color: colorScheme === "light" ? "black" : "white" }}>
+                        Replies
+                      </Text>
+                    </Pressable>
+
+                    <Pressable
+                      style={{ padding: 8 }}
+                      onPress={() => {
+                        setFeedFilter("posts_with_media");
+                      }}
+                    >
+                      <Text style={{ fontWeight: 700, color: colorScheme === "light" ? "black" : "white" }}>Media</Text>
+                    </Pressable>
                   </View>
                 </View>
               );