Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Invariant Violation: requireNativeComponent: "RNPDFPdfView" was not found in the UIManager. #902

Open
gauraputu opened this issue Jan 5, 2025 · 1 comment

Comments

@gauraputu
Copy link

What react-native version are you using?
v0.69.3
What react-native-pdf version are you using?
v6.7.6
What platform does your issue occur on? (android/ios/both)
android
Describe your issue as precisely as possible :

  1. Steps to reproduce the issue or to explain in which case you get the issue
    run the code below on simulator
  2. Interesting logs
    no interesting logs

Join a screenshot or video of the problem on the simulator or device?
img-2025-01-05-21-41-12

Show us the code you are using?

import {
  StyleSheet,
  Text,
  TouchableOpacity,
  View,
  ActivityIndicator,
  Modal,
  Dimensions,
  Alert,
} from 'react-native';
import React, { useState, useEffect } from 'react';
import Pdf from 'react-native-pdf';
import { Buffer } from 'buffer';

const PdfViewerReactNativePdf = ({ isVisible, onClose }) => {
  const [pdfBase64, setPdfBase64] = useState(null);
  const fetchPdf = async () => {
    try {
      const response = await axiosInstance.get(
        `.....`,
        {
          responseType: 'arraybuffer',
        }
      );

      // Convert array buffer to base64
      const base64String = Buffer.from(response.data, 'binary').toString('base64');
      const pdfData = `data:application/pdf;base64,${base64String}`;
      setPdfBase64({uri: pdfData})
    } catch (error) {
      console.error('Error fetching document:', error);
      Alert.alert('Error', 'Failed to load document');
    }
  };

  useEffect(() => {
    if (isVisible) {
      fetchPdf();
    } else {
      setPdf(null); // Clear the PDF when modal closes
    }
  }, [isVisible]);


  return (
    <Modal visible={isVisible} onRequestClose={onClose} animationType="slide">
      <View style={styles.modalContainer}>
        <View style={styles.modalHeader}>
          <Text style={styles.modalTitle}>PDF Viewer</Text>
          <TouchableOpacity onPress={onClose} style={styles.closeButton}>
            <Text style={styles.closeButtonText}>Close</Text>
          </TouchableOpacity>
        </View>
        {pdfBase64 ? (
          <Pdf source={pdfBase64} style={styles.pdf} />
        ) : (
          <View style={styles.loadingContainer}>
            <ActivityIndicator size="large" color="#0000ff" />
            <Text style={styles.loadingText}>Loading PDF...</Text>
          </View>
        )}
      </View>
    </Modal>
  );
};
@mensonones
Copy link

try an earlier/smaller version

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants