mostafa-mansour1/previewAnyFile

Bug: ERROR Class not found On Android (Capacitor 3)

AdlerJS opened this issue · 3 comments

AdlerJS commented

When using on Capacitor 3 for Android I am getting the following error in the logcat console. Line 34005 - Msg: ERROR Class not found

I am using React and Capacitor 3 to implement the plugin which is working as expected on IOS but throws the error above on Android. Below is the custom hook that wraps this plugin.

const useNativeFilePreview = ({ fileId, isVault, workspaceId }) => {
  const [isLoading, setIsLoading] = useState(false);
  const isNative = Capacitor.isNativePlatform();
  const queryClient = useQueryClient();
  const toast = useToast();

  const fileContentArgs = isVault
    ? { queryClient, fileId }
    : { queryClient, fileId, workspaceId };

  const onSuccess = () => {
    setIsLoading(false);
  };

  const onError = (e) => {
    console.log('ERROR', e);
    toast({
      title: 'Error Opening File Note',
      description: 'Any error occured during preview.',
      status: 'error',
      duration: TOAST_DURATION,
      isClosable: true,
    });
    setIsLoading(false);
  };

  const previewNativeFile = async (fileName) => {
    if (isNative && !CACHE[fileName]) {
      setIsLoading(true);
      const fileContent = await downloadFileContents(fileContentArgs);
      const response = await fetch(fileContent);
      const blob = await response.blob();
      const result = await write_blob({
        path: fileName,
        blob: blob,
        directory: Directory.Cache,
      });
      console.log('FILE DL -- WRITE', result);
      CACHE[fileName] = result;
      await window.PreviewAnyFile.previewPath(onSuccess, onError, result);
    } else if (isNative && CACHE[fileName]) {
      await window.PreviewAnyFile.previewPath(
        onSuccess,
        onError,
        CACHE[fileName]
      );
    }
  };

  return { previewNativeFile, isLoading };
};

export default useNativeFilePreview;

I have been unable to trace down where exactly the error is occurring or what is causing it. However I can confirm it happens on the await window.PreviewAnyFile.previewPath(onSuccess, onError, result); line

AdlerJS commented

I was able to solve it right after adding this issue but going to leave the solution below.

Step 1:
Make sure to add the required dependencies. via NPM install

    "cordova-plugin-androidx": "^3.0.0",
    "cordova-plugin-androidx-adapter": "^1.1.3",

Step 2:
If using capacitor since the Ionic Native package has not been updated you need to add the following to your android config.xml

    <feature name="PreviewAnyFile">
        <param name="android-package" value="com.mostafa.previewanyfile.PreviewAnyFile"/>
    </feature>
AdlerJS commented

Closing this issue has the solution above should solve it for most users. Hopefully once Ionic Native update gets released the Step 2 will not be required. Thanks for the plugin!

mostafa-mansour1 commented