I want to add a view button to preview existing files( mockfile ) . For example, when I want to modify a form, the files are displayed in the dropzone, so I want to preview them. this is my code:

`var myDropzone2 = new Dropzone(“#dataListUpload_modif”, {
url: “../app/controler/update_contact.php “,
parallelUploads: 3,
uploadMultiple: true,
autoProcessQueue: false,
dictRemoveFile: ‘Supprimer le fichier’,
addRemoveLinks: true,
autoQueue:true,
clickable: true,
removedfile: function (file) {

    // only show swal dialog if file is being removed manually
swal({
  title: "Suppression?",
  text: "Etes vous sûr de vouloir supprimer ce fichier?",
  icon: "warning",
  buttons: true,
  dangerMode: true,
})
.then((willDelete) => {
  if (willDelete) {
    console.log(file);
    $.ajax({
      type: "POST",
      url: "../app/controler/deleteDoc.php",
      data: {
        'name': file.name
        
      },
      cache: false,
      success: function (result) {
        file.previewElement.remove();
      }
    });
  }
});

},
init: function() {

    console.log('test');
    var mocks  = <?php echo json_encode($documents);  ?>;
    for (var i = 0; i < mocks.length; i++) {
    var mock = mocks[i];
    var mockFile = {
    name: mocks[i].titre,
    size: mocks[i].taille,
    id: mocks[i].id,
    url: mocks[i].chemin
};
    console.log(mockFile);
    var viewButton = Dropzone.createElement("<div class='column'><span class='btn btn-primary btn-xs pull-right view'>view</span></div>");
   // this.files.push(mockFile);
    this.emit('addedfile', mockFile, mock.chemin);
    this.createThumbnailFromUrl(mockFile, mock.chemin);
    this.emit('complete', mockFile);
  
  


}`

I tried to preview files existing on the server. For example, when I want to modify a form, the files are displayed in the dropzone, so I want to preview them.