expo DocumentPicker is not selecting any document

I am new to React native i have a problem withe the expo DocumentPicker for some reason the DocumentPicker does not select any file, and it always shows that Selected Document: None

import React, { useState } from "react";
import { Button, StyleSheet, Text, View } from "react-native";
import * as DocumentPicker from "expo-document-picker";

export default function App() {
const [document, setDocument] = useState(null);

const pickDocument = async () => {
const result = await DocumentPicker.getDocumentAsync({ type: 'application/pdf' });
if (result.type === "success") {
setDocument(result);
}
};

return (


Selected Document: {document ? document.name : "None"}



);
}

const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: "center",
justifyContent: "center",
padding: 20,
},
paragraph: {
marginTop: 24,
fontSize: 18,
fontWeight: "bold",
textAlign: "center",
},
});