फाइल सत्यापन

Dropup यह सुनिश्चित करने के लिए व्यापक फाइल सत्यापन प्रदान करता है कि केवल वैध फाइलें ही स्वीकार की जाएं।

सत्यापन विकल्प

Accept (फाइल प्रकार)

निर्दिष्ट करें कि कौन से फाइल प्रकार स्वीकार करने हैं:

// केवल छवियां स्वीकार करें
useDropup({ accept: 'image/*' });

// विशिष्ट प्रकार स्वीकार करें
useDropup({ accept: 'image/png, image/jpeg' });

// एक्सटेंशन द्वारा स्वीकार करें
useDropup({ accept: '.pdf, .doc, .docx' });

// एकाधिक श्रेणियां
useDropup({ accept: ['image/*', 'application/pdf', '.txt'] });

सामान्य Accept पैटर्न

पैटर्न	विवरण
image/*	सभी छवियां
image/png, image/jpeg	केवल PNG और JPEG
video/*	सभी वीडियो
audio/*	सभी ऑडियो फाइलें
application/pdf	केवल PDF फाइलें
.doc, .docx	Word दस्तावेज़
*/*	सभी फाइलें (डिफ़ॉल्ट)

फाइल आकार सीमाएं

useDropup({
  maxSize: 10 * 1024 * 1024, // अधिकतम 10MB
  minSize: 1024,              // न्यूनतम 1KB
});

फाइल संख्या सीमा

useDropup({
  maxFiles: 5, // अधिकतम 5 फाइलें
});

छवि आयाम सीमाएं

useDropup({
  accept: 'image/*',
  maxWidth: 4096,   // पिक्सेल में अधिकतम चौड़ाई
  maxHeight: 4096,  // पिक्सेल में अधिकतम ऊंचाई
  minWidth: 100,    // पिक्सेल में न्यूनतम चौड़ाई
  minHeight: 100,   // पिक्सेल में न्यूनतम ऊंचाई
});

कस्टम सत्यापन नियम

कस्टम सत्यापन लॉजिक बनाएं:

useDropup({
  customRules: [
    // नियम 1: फाइल नाम की लंबाई जांचें
    (file) => {
      if (file.name.length > 100) {
        return 'फाइल का नाम 100 वर्णों से कम होना चाहिए';
      }
      return true;
    },

    // नियम 2: विशिष्ट सामग्री की जांच करें
    (file) => {
      if (file.name.includes('draft')) {
        return 'ड्राफ्ट फाइलों की अनुमति नहीं है';
      }
      return true;
    },

    // नियम 3: एसिंक सत्यापन
    async (file) => {
      const hash = await calculateHash(file);
      const exists = await checkDuplicate(hash);
      if (exists) {
        return 'यह फाइल पहले ही अपलोड हो चुकी है';
      }
      return true;
    },
  ],
});

नियम रिटर्न मान

रिटर्न मान	अर्थ
true	सत्यापन पास
false	सत्यापन विफल (सामान्य त्रुटि)
string	कस्टम संदेश के साथ सत्यापन विफल

सत्यापन त्रुटियों को हैंडल करना

onValidationError कॉलबैक का उपयोग करें:

useDropup({
  accept: 'image/*',
  maxSize: 5 * 1024 * 1024,
  onValidationError: (errors) => {
    errors.forEach(({ file, errors: fileErrors }) => {
      console.log(`${file.name} सत्यापन में विफल:`);
      fileErrors.forEach(error => console.log(`  - ${error}`));
    });

    // उपयोगकर्ता-अनुकूल संदेश दिखाएं
    toast.error(`${errors.length} फाइल(ें) सत्यापन में विफल`);
  },
});

सत्यापन त्रुटि संरचना

interface ValidationError {
  file: File;              // विफल फाइल
  errors: string[];        // त्रुटि संदेशों की सरणी
}

पहले से बने सत्यापन नियम

Dropup में सामान्य सत्यापन नियम शामिल हैं:

import { commonRules } from '@samithahansaka/dropup';

useDropup({
  customRules: [
    commonRules.noExecutables,     // .exe, .bat, आदि ब्लॉक करें
    commonRules.noHiddenFiles,     // . से शुरू होने वाली फाइलें ब्लॉक करें
    commonRules.maxFilenameLength(50),
    commonRules.allowedExtensions(['.jpg', '.png', '.pdf']),
  ],
});

ड्रैग सत्यापन फीडबैक

ड्रैग के दौरान विजुअल फीडबैक प्रदान करें:

function DropZone() {
  const { getDropProps, state } = useDropup({
    accept: 'image/*',
  });

  // state.isDragAccept - फाइलें accept मानदंड से मेल खाती हैं
  // state.isDragReject - फाइलें मेल नहीं खातीं

  return (
    <div
      {...getDropProps()}
      style={{
        borderColor: state.isDragAccept
          ? 'green'
          : state.isDragReject
          ? 'red'
          : 'gray',
      }}
    >
      {state.isDragReject && <p>फाइल प्रकार स्वीकार नहीं है!</p>}
    </div>
  );
}

पूर्ण सत्यापन उदाहरण

import { useDropup, commonRules } from '@samithahansaka/dropup';

function SecureUploader() {
  const { files, state, getDropProps, getInputProps } = useDropup({
    // फाइल प्रकार
    accept: ['image/jpeg', 'image/png', 'application/pdf'],

    // आकार सीमाएं
    maxSize: 10 * 1024 * 1024, // 10MB
    minSize: 100,              // 100 bytes (खाली फाइलें रोकें)

    // संख्या सीमा
    maxFiles: 10,

    // छवि आयाम (केवल छवियों के लिए)
    maxWidth: 8000,
    maxHeight: 8000,

    // कस्टम नियम
    customRules: [
      commonRules.noExecutables,
      commonRules.maxFilenameLength(100),

      // कस्टम: स्पेस वाली फाइलें नहीं
      (file) => {
        if (file.name.includes(' ')) {
          return 'फाइल नामों में स्पेस नहीं हो सकते';
        }
        return true;
      },
    ],

    // त्रुटि हैंडलिंग
    onValidationError: (errors) => {
      errors.forEach(({ file, errors }) => {
        alert(`${file.name}: ${errors.join(', ')}`);
      });
    },
  });

  return (
    <div
      {...getDropProps()}
      className={`dropzone ${
        state.isDragReject ? 'reject' : state.isDragAccept ? 'accept' : ''
      }`}
    >
      <input {...getInputProps()} />
      {state.isDragReject ? (
        <p>कुछ फाइलें अस्वीकार की जाएंगी</p>
      ) : (
        <p>फाइलें यहां ड्रॉप करें (केवल JPEG, PNG, PDF, अधिकतम 10MB)</p>
      )}
    </div>
  );
}