Add tablo deletion feature

xtablo-expo/app/(home)/(tabs)/planning.tsx

@@ -166,7 +166,6 @@ export default function PlanningScreen() {
       Alert.alert("Erreur", "Veuillez sélectionner un tablo");
       return;
     }
-    console.log({ newEvent });
     createEvent({
       ...newEvent,
       start_date: newEvent.start_date,

xtablo-expo/app/(home)/(tabs)/tablos.tsx

@@ -16,7 +16,7 @@ import {
   Platform,
 } from "react-native";
 import { LinearGradient } from "expo-linear-gradient";
-import { useCreateTablo, useTablosList } from "@/hooks/tablos";
+import { useCreateTablo, useTablosList, useDeleteTablo } from "@/hooks/tablos";
 import { UserTablo } from "@/types/tablos.types";
 import {
   Plus,
@@ -30,7 +30,6 @@ import {
 } from "lucide-react-native";
 import { router } from "expo-router";
 import { AVAILABLE_COLORS, ColorMap } from "@/constants/colors";
-import { useAuth } from "@/stores/auth";
 
 const { width } = Dimensions.get("window");
 const numColumns = 2;
@@ -46,6 +45,7 @@ export default function TablosScreen() {
   const [refreshing, setRefreshing] = useState(false);
   const [isCreateModalVisible, setIsCreateModalVisible] = useState(false);
   const { mutate: createTablo } = useCreateTablo();
+  const { mutate: deleteTablo } = useDeleteTablo();
 
   const [newTablo, setNewTablo] = useState<{
     name: string;
@@ -156,6 +156,33 @@ export default function TablosScreen() {
     });
   };
 
+  const handleDeleteTablo = (tablo: UserTablo) => {
+    // Only allow admin users to delete tablos
+    if (!tablo.is_admin) {
+      Alert.alert(
+        "Non autorisé",
+        "Seuls les administrateurs peuvent supprimer ce tablo."
+      );
+      return;
+    }
+
+    Alert.alert(
+      "Supprimer le tablo",
+      `Êtes-vous sûr de vouloir supprimer "${tablo.name}" ? Cette action est irréversible.`,
+      [
+        {
+          text: "Annuler",
+          style: "cancel",
+        },
+        {
+          text: "Supprimer",
+          style: "destructive",
+          onPress: () => deleteTablo(tablo.id),
+        },
+      ]
+    );
+  };
+
   const renderTabloCard = ({ item: tablo }: { item: UserTablo }) => {
     const initials = tablo.name?.charAt(0)?.toUpperCase() || "T";
 
@@ -166,6 +193,7 @@ export default function TablosScreen() {
           { width: viewMode === "grid" ? itemWidth : "100%" },
         ]}
         onPress={() => navigateToTablo(tablo)}
+        onLongPress={() => handleDeleteTablo(tablo)}
         activeOpacity={0.8}
       >
         {/* Tablo Image/Color Header */}
@@ -249,6 +277,7 @@ export default function TablosScreen() {
       <TouchableOpacity
         style={styles.listItem}
         onPress={() => navigateToTablo(tablo)}
+        onLongPress={() => handleDeleteTablo(tablo)}
         activeOpacity={0.8}
       >
         <View
@@ -663,8 +692,8 @@ const styles = StyleSheet.create({
     flex: 1,
     backgroundColor: "#f8fafc",
     marginTop: -10,
-    borderTopLeftRadius: 20,
-    borderTopRightRadius: 20,
+    borderTopLeftRadius: 10,
+    borderTopRightRadius: 10,
     paddingTop: 10,
   },
   listContent: {

xtablo-expo/hooks/tablos.ts

@@ -50,3 +50,30 @@ export const useCreateTablo = () => {
     },
   });
 };
+
+// Delete tablo (soft delete)
+export const useDeleteTablo = () => {
+  const session = useAuth((state) => state.session);
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (id: string) => {
+      await api.delete("/api/v1/tablos/delete", {
+        data: { id },
+        headers: {
+          Authorization: `Bearer ${session?.access_token}`,
+        },
+      });
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ["tablos"] });
+    },
+    onError: (error) => {
+      console.error(error);
+      Alert.alert(
+        "Erreur",
+        "Impossible de supprimer le tablo. Veuillez réessayer."
+      );
+    },
+  });
+};