adicionando camada para salvar foto

src/screens/Home/index.tsx

 import React from "react";
 import { StatusBar } from 'expo-status-bar';
-import { useState } from 'react';
+import { useState, useRef } from 'react';
 import { StyleSheet, View, Text } from "react-native";
 import { Container, ImageContainer, FooterContainer, OptionsContainer, OptionsRow } from "./styles";
 import ImageViewer from "../../components/ImageViewer";
@@ -9,11 +9,15 @@ import * as ImagePicker from 'expo-image-picker';
 import IconButton from '../../components/IconButton';
 import { IconButtonContainer } from "../../components/IconButton/styles";
 import CircleButton from "../../components/CircleButton";
+import * as MediaLibrary from 'expo-media-library';
+import { captureRef } from 'react-native-view-shot';
 
 
 const PlaceholderImage = require('../../../assets/images/background.png');
 
 export function Home() {
+    const imageRef = useRef<View>(null);
+
     const onReset = () => {
         setShowAppOptions(false);
     };
@@ -23,9 +27,22 @@ export function Home() {
     };
 
     const onSaveImageAsync = async () => {
-        // we will implement this later
-    };
+        try {
+          const localUri = await captureRef(imageRef, {
+            height: 440,
+            quality: 1,
+          });
+    
+          await MediaLibrary.saveToLibraryAsync(localUri);
+          if (localUri) {
+            alert("Saved!");
+          }
+        } catch (e) {
+          console.log(e);
+        }
+      };
 
+    const [status, requestPermission] = MediaLibrary.usePermissions();
     const [selectedImage, setSelectedImage] = useState<string | null>(null);
     const [showAppOptions, setShowAppOptions] = useState(false);
     const pickImageAsync = async () => {
@@ -41,12 +58,17 @@ export function Home() {
             alert('Você não selecionou nenhuma foto.');
         }
     };
+    if (status === null) {
+      requestPermission();
+    }
     return (
         <Container>
             <ImageContainer>
-                <ImageViewer placeholderImageSource={PlaceholderImage}
-                    selectedImage={selectedImage}>
-                </ImageViewer>
+                <View ref={imageRef} collapsable={false}>
+                    <ImageViewer placeholderImageSource={PlaceholderImage}
+                        selectedImage={selectedImage}>
+                    </ImageViewer>
+                </View>
             </ImageContainer>
             {showAppOptions ? (
                 <View style={styles.optionsContainer}>