Remove value Prop from File Input in React File Upload Example

[JsExpertCoder]

This PR removes the value={data.avatar} attribute from the file input in the React file upload example (resources/js/Pages/file-uploads.jsx). This change addresses two React errors (the application stops, the screen goes black and nothing is rendered when I select a file):

• Error 1:
  "Warning: value prop on input should not be null. Consider using an empty string to clear the component or undefined for uncontrolled components."
  File inputs are read-only for security reasons, and binding a value can lead to this warning.

• Error 2:
  "Warning: A component is changing an uncontrolled input to be controlled. This is likely caused by the value changing from undefined to a defined value, which should not happen. Decide between using a controlled or uncontrolled input element for the lifetime of the component."
  Removing the value prop ensures that the file input remains uncontrolled, avoiding the warning.

Solution:

Simply remove value={data.avatar} from the file input. This aligns with best practices for handling file inputs in React and resolves the errors mentioned above.

Note:

I have only tested these changes in an InertiaJS setup using React and Laravel as the backend. I haven't verified the examples for Vue or other frameworks. Please ensure that similar changes for other frontend frameworks are tested accordingly if needed.

[joetannenbaum]

Good catch, thank you 👍

[JsExpertCoder]

I'm the one who thanks! @joetannenbaum