Change main page and modify flows

src/components/modal/PlaylistModal.js

@@ -1,4 +1,4 @@
-import React, { useRef, useState } from "react";
+import React, { useMemo, useRef, useState } from "react";
 import {
   Dimensions,
   FlatList,
@@ -33,6 +33,13 @@ const PlaylistModal = (props) => {
   const startAtCreate = props?.payload?.startAtCreate || false;
   const { setTooltip } = useMinuit();
 
+  const isDuplicateName = useMemo(() => {
+    const lower = (playlist || "").trim().toLowerCase();
+    if (!lower) return false;
+    const list = Array.isArray(userPlaylists) ? userPlaylists : [];
+    return list.some((p) => (p?.name || "").trim().toLowerCase() === lower);
+  }, [playlist, JSON.stringify(userPlaylists)]);
+
   return (
     <AppActionSheet id="Playlist">
       <SwiperFlatList
@@ -106,9 +113,8 @@ const PlaylistModal = (props) => {
                       musics: arrayUnion(projectId),
                       updatedAt: new Date(),
                     });
-                    const addedPlaylist = (Array.isArray(userPlaylists)
-                      ? userPlaylists
-                      : []
+                    const addedPlaylist = (
+                      Array.isArray(userPlaylists) ? userPlaylists : []
                     ).find((p) => p?.id === selectedId);
                     const name = addedPlaylist?.name || "la playlist";
                     setTooltip({
@@ -118,7 +124,10 @@ const PlaylistModal = (props) => {
                   }
                 } catch (e) {
                   console.log("Add to playlist error", e?.message);
-                  setTooltip({ type: "error", text: e?.message || "Ajout impossible" });
+                  setTooltip({
+                    type: "error",
+                    text: e?.message || "Ajout impossible",
+                  });
                 } finally {
                   SheetManager.hide("Playlist");
                 }
@@ -160,6 +169,7 @@ const PlaylistModal = (props) => {
                 Nommer la playlist
               </Text>
               <TextInput
+                autoFocus={true}
                 style={{
                   paddingVertical: 6,
                   borderBottomWidth: 1,
@@ -174,6 +184,18 @@ const PlaylistModal = (props) => {
                 onChangeText={setPlaylist}
                 textAlign="center"
               />
+              {isDuplicateName && (
+                <Text
+                  style={{
+                    fontSize: 12,
+                    color: Palette.red,
+                    fontFamily: FONT_FAMILY.InterRegular,
+                    textAlign: "center",
+                  }}
+                >
+                  Ce nom de playlist existe déjà
+                </Text>
+              )}
             </View>
             <GradientButton
               title={isCreating ? "Création..." : "Créer la playlist"}
@@ -188,6 +210,18 @@ const PlaylistModal = (props) => {
                 try {
                   setIsCreating(true);
                   const name = playlist.trim();
+                  const lower = name.toLowerCase();
+                  // Unicité du nom pour l'utilisateur courant (insensible à la casse)
+                  const exists = (
+                    Array.isArray(userPlaylists) ? userPlaylists : []
+                  ).some((p) => (p?.name || "").trim().toLowerCase() === lower);
+                  if (exists) {
+                    setTooltip({
+                      type: "error",
+                      text: "Ce nom de playlist existe déjà",
+                    });
+                    return;
+                  }
                   await createPlaylist({
                     createdBy: currentUID,
                     name,
@@ -208,7 +242,10 @@ const PlaylistModal = (props) => {
                   scrollRef.current.scrollToIndex({ index: 0, animated: true });
                 } catch (e) {
                   console.log(e);
-                  setTooltip({ type: "error", text: e?.message || "Création impossible" });
+                  setTooltip({
+                    type: "error",
+                    text: e?.message || "Création impossible",
+                  });
                 } finally {
                   setIsCreating(false);
                 }