function updateProgressBar(item) {
    if (!item) return; // Handle case where the item is null or undefined

    let lastCompletedStep = null;

    document.querySelectorAll('.icon-container').forEach(container => {
        container.classList.remove('completed');
    });

    if (item.prCreatedDate) {
        document.getElementById('prCreatedDate-Label').innerHTML = item.prCreatedDate;
        document.querySelector('#step-prCreatedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-prCreatedDate';
    }
    if (item.prApprover1) {
        document.getElementById('prApprover1-Label').innerHTML = item.prApprover1;
        document.querySelector('#step-prApprover1 .icon-container').classList.add('completed');
        lastCompletedStep = 'step-prApprover1';
    }
    if (item.prApprover2) {
        document.getElementById('prApprover2-Label').innerHTML = item.prApprover2;
        document.querySelector('#step-prApprover2 .icon-container').classList.add('completed');
        lastCompletedStep = 'step-prApprover2';
    }
    if (item.canvassSubmitedDate) {
        document.getElementById('canvassSubmitedDate-Label').innerHTML = item.canvassSubmitedDate;
        document.querySelector('#step-canvassSubmitedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-canvassSubmitedDate';
    }
    if (item.suppBidDate) {
        document.getElementById('suppBidDate-Label').innerHTML = item.suppBidDate;
        document.querySelector('#step-suppBidDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-suppBidDate';
    }
    if (item.canvassApprovedDate) {
        document.getElementById('canvassApprovedDate-Label').innerHTML = item.canvassApprovedDate;
        document.querySelector('#step-canvassApprovedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-canvassApprovedDate';
    }
    if (item.poPreparationDate) {
        document.getElementById('poPreparationDate-Label').innerHTML = item.poPreparationDate;
        document.querySelector('#step-poPreparationDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-poPreparationDate';
    }
    if (item.poApprovedDate) {
        document.getElementById('poApprovedDate-Label').innerHTML = item.poApprovedDate;
        document.querySelector('#step-poApprovedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-poApprovedDate';
    }
    if (item.itemArrivedDate) {
        document.getElementById('itemArrivedDate-Label').innerHTML = item.itemArrivedDate;
        document.querySelector('#step-itemArrivedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-itemArrivedDate';
    }
    if (item.receivedDate) {
        document.getElementById('receivedDate-Label').innerHTML = item.receivedDate;
        document.querySelector('#step-receivedDate .icon-container').classList.add('completed');
        lastCompletedStep = 'step-receivedDate';
    } 

    // Additional processing logic for the truck icon positioning
    if (lastCompletedStep) {
        const lastStepElement = document.getElementById(lastCompletedStep);
        const truckIcon = document.getElementById('icon-truck');
        if (lastStepElement && truckIcon) {
            const stepRect = lastStepElement.getBoundingClientRect();
            const containerRect = document.querySelector('.progress-container').getBoundingClientRect();
            const leftPosition = stepRect.right - containerRect.left; // Increase the offset as needed
            truckIcon.style.left = `${leftPosition}px`;
        }
    } else {
        // If no step is completed, position the truck at the start
        const truckIcon = document.getElementById('icon-truck');
        truckIcon.style.left = '0px';
    }

    document.querySelectorAll('.line-container').forEach((lineContainer, index) => {
        if (index < document.querySelectorAll('.icon-container.completed').length - 1) {
            lineContainer.querySelector('.line').style.backgroundColor = 'orange';
        } else {
            lineContainer.querySelector('.line').style.backgroundColor = '#ddd';
        }
    });
}