Context:

A signed-in user should be able to upload an image and then paste it into the editor to view within the document or by opening a link in a separate tab.

Definition of Done:

1. User authentication is mandatory.

2. A visible button is displayed only when authorized:

   

3. Hovering over the button reveals a tooltip titled "Upload Image."

4. Clicking the button triggers a native file picker window, allowing selection of only "png, jpg, jpeg, gif" files.

5. The maximum file size for uploads is 4 Megabytes.

6. Only images in png, jpg, gif, or jpeg format are accepted.

7. Only one image can be uploaded at a time.

8. Upon successful upload, a confirmation badge appears at the top:

   

9. Once completed, a modal confirms the upload:

   

10. Users can copy the image link to be pasted into the creator for display.

11. Clicking a designated button displays the following badge:

    

12. The modal can be closed using the "X" button.

13. Error handling: When errors occur, a modal with a message explains the problem:

    

14. The error modal can be closed.

15. If attempting to bypass file filters (e.g., uploading a PDF), the error modal is displayed.

16. For invalid sizes (over 4 megabytes), an error is shown.

17. Clicking the "Copy" button generates unique text content with a link, allowing the image to be previewed after pasting it into the editor.

18. When pasting the generated link into a new tab, the image is displayed.

19. Functionality extends to mobile devices, adapting the file picker control to native mobile interfaces based on the device used.

20. Compatible with iPhone 12 and any other Android-based mobile device.