/**
 *
 * PDF Viewer
 *
 * @author Ashique Mohammed
 */

import React, { useEffect, useState } from 'react';

import { Viewer, Worker } from '@react-pdf-viewer/core';

import { defaultLayoutPlugin } from '@react-pdf-viewer/default-layout';

import '@react-pdf-viewer/default-layout/lib/styles/index.css';

// Import the styles
import '@react-pdf-viewer/core/lib/styles/index.css';

import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.entry';

/**
 * @param {Object}root0
 * @param root0.url
 * @param root0.defaultScale
 * @param root0.props
 * @returns {JSX.Element}  JSX content
 */
export default function PdfViewer({ url, defaultScale, ...props }) {
  // Default layout
  const defaultLayoutPluginInstance = defaultLayoutPlugin();

  const [defaultValue, setDefaultValue] = useState(1.0);

  useEffect(() => {
    if (defaultScale) {
      setDefaultValue(defaultScale);
    }
  }, [defaultScale]);

  //
  return (
    <>
      <Worker workerUrl={pdfjsWorker}>
        <div className="pdf-viewer-container">
          <Viewer
            fileUrl={url}
            plugins={[defaultLayoutPluginInstance]}
            {...props}
            /**setting default actual size ie, 100% for zoom property */
            defaultScale={defaultValue}
          />
        </div>
      </Worker>
    </>
  );
}
