Bootstrap & Jquery Modal Window - Update content

One option is to load the images with an id (I suppose it is in num). The delete and download buttons put data-idImagen and assign the same value as the id of the image. You already have a way to relate them. Now, in the javascript code, you retrieve the data-id and put it in the variable idImagen . And in the success of ajax you put the selector by id and assign it the .remove() method.

You have the code below:

Javascript

  $('.btn-image-library').click(function () {
        var idImagen = $(this).data().idImagen
        var cod = $('#editCodi').val();
        var src = $(this).closest('.box-image-library').find('.image-library').attr('src');
        var action = $(this).text();
        var filename = $(this).closest('.box-image-library').find('.text-descripcio-image-library').text();
        if (action == 'delete') {

            // Delete image
            $.ajax({
                url: "deleteImagesManageProduct.php",
                type: "POST",
                data: {"filename": filename, "codigo": cod},
                dataType: "text",
                success: function (data) {
                    $("#" + idImagen).remove()
                    // AQUÍ ACTUALIZAR CONTENIDO MODAL ¿?
                }
            });
        }
    });

HTML

<!-- MANAGE IMAGES MODAL MENU -->

    <div class="modal fade" id="manageImagesProduct" tabindex="-1" role="dialog" aria-labelledby="change" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
                <h4 class="modal-title custom_align" id="Heading">Gestió Imatges</h3>
            </div>
            <div class="modal-body">
                <div class="">
                    <?php
                    //  Load Images
                    $query = "SELECT t1.num, t1.imagen
                                    FROM imatges AS t1
                                    WHERE t1.codigo = '{$_GET['cod']}'
                                    ORDER BY t1.num";

                    $result = dbQuery($conn, $query);

                    while ($row = pg_fetch_row($result)){
                    ?>
                    <div class="box-image-library">

                        <img class="image-library" src='<?php echo $row[1];?>' id='<?php echo $row['num'];?>'/>

                        <div class="btn-image-library-delete">
                            <button class='btn-image-library' id='deleteImage' data-idImagen='<?php echo $row['num'];?>'><i class="material-icons" style="font-size: 20px">delete</i>
                            </button>
                            <button class='btn-image-library' id='downloadImage' data-idImagen='<?php echo $row['num'];?>'><i class="material-icons" style="font-size: 20px">file_download</i>
                            </button>
                        </div>
                        <div class="box-text-image-library">
                            <span class="text-descripcio-image-library"><?php echo $row[1]; ?></span>
                        </div>

The problem is that you drew the images directly via PHP, a simple solution would be by adding an ID to each image container at the time of drawing.

I will make a small assumption that row[0] returns the id of the row or primary key, modifying the code a bit would be left.

<?php
//  Load Images
$query = "SELECT t1.num, t1.imagen
        FROM imatges AS t1
        WHERE t1.codigo = '{$_GET['cod']}'
        ORDER BY t1.num";

$result = dbQuery($conn, $query);

while ($row = pg_fetch_row($result)){
    ?>
    <div class="box-image-library" id="img_<?php echo $row[0];?>">

        <img class="image-library" src='<?php echo $row[1];?>' id='fileImage'/>

        <div class="btn-image-library-delete">
            <button class='btn-image-library' id='deleteImage' onClick="borrarImagen('<?php echo $row[0];?>', '<?php echo $row[1];?>')"><i class="material-icons" style="font-size: 20px">delete</i></button>
            <button class='btn-image-library' id='downloadImage'><i class="material-icons" style="font-size: 20px">file_download</i></button>
        </div>

        <div class="box-text-image-library">
            <span class="text-descripcio-image-library"><?php echo $row[1]; ?></span>
        </div>

    </div>
    <?php
}
?>

then the delete function, modified a bit, would look like this:

function borrarImagen(id, path) {
    let cod = $('#editCodi').val();
    let filename = path;
    $.ajax({
        url:"deleteImagesManageProduct.php",
        type:"POST",
        data:{"filename": filename, "codigo": cod},
        dataType:"text",
        success:function(data){
            $('img_${id}').remove();
        }
    });
}

Finally, with this, and you can remove the html using $ .remove () depending on your approach, you can also look for div father but it seems cumbersome.