Logo preview is not correct after image cropping

• Type: Bug
• Status: Closed
• Resolution: Fixed
• Affects Version/s: Master
• Fix Version/s: 7.1.10 DXP FP18, 7.1.10.5 SP5, 7.1.X, 7.2.10 DXP FP6, 7.2.X, 7.3.10 DXP GA1, Master
• Component/s: JS APIs and Utilities > Frontend JS Web API
• Labels:
  • ee-ts
  • liferay-dxp-71-sp5
  • liferay-fixpack-dxp-18-7110
  • liferay-fixpack-dxp-6-7210
• Branch Version/s:
  7.2.x, 7.1.x
• Backported to Branch:
  Committed
• Fix Priority: 3
• Git Pull Request: https://github.com/brianchandotcom/liferay-portal/pull/88350

Reproduce: 

1. Go to Control Panel > Users > Users and Organizations
2. Create a new Organization and Save it
3. The placeholder of the organization logo will appear in the right hand side
4. Click "Change" and upload an image
5. Click "Done"
6. The image will appear as the logo
7. Click "Change" again
8. Upload the same image and crop it
9. Click "Done"

 Actual behavior: the original format of the image shows in the preview. If you Save the Organization settings, the cropped image appears correctly.
 Expected behavior: The cropped image should appear even in the preview to avoid user confusion.

 The issue is reproducable on the Edit User Information page too