В каком месте добавить object-fit: cover чтобы картинка при перетаскивании не растягивалась?

window.onload = function () {
    const MAX_FILES_COUNT = 8;
    let uploadImage = document.querySelector('#upload-image');

    if (uploadImage) {
        uploadImage.addEventListener('click', function (event) {
            let input = document.querySelector('#photos');
            input.click();
        });
    }

    function validateFile(file) {
        let types = (document.getElementById('photos').accept || '').split(/\s*,\s*/);

        for (let type of types) {
            if (file.type.match(type)) {
                return true;
            }
        }

        return false;
    }

    function findParentByClassName(element, className) {
        let el = element;
        do {
            if (el.classList.contains(className)) {
                return el;
            }
            el = el.parentElement;
        } while (el.parentElement !== document.body);
    }

    function appendPreview(result, file, i) {
        let preview = document.createElement('div');
        preview.classList.add('preview-item');
        preview.setAttribute('draggable', true);

        if (file) {
            file.preview = preview;
            preview.file = file;
        }

        let img = document.createElement('img');
        let removeBtn = document.createElement('div');
        let inputHidden = document.createElement('input');
        let iconClose = document.createElement('i');

        iconClose.classList.add('fa', 'fa-times');
        iconClose.id = 'icon-image';
        inputHidden.type = 'text';
        inputHidden.name = 'images[]';
        inputHidden.classList.add('hidden-field');
        removeBtn.classList.add('remove');
        removeBtn.classList.add('remove' + i);
        img.src = result;
        inputHidden.value = result;
        preview.appendChild(removeBtn);
        preview.appendChild(img);
        preview.appendChild(inputHidden);

        photo_previews.appendChild(preview);

        iconClose.addEventListener('click', function () {
            let div2 = document.getElementsByClassName('remove');
            div2.click();
        });

    }

    let input = document.querySelector('#photos');
    let photo_previews = document.querySelector('#photo_previews');
    let remove_all = document.querySelector('#remove_all');
    let inputs = document.querySelectorAll('input[name="images[]"]');
    let i = 0;

    for (let ii of inputs) {
        if (ii.value !== '') {
            appendPreview(ii.value, null, i);
        }

        ii.remove();
        i++;
    }

    if (photo_previews) {
        photo_previews.onclick = function (e) {
            if (findParentByClassName(e.target, 'remove')) {
                let files = Array.from(input.files);
                const dt = new DataTransfer();

                files = files.filter(file => {
                    return file.preview !== e.target.parentElement;
                });

                for (let file of files) {
                    dt.items.add(file);
                }

                input.files = dt.files;
                e.target.parentElement.remove();

                if (document.querySelectorAll('#photo_previews .preview-item').length === 0) {
                    remove_all.classList.remove('visible');
                }
            }
        };

        photo_previews.ondrag = function (e) {
            let previewItem = findParentByClassName(e.target, 'preview-item');
            if (previewItem) {
                const selectedItem = previewItem,
                    list = previewItem.parentNode,
                    x = e.clientX,
                    y = e.clientY;

                selectedItem.classList.add('drag-sort-active');

                let swapItem = document.elementFromPoint(x, y) === null ? selectedItem : document.elementFromPoint(x, y);

                if (swapItem.parentNode.classList.contains('preview-item')) {
                    if (previewItem !== swapItem.parentNode) {
                        let sw = findParentByClassName(swapItem, 'preview-item');
                        let se = findParentByClassName(selectedItem, 'preview-item');
                        sw = sw !== se.nextSibling ? sw : sw.nextSibling;
                        list.insertBefore(se, sw);
                    }
                }
            }
        };

        photo_previews.ondragend = function (e) {
            if (findParentByClassName(e.target, 'preview-item')) {
                let items = photo_previews.querySelectorAll('.preview-item');

                for (let i = 0; i < items.length; i++) {
                    items[i].classList.remove('drag-sort-active');
                }

                let resortedFiles = [].slice.call(document.querySelectorAll('#photo_previews .preview-item')).map((el) => el.file);

                const dt = new DataTransfer();
                for (let file of resortedFiles) {
                    dt.items.add(file);
                }
            }
        };

        ['dragover', 'dragenter'].forEach(function (event) {
            document.body.addEventListener(event, function () {
                photo_previews.classList.add('is-dragover');
            });
        });

        ['dragleave', 'dragend', 'drop'].forEach(function (event) {
            document.body.addEventListener(event, function () {
                photo_previews.classList.remove('is-dragover');
            });
        });
    }

    function processReader(file, i) {
        let reader = new FileReader();

        reader.onloadstart = function (e) {
            document.getElementById('progress_bar').className = 'loading';
        };

        reader.onloadend = (function (i, file) {
            return function () {
                let currentCount = document.querySelectorAll('#photo_previews .preview-item').length;
                if (currentCount > MAX_FILES_COUNT - 1) {
                    return;
                }

                appendPreview(reader.result, file, i);
            }
        }(i, file));
        reader.readAsDataURL(file);
    }

    document.body.addEventListener('drop', function (e) {
        let droppedFiles = e.dataTransfer.files; // the files that were dropped

        let i = 0;
        for (let file of droppedFiles) {

            if (!validateFile(file)) {
                continue;
            }

            processReader(file, i);
            i++;
        }
    });

    ['drag', 'dragend', 'dragover', 'dragenter', 'dragleave', 'drop'].forEach(function (event) {
        document.body.addEventListener(event, function (e) {
            // preventing the unwanted behaviours
            e.preventDefault();
            e.stopPropagation();
        });
    });

    let onchange = function () {
        if (this.files.length > MAX_FILES_COUNT) {
            const dt = new DataTransfer();

            for (let fi = 0; fi < MAX_FILES_COUNT; fi++) {
                dt.items.add(this.files[fi]);
            }

            this.files = dt.files;
        }

        [].slice.call(this.files).forEach(processReader);

        input.value = '';
    };

    if (input) {
        input.onchange = onchange;

        onchange.call(input);
    }
};

