feat: unauthenticated tab

src/screens/Playbacks/components/CommentsPanel.web.js

@@ -31,6 +31,7 @@ import { Palette } from "../../../styles";
 import { FONT_FAMILY } from "../../../styles/Fonts";
 import { size } from "../../../styles/Style";
 import { getArtistDisplayName } from "../../../utils/artistName";
+import { ensureAuthenticated } from "../../../utils/authRedirect";
 
 moment.locale("fr");
 
@@ -58,6 +59,10 @@ const CommentsPanel = ({
   );
   const [text, setText] = useState("");
   const scrollRef = useRef(null);
+  const requireAuth = useCallback(
+    () => ensureAuthenticated(currentUID),
+    [currentUID]
+  );
 
   useEffect(() => {
     setText("");
@@ -111,7 +116,8 @@ const CommentsPanel = ({
 
   const onSend = useCallback(async () => {
     const value = (text || "").trim();
-    if (!value || !projectId || !currentUID) return;
+    if (!value || !projectId) return;
+    if (!requireAuth()) return;
     try {
       setText("");
       const docRef = await projectsRef
@@ -153,6 +159,7 @@ const CommentsPanel = ({
     currentUserData,
     onCommentAdded,
     projectId,
+    requireAuth,
     setComments,
     text,
   ]);
@@ -226,23 +233,42 @@ const CommentsPanel = ({
           <TextInput
             ref={inputRef}
             value={text}
-            onChangeText={setText}
+            onChangeText={(value) => {
+              if (!requireAuth()) {
+                return;
+              }
+              setText(value);
+            }}
             placeholder={
               canComment
                 ? "Commente"
                 : "Connecte-toi pour laisser un commentaire"
             }
             placeholderTextColor="#FFFFFF90"
-            editable={canComment}
+            editable
+            onFocus={() => {
+              if (!requireAuth()) {
+                try {
+                  inputRef.current?.blur?.();
+                } catch (_e) {}
+              }
+            }}
+            onPressIn={() => {
+              if (!requireAuth()) {
+                try {
+                  inputRef.current?.blur?.();
+                } catch (_e) {}
+              }
+            }}
             style={[styles.commentInput, !canComment && { opacity: 0.6 }]}
           />
           <Pressable
             onPress={onSend}
-            disabled={!canComment || !text.trim()}
+            disabled={!text.trim()}
             style={({ pressed }) => [
               styles.sendButton,
-              (!canComment || !text.trim()) && styles.sendButtonDisabled,
-              pressed && canComment && styles.sendButtonPressed,
+              !text.trim() && styles.sendButtonDisabled,
+              pressed && text.trim() && styles.sendButtonPressed,
             ]}
           >
             <Image

src/screens/Playbacks/components/PlaybackItem.web.js

@@ -29,6 +29,7 @@ import {
   LIKE_TARGET,
   toggleProjectLike,
 } from "../../../utils/likes";
+import { ensureAuthenticated } from "../../../utils/authRedirect";
 import {
   createPlaybackSharePayload,
   openShareSheet,
@@ -427,10 +428,19 @@ const PlaybackItem = ({
                     />
                   )}
                 </Pressable>
-                {owner?.id && currentUID && owner.id !== currentUID && (
+                {owner?.id && owner.id !== currentUID && (
                   <Pressable
                     style={styles.followPressable}
                     onPress={async () => {
+                      if (
+                        !ensureAuthenticated(currentUID, {
+                          onIntercept: () => {
+                            setIsFollowing(false);
+                          },
+                        })
+                      ) {
+                        return;
+                      }
                       try {
                         const next = !isFollowing;
                         setIsFollowing(next);
@@ -465,7 +475,10 @@ const PlaybackItem = ({
               <Pressable
                 onPress={async () => {
                   try {
-                    if (!currentUID || !item?.id) return;
+                    if (!item?.id) return;
+                    if (!ensureAuthenticated(currentUID)) {
+                      return;
+                    }
                     const nextLiked = !isLiked;
                     setIsLiked(nextLiked);
                     setLikesCount((c) => Math.max(0, c + (nextLiked ? 1 : -1)));