feat: improve torrent management functionality and UI

- Extract torrent list query to a reusable hook in queries.ts
- Add delete torrent functionality to details page
- Implement pull-to-refresh on torrent details screen
- Add open in browser capability for unrestricted links
- Improve magnet screen with clear button and reset functionality
- Refactor torrent list screen to use the extracted query

Author: gitfudge0

android/app/build.gradle

@@ -93,8 +93,8 @@ android {
         applicationId 'com.gitfudge.kaizoku'
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 1
-        versionName "1.0.0"
+        versionCode 2
+        versionName "1.1.0"
     }
     buildFeatures {
         buildConfig true

api/queries.ts

@@ -0,0 +1,8 @@
+import { useQuery } from "@tanstack/react-query";
+import { api } from "./methods";
+
+export const torrentListQuery = () =>
+  useQuery({
+    queryKey: ["torrents"],
+    queryFn: () => api.getTorrents(),
+  });

app/(details)/[id].tsx

@@ -3,9 +3,9 @@ import UnrestrictModel from "@/models/Unrestrict.model";
 import { colors } from "@/theme/colors";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 import { useMutation, useQuery } from "@tanstack/react-query";
-import { Stack, useLocalSearchParams } from "expo-router";
+import { router, Stack, useLocalSearchParams } from "expo-router";
 import React, { useCallback, useEffect, useState } from "react";
-import { ScrollView, StyleSheet, View } from "react-native";
+import { Linking, RefreshControl, ScrollView, StyleSheet, View } from "react-native";
 import BackgroundService from "react-native-background-actions";
 import RNFS from "react-native-fs";
 import {
@@ -19,6 +19,7 @@ import {
   requestNotificationPermission,
   requestStoragePermission,
 } from "@/utils/deviceMethods";
+import { torrentListQuery } from "@/api/queries";
 
 interface DownloadProgress {
   [key: string]: {
@@ -49,12 +50,19 @@ export default function TorrentDetailsScreen() {
   >({});
   const [downloads, setDownloads] = useState<DownloadProgress>({});
   const [activeDownloads, setActiveDownloads] = useState<number>(0);
+  const [refreshing, setRefreshing] = useState(false);
 
   // Fetch torrent details
-  const { data: torrent, isLoading } = useQuery({
+  const { data: torrent, isLoading, refetch } = useQuery({
     queryKey: ["torrent", id],
     queryFn: () => api.getTorrentInfo(id),
   });
+  
+  const onRefresh = useCallback(async () => {
+    setRefreshing(true);
+    await refetch();
+    setRefreshing(false);
+  }, [refetch]);
 
   // Load cached unrestricted links
   useEffect(() => {
@@ -91,6 +99,24 @@ export default function TorrentDetailsScreen() {
     };
   }, [id]);
 
+  const deleteMutation = useMutation({
+    mutationFn: () => api.deleteTorrent(id),
+    onSuccess: () => {
+      Toast.show({
+        type: "success",
+        text1: "Deleted",
+      });
+      const { refetch: torrentRefetch } = torrentListQuery();
+      torrentRefetch();
+      router.push("/(tabs)");
+    },
+    onError: () => {
+      Toast.show({
+        type: "error",
+        text1: "Error in deleting",
+      });
+    },
+  });
   const unrestrictMutation = useMutation({
     mutationFn: async (links: string[]) => {
       const results = await Promise.all(
@@ -169,6 +195,17 @@ export default function TorrentDetailsScreen() {
       text2: item.filename,
     });
   }, []);
+  
+  const handleOpenInBrowser = useCallback((item: UnrestrictModel.UnrestrictedItem) => {
+    Linking.openURL(item.download).catch(err => {
+      console.error("Failed to open URL:", err);
+      Toast.show({
+        type: "error",
+        text1: "Failed to open URL",
+        text2: err.message,
+      });
+    });
+  }, []);
 
   const downloadTask = async (taskDataArguments: any) => {
     console.log("Background task started with args:", taskDataArguments);
@@ -386,7 +423,17 @@ export default function TorrentDetailsScreen() {
           },
         }}
       />
-      <ScrollView style={styles.container}>
+      <ScrollView 
+        style={styles.container}
+        refreshControl={
+          <RefreshControl
+            refreshing={refreshing}
+            onRefresh={onRefresh}
+            colors={[colors.primary]}
+            tintColor={colors.primary}
+          />
+        }
+      >
         <View style={styles.header}>
           <Text style={styles.filename}>{torrent.filename}</Text>
           <Text style={styles.details} variant="bodyMedium">
@@ -398,6 +445,13 @@ export default function TorrentDetailsScreen() {
           <Text style={styles.details} variant="bodyMedium">
             Progress: {torrent.progress}%
           </Text>
+          <Button
+            mode="contained"
+            style={styles.deleteButton}
+            onPress={() => deleteMutation.mutate()}
+          >
+            Delete torrent
+          </Button>
         </View>
 
         <View style={styles.content}>
@@ -447,6 +501,14 @@ export default function TorrentDetailsScreen() {
                     </View>
                     {unrestrictedData && (
                       <View style={styles.linkActions}>
+                        <IconButton
+                          icon="open-in-new"
+                          mode="outlined"
+                          iconColor="#fff"
+                          size={22}
+                          style={styles.iconOnlyButton}
+                          onPress={() => handleOpenInBrowser(unrestrictedData)}
+                        />
                         {unrestrictedData.streamable === 1 && (
                           <IconButton
                             icon="play"
@@ -634,4 +696,7 @@ const styles = StyleSheet.create({
     color: "#fff",
     marginBottom: 8,
   },
+  deleteButton: {
+    width: 150,
+  },
 });

app/(tabs)/index.tsx

@@ -2,47 +2,15 @@ import { FlashList } from "@shopify/flash-list";
 import { StyleSheet, View } from "react-native";
 import { ActivityIndicator, Text } from "react-native-paper";
 import { useRouter } from "expo-router";
-import Toast from "react-native-toast-message";
 import { TorrentListItem } from "@/components/TorrentItem";
-import { AddMagnetModal } from "../../components/AddMagnetModal";
 import { colors } from "../../theme/colors";
-import { api } from "@/api/methods";
-import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
-import { useState } from "react";
+import { useEffect } from "react";
+import { torrentListQuery } from "@/api/queries";
 
 export default function TorrentScreen() {
-  const queryClient = useQueryClient();
   const router = useRouter();
-  const [modalVisible, setModalVisible] = useState(false);
 
-  const {
-    data: torrents,
-    isLoading,
-    refetch,
-  } = useQuery({
-    queryKey: ["torrents"],
-    queryFn: () => api.getTorrents(),
-  });
-
-  const addMagnetMutation = useMutation({
-    mutationFn: (magnet: string) => api.addMagnet(magnet),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ["torrents"] });
-      setModalVisible(false);
-      Toast.show({
-        type: "success",
-        text1: "Success",
-        text2: "Magnet link added successfully",
-      });
-    },
-    onError: (error) => {
-      Toast.show({
-        type: "error",
-        text1: "Error",
-        text2: error.message,
-      });
-    },
-  });
+  const { data: torrents, isLoading, refetch } = torrentListQuery();
 
   if (isLoading) {
     return (
@@ -77,11 +45,6 @@ export default function TorrentScreen() {
         onRefresh={refetch}
         refreshing={isLoading}
       />
-      <AddMagnetModal
-        visible={modalVisible}
-        onDismiss={() => setModalVisible(false)}
-        onSubmit={(magnet) => addMagnetMutation.mutate(magnet)}
-      />
     </View>
   );
 }
@@ -95,6 +58,7 @@ const styles = StyleSheet.create({
     flex: 1,
     justifyContent: "center",
     alignItems: "center",
+    backgroundColor: colors.background,
   },
   list: {
     padding: 16,

app/(tabs)/magnet.tsx

@@ -61,12 +61,6 @@ export default function MagnetScreen() {
     },
   });
 
-  useEffect(() => {
-    if (torrentInfo?.files) {
-      setSelectedFiles(new Set(torrentInfo.files.map((f) => f.id)));
-    }
-  }, [torrentInfo]);
-
   const handleSubmit = () => {
     if (!magnetLink.trim()) {
       setError("Please enter a magnet link");
@@ -105,6 +99,26 @@ export default function MagnetScreen() {
     isLoadingInfo ||
     selectFilesMutation.isPending;
 
+  useEffect(() => {
+    if (torrentInfo?.files) {
+      setSelectedFiles(new Set(torrentInfo.files.map((f) => f.id)));
+    }
+  }, [torrentInfo]);
+
+  const resetPage = () => {
+    setMagnetLink("");
+    setError("");
+    setSelectedFiles(new Set());
+    setTorrentId(null);
+    addMagnetMutation.reset();
+  };
+
+  useEffect(() => {
+    return () => {
+      resetPage();
+    };
+  }, []);
+
   return (
     <>
       <Stack.Screen
@@ -126,6 +140,15 @@ export default function MagnetScreen() {
             disabled={isLoading}
             style={styles.input}
             textColor={colors.onSurface}
+            right={
+              magnetLink ? (
+                <TextInput.Icon
+                  icon="close-circle"
+                  onPress={resetPage}
+                  forceTextInputFocus={false}
+                />
+              ) : null
+            }
             theme={{
               colors: {
                 onSurfaceVariant: colors.onSurface, // Make label more visible

package.json

@@ -1,7 +1,7 @@
 {
   "name": "kaizoku",
   "main": "expo-router/entry",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "scripts": {
     "start": "expo start",
     "reset-project": "node ./scripts/reset-project.js",