function setMainPhotoLabel() {
    document.querySelectorAll('.preview-item').forEach(function (el, i) {
        if (i > 0) {
            let label = el.querySelector('.main-photo-label');

            if (label) {
                label.remove();
            }
        }
    });

    let firstPreview = document.querySelector('.preview-item:first-child');

    if (!firstPreview) {
        requestAnimationFrame(setMainPhotoLabel);
        return;
    }

    let label = firstPreview.querySelector('.main-photo-label');

    if (label) {
        requestAnimationFrame(setMainPhotoLabel);
        return;
    }

    let span = document.createElement('span');

    span.classList.add('main-photo-label');
    span.innerText = 'Основное фото';
    firstPreview.appendChild(span);

    requestAnimationFrame(setMainPhotoLabel);
}

requestAnimationFrame(setMainPhotoLabel);

function toggleRemoveAllLink() {
    const previewItemLength = document.querySelectorAll('.preview-item').length;

    if (previewItemLength) {
        if (previewItemLength <= 1) {
            document.querySelector('#remove_all').classList.remove('visible');
        } else {
            document.querySelector('#remove_all').classList.add('visible');
        }
    }

    requestAnimationFrame(toggleRemoveAllLink);
}

requestAnimationFrame(toggleRemoveAllLink);

<div class="form-group row background-item">
    <label for="inputPassword3" class="col-sm-3 col-form-label">
        Фото
    </label>
    <div class="col-sm-9">
        <div id="upload-image">
            <img src="{{asset('images/icon/camera.svg')}}"alt="">
            <span>Добавить</span>
        </div>
        <input id="photos" type="file"
               accept="image/*"
               class="form-control{{ $errors->has('title') ? ' is-invalid' : '' }}" multiple
        >
        <div id="photo_previews"></div>
        <div id="progress_bar"></div>

        @if (old('images'))
            @for ($i = 0; $i < count(old('images')); $i++)
                <input type="text" class="hidden-field" name="images[]" value="{{ old('images.' . $i) }}" />
            @endfor
        @else
            @if (isset($photosBase64))
                @foreach($photosBase64 as $photo)
                    <input type="text" class="hidden-field" name="images[]" value="{{  $photo }}" />
                @endforeach
            @endif
        @endif
    </div>
    @if ($errors->has('images.0'))
        <div class="col-sm-3">
        </div>
        <div class="col-sm-9">
            <span class="invalid-feedback d-block"><strong>{{ $errors->first('images.0') }}</strong></span>
        </div>
    @endif
</div>

@import '../../../variables';

#photo_previews {
    display: flex;
    flex-wrap: wrap;

    .preview-item {
        width: 105px;
        height: 85px;
        margin: 15px 10px 30px 0;
        position: relative;
        text-align: center;

        img {
            height: 100%;
            width: 100%;
            object-fit: cover;

            &:hover {
                cursor: pointer;
            }
        }

        span {
            font-size: 10px;
        }

        .remove {
            position: absolute;
            right: 7px;
            top: 7px;
            width: 15px;
            height: 15px;
            background-color: $color-background;
            cursor: pointer;
            color: white;
            border-radius: 50%;
            display: flex;
            background-image: url(../../../../../public/images/icon/close.svg);
        }

        &.drag-sort-active {
            img, .remove {
                visibility: hidden;
            }
        }
    }

    .preview-item:nth-child(6),
    .preview-item:nth-child(7),
    .preview-item:nth-child(8),
    .preview-item:nth-child(9) {
        margin: 0 10px 5px 0;
    }
}

.hidden-field {
    visibility: hidden;
    height: 0;
    width: 0;
}

#upload-image {
    background-color: $color-background;
    width: 105px;
    height: 85px;
    border: 1px solid $color-border-input;
    display: grid;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    border-radius: 4px;

    img {
        width: 20px;
        margin: 0 auto;
    }

    span {
        font-size: 12px;
        margin-top: 5px;
    }

    &:hover {
        background-color: #f0f2ff;
        cursor: pointer;
    }
}

.main-photo-label {
    margin-right: 5px;
}

#photos {
    display: none;
}