Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory :  /home/gositeme/domains/lavocat.quebec/private_html/src/components/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

import React, { useEffect, useState } from 'react';
// import { Document, Page, pdfjs } from 'react-pdf';
// pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js
import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
import 'react-pdf/dist/esm/Page/TextLayer.css';
import path from 'path';

interface UnifiedDocumentViewerProps {
  url: string;
  type: string;
  name: string;
  status?: 'pending' | 'approved' | 'rejected';
  onApprove?: () => void;
  onReject?: () => void;
  onDelete?: () => void;
  isAdmin?: boolean;
}

const TEXT_TYPES = [
  'text/plain',
  'text/markdown',
  'text/csv',
  'application/json',
  'text/x-log',
  'text/x-yaml',
  'text/yaml',
  'text/xml',
  'application/xml',
  'text/html',
  'text/css',
  'text/javascript',
  'application/javascript',
  'application/typescript',
  'text/typescript',
];
const TEXT_EXTENSIONS = [
  '.txt', '.md', '.csv', '.log', '.json', '.ts', '.js', '.css', '.html', '.xml', '.yaml', '.yml'
];

const UnifiedDocumentViewer: React.FC<UnifiedDocumentViewerProps> = ({ url, type, name, status, onApprove, onReject, onDelete, isAdmin }) => {
  const [textContent, setTextContent] = useState<string | null>(null);
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);

  // Helper to check if file is text-based
  const isTextFile = () => {
    const ext = name ? name.slice(name.lastIndexOf('.')).toLowerCase() : '';
    return TEXT_TYPES.includes(type) || TEXT_EXTENSIONS.includes(ext);
  };

  useEffect(() => {
    if (isTextFile()) {
      setLoading(true);
      setError(null);
      fetch(url)
        .then(res => {
          if (!res.ok) throw new Error('Failed to fetch file');
          return res.text();
        })
        .then(setTextContent)
        .catch(e => setError(e.message))
        .finally(() => setLoading(false));
    }
  }, [url, type, name]);

  if (isTextFile()) {
    if (loading) return <div className="p-8 text-center text-gray-500">Loading preview...</div>;
    if (error) return <div className="p-8 text-center text-red-600">Failed to load file: {error}</div>;
    return (
      <div className="p-4 max-h-[70vh] overflow-auto bg-gray-900 text-gray-100 rounded-lg shadow-inner border border-gray-300 text-left">
        <pre className="whitespace-pre-wrap break-words text-sm font-mono">{textContent}</pre>
      </div>
    );
  }

  return (
    <div className="p-8 text-center text-red-600 font-bold">
      PDF viewing is temporarily disabled for stability. Please contact the admin if you need this feature re-enabled.<br />
      <span className="block mt-2 text-gray-500">Preview not available for this file type.</span>
      {isAdmin && <div className="mt-4 text-sm">Admin mode: {name}</div>}
    </div>
  );
};

export default UnifiedDocumentViewer;