fix: refine permission request flow with a new tracking ref, replacing an alert with a console warning for denied permissions.

Author: Exo1i

src/components/ui/TweetComposer.tsx

@@ -131,7 +131,6 @@ export default function TweetComposer({
         mediaTypes: ['images', 'videos'],
         allowsMultipleSelection: true,
         selectionLimit: 4 - selectedAssets.length,
-        allowsEditing: true,
         quality: 1,
         videoMaxDuration: 140,
         exif: false,
@@ -279,7 +278,6 @@ export default function TweetComposer({
       const result = await ImagePicker.launchCameraAsync({
         mediaTypes: ['images'],
         quality: 1,
-        allowsEditing: true,
         exif: false,
       });
 

src/hooks/useMediaLibrary.ts

@@ -4,13 +4,18 @@ import { Platform } from 'react-native';
 
 import * as MediaLibrary from 'expo-media-library';
 
+const hasMediaPermission = (response: MediaLibrary.PermissionResponse | null): boolean => {
+  return response?.granted ?? false;
+};
+
 export function useMediaLibrary() {
   const [albums, setAlbums] = useState<MediaLibrary.Album[] | null>(null);
   const [assets, setAssets] = useState<MediaLibrary.Asset[]>([]);
   const [loading, setLoading] = useState(false);
   const [hasNextPage, setHasNextPage] = useState(false);
   const [permissionResponse, requestPermission] = MediaLibrary.usePermissions();
   const loadingRef = useRef(false);
+  const hasRequestedPermission = useRef(false);
 
   const fetchAlbums = useCallback(
     async (options: MediaLibrary.AlbumsOptions = { includeSmartAlbums: true }) => {
@@ -21,13 +26,19 @@ export function useMediaLibrary() {
 
       try {
         let response = permissionResponse;
-        if (!response || response.status !== 'granted') response = await requestPermission();
+        // Only request permission if we haven't already and user can be asked
+        if (!hasMediaPermission(response) && !hasRequestedPermission.current) {
+          if (!response || response.canAskAgain !== false) {
+            hasRequestedPermission.current = true;
+            response = await requestPermission();
+          }
+        }
 
-        if (response?.granted) {
+        if (hasMediaPermission(response)) {
           const fetchedAlbums = await MediaLibrary.getAlbumsAsync(options);
           setAlbums(fetchedAlbums);
         } else {
-          alert('Permission denied');
+          console.warn('Media library permission not granted');
         }
       } catch (error) {
         console.error('Error fetching albums:', error);
@@ -46,11 +57,15 @@ export function useMediaLibrary() {
       setLoading(true);
       try {
         let response = permissionResponse;
-        if (!response || response.status !== 'granted') {
-          response = await requestPermission();
+        // Only request permission if we haven't already and user can be asked
+        if (!hasMediaPermission(response) && !hasRequestedPermission.current) {
+          if (!response || response.canAskAgain !== false) {
+            hasRequestedPermission.current = true;
+            response = await requestPermission();
+          }
         }
 
-        if (response?.granted) {
+        if (hasMediaPermission(response)) {
           const result = await MediaLibrary.getAssetsAsync(options);
 
           // On iOS, convert ph:// URIs to file:// URIs for React Native Image component