ගොනු වලංගුකරණය

Dropup සම්පූර්ණ ගොනු වලංගුකරණයක් ලබා දෙයි, වලංගු ගොනු පමණක් පිළිගැනීම සහතික කරයි.

වලංගුකරණ විකල්ප

Accept (ගොනු වර්ග)

පිළිගන්නා ගොනු වර්ග නියම කරන්න:

// Images පමණක් පිළිගන්න
useDropup({ accept: 'image/*' });

// නිශ්චිත වර්ග පිළිගන්න
useDropup({ accept: 'image/png, image/jpeg' });

// Extension අනුව පිළිගන්න
useDropup({ accept: '.pdf, .doc, .docx' });

// බහු ප්‍රවර්ග
useDropup({ accept: ['image/*', 'application/pdf', '.txt'] });

පොදු Accept Patterns

Pattern	විස්තරය
image/*	සියලුම images
image/png, image/jpeg	PNG සහ JPEG පමණි
video/*	සියලුම videos
audio/*	සියලුම audio files
application/pdf	PDF ගොනු පමණි
.doc, .docx	Word documents
*/*	සියලුම ගොනු (පෙරනිමි)

ගොනු ප්‍රමාණ සීමා

useDropup({
  maxSize: 10 * 1024 * 1024, // 10MB උපරිම
  minSize: 1024,              // 1KB අවම
});

ගොනු ගණන සීමාව

useDropup({
  maxFiles: 5, // උපරිම ගොනු 5
});

Image Dimension සීමා

useDropup({
  accept: 'image/*',
  maxWidth: 4096,   // Pixels වලින් උපරිම width
  maxHeight: 4096,  // Pixels වලින් උපරිම height
  minWidth: 100,    // Pixels වලින් අවම width
  minHeight: 100,   // Pixels වලින් අවම height
});

Custom Validation Rules

Custom validation logic සාදන්න:

useDropup({
  customRules: [
    // Rule 1: ගොනු නාම දිග පරීක්ෂා කරන්න
    (file) => {
      if (file.name.length > 100) {
        return 'ගොනු නාමය අක්ෂර 100 ට වඩා අඩු විය යුතුයි';
      }
      return true;
    },

    // Rule 2: නිශ්චිත content පරීක්ෂා කරන්න
    (file) => {
      if (file.name.includes('draft')) {
        return 'Draft ගොනු අවසර නැත';
      }
      return true;
    },

    // Rule 3: Async validation
    async (file) => {
      const hash = await calculateHash(file);
      const exists = await checkDuplicate(hash);
      if (exists) {
        return 'මෙම ගොනුව දැනටමත් upload කර ඇත';
      }
      return true;
    },
  ],
});

Rule Return Values

Return Value	අර්ථය
true	වලංගුකරණය සාර්ථකයි
false	වලංගුකරණය අසාර්ථකයි (පොදු error)
string	Custom message සමඟ වලංගුකරණය අසාර්ථකයි

Validation Errors හැසිරවීම

onValidationError callback භාවිතා කරන්න:

useDropup({
  accept: 'image/*',
  maxSize: 5 * 1024 * 1024,
  onValidationError: (errors) => {
    errors.forEach(({ file, errors: fileErrors }) => {
      console.log(`${file.name} validation අසාර්ථකයි:`);
      fileErrors.forEach(error => console.log(`  - ${error}`));
    });

    // පරිශීලකයාට පණිවිඩයක් පෙන්වන්න
    toast.error(`ගොනු ${errors.length}ක් validation අසාර්ථකයි`);
  },
});

Validation Error ව්‍යුහය

interface ValidationError {
  file: File;              // අසාර්ථක ගොනුව
  errors: string[];        // Error පණිවිඩ array
}

Pre-built Validation Rules

Dropup පොදු validation rules ඇතුළත්:

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

useDropup({
  customRules: [
    commonRules.noExecutables,     // .exe, .bat, ආදිය block කරන්න
    commonRules.noHiddenFiles,     // . න් ආරම්භ වන ගොනු block කරන්න
    commonRules.maxFilenameLength(50),
    commonRules.allowedExtensions(['.jpg', '.png', '.pdf']),
  ],
});

Drag Validation Feedback

Drag අතරතුර visual feedback ලබා දෙන්න:

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>
  );
}

සම්පූර්ණ Validation උදාහරණය

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,

    // Image dimensions (images සඳහා පමණි)
    maxWidth: 8000,
    maxHeight: 8000,

    // Custom rules
    customRules: [
      commonRules.noExecutables,
      commonRules.maxFilenameLength(100),

      // Custom: spaces ඇති ගොනු නැත
      (file) => {
        if (file.name.includes(' ')) {
          return 'ගොනු නාමවල spaces තිබිය නොහැක';
        }
        return true;
      },
    ],

    // Error handling
    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>
  );
}