Add details and precisions regarding image uploading

Author: meganelacheny

docusaurus/docs/cms/api/rest/upload.md

@@ -30,7 +30,11 @@ The [Media Library feature](/cms/features/media-library) is powered in the back-
 
 Upload one or more files to your application.
 
-`files` is the only accepted parameter, and describes the file(s) to upload. The value(s) can be a Buffer or Stream:
+`files` is the only accepted parameter, and describes the file(s) to upload. The value(s) can be a Buffer or Stream.
+
+:::tip
+When uploading an image, include a `fileInfo` object to set the file name, alt text, and caption.
+:::
 
 <Tabs>
 <TabItem value="browser" label="Browser">
@@ -39,6 +43,12 @@ Upload one or more files to your application.
 <form>
   <!-- Can be multiple files -->
   <input type="file" name="files" />
+  <input
+    type="hidden"
+    name="fileInfo"
+    value='{"name":"homepage-hero","alternativeText":"Person smiling while
+      holding laptop","caption":"Hero image used on the homepage"}'
+  />
   <input type="submit" value="Submit" />
 </form>
 
@@ -68,6 +78,14 @@ const file = await blobFrom('./1.png', 'image/png');
 const form = new FormData();
 
 form.append('files', file, "1.png");
+form.append(
+  'fileInfo',
+  JSON.stringify({
+    name: 'Homepage hero',
+    alternativeText: 'Person smiling while holding laptop',
+    caption: 'Hero image used on the homepage',
+  })
+);
 
 const response = await fetch('http://localhost:1337/api/upload', {
   method: 'post',

docusaurus/docs/cms/features/media-library.md

@@ -489,6 +489,10 @@ Breakpoint changes will only apply to new images, existing images will not be re
 
 **Path to use the feature:** <Icon name="images" /> Media Library
 
+:::info
+Strapi supports uploading images from the admin panel or programmatically. From the API, you can send a multipart/form-data request to `/api/upload` with the image file and optional `fileInfo` metadata for captions and alt text (see [REST API documentation](/cms/api/rest/upload#upload-files) for more information).
+:::
+
 The Media Library displays all assets uploaded in the application, either via the <Icon name="images" /> Media Library itself or via the <Icon name="feather" /> Content Manager when managing a media field.
 
 Assets uploaded to the Media Library can be inserted into content-types using the [Content Manager](/cms/features/content-manager#creating--writing-content).

docusaurus/static/llms-code.txt

@@ -10693,7 +10693,7 @@ File path: N/A
 Source: https://docs.strapi.io/cms/api/rest/upload
 
 ## Upload files
-Description: files is the only accepted parameter, and describes the file(s) to upload.
+Description: :::tip When uploading an image, include a fileInfo object to set the file name, alt text, and caption.
 (Source: https://docs.strapi.io/cms/api/rest/upload#upload-files)
 
 Language: HTML
@@ -10703,6 +10703,12 @@ File path: N/A
 <form>
   <!-- Can be multiple files -->
   <input type="file" name="files" />
+  <input
+    type="hidden"
+    name="fileInfo"
+    value='{"name":"homepage-hero","alternativeText":"Person smiling while
+      holding laptop","caption":"Hero image used on the homepage"}'
+  />
   <input type="submit" value="Submit" />
 </form>
 
@@ -10732,6 +10738,14 @@ const file = await blobFrom('./1.png', 'image/png');
 const form = new FormData();
 
 form.append('files', file, "1.png");
+form.append(
+  'fileInfo',
+  JSON.stringify({
+    name: 'Homepage hero',
+    alternativeText: 'Person smiling while holding laptop',
+    caption: 'Hero image used on the homepage',
+  })
+);
 
 const response = await fetch('http://localhost:1337/api/upload', {
   method: 'post',

docusaurus/static/llms-full.txt

@@ -4495,7 +4495,11 @@ The [Media Library feature](/cms/features/media-library) is powered in the back-
 
 Upload one or more files to your application.
 
-`files` is the only accepted parameter, and describes the file(s) to upload. The value(s) can be a Buffer or Stream:
+`files` is the only accepted parameter, and describes the file(s) to upload. The value(s) can be a Buffer or Stream.
+
+:::tip
+When uploading an image, include a `fileInfo` object to set the file name, alt text, and caption.
+:::
 
 </Tabs>