كيفية اضافة صورتين في input file جافا سكريبت / جيكويري

السلام عليكم ..

لدي حقلين من input file و lable الذي يمكنني من اظهار الصورة  ، المشكلة انه عند الضغط على خانة الصورة الثانية واختيار الصورة تظهر الصورة في الخانة الأولى ولا استطيع ان اظهر الا صورة واحدة فقط في احدى الخانات كيف استطيع حل المشكلة واظهار صورة مختلفة في كل خانة ؟

<input type="file" id="img" onchange="imageToBase64(this),image(event)"style="display: none; visibility: none;">
      <label  class="btn img-lable float-end" for="img">
        <img src="/img/empty2.jpg" id="product-img" width="430" class="product-img-add"  class="mt-3">
        <input style="width:300%;" hidden type="text" name="proImg" class="input-add-pro"  id="proImg">
        <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="currentColor"
          class="add-product-img bi bi-plus-circle-fill" viewBox="0 0 16 16">
          <path
            d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z" />
        </svg>
      </label>

      <input type="file" id="img" onchange="imageToBase64(this),image(event)"style="display: none; visibility: none;">
      <label  class="btn img-lable float-end" for="img">
        <img src="/img/empty2.jpg" id="product-img" width="430" class="product-img-add"  class="mt-3">
        <input style="width:300%;" hidden type="text" name="proImg" class="input-add-pro"  id="proImg">
        <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="currentColor"
          class="add-product-img bi bi-plus-circle-fill" viewBox="0 0 16 16">
          <path
            d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8.5 4.5a.5.5 0 0 0-1 0v3h-3a.5.5 0 0 0 0 1h3v3a.5.5 0 0 0 1 0v-3h3a.5.5 0 0 0 0-1h-3v-3z" />
        </svg>
      </label>

// image to base64
    function imageToBase64 (image) {
    
    var img = image.files[0];
    base64 = null;
    var reader = new FileReader();
    reader.onloadend = function() {
    base64 = reader.result.split(',')[1] 
    $('#proImg').val($('#proImg').val() + base64);
    
}

    reader.readAsDataURL(img);
    
}
function image (event) {
	var image = document.getElementById('product-img');
	image.src = URL.createObjectURL(event.target.files[0]);
  
};