Skip to content

Commit 16fc029

Browse files
authored
Update file-sharing-tutorial-acs-chat.md
1 parent 1f8c7ed commit 16fc029

File tree

1 file changed

+11
-11
lines changed

1 file changed

+11
-11
lines changed

articles/communication-services/tutorials/file-sharing-tutorial-acs-chat.md

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ ms.service: azure-communication-services
1313
ms.subservice: chat
1414
---
1515

16-
# Enable file sharing using UI Library in Azure Communication Service Chat with Azure Blob Storage
16+
# Enable file sharing using UI Library in Azure Communication Service Chat with Azure Blob storage
1717

1818
[!INCLUDE [Public Preview Notice](../includes/public-preview-include.md)]
1919

@@ -55,13 +55,13 @@ The diagram shows a typical flow of a file sharing scenario for both upload and
5555

5656
![Filesharing typical flow](./media/filesharing-typical-flow.png "Diagram that shows the the file sharing typical flow.")
5757

58-
## Setup File Storage using Azure Blob
58+
## Set up file storage using Azure Blob
5959

6060
You can follow the tutorial [Upload file to Azure Blob Storage with an Azure Function](/azure/developer/javascript/how-to/with-web-app/azure-function-file-upload) to write the backend code required for file sharing.
6161

6262
Once implemented, you can call this Azure Function inside the `uploadHandler` function to upload files to Azure Blob Storage. For the remaining of the tutorial, we assume you have generated the function using the tutorial for Azure Blob Storage linked previously.
6363

64-
### Securing your Azure Blob Storage Container
64+
### Securing your Azure Blob storage container
6565

6666
This tutorial assumes that your Azure blob storage container allows public access to the files you upload. Making your Azure storage containers public isn't recommended for real world production applications.
6767

@@ -71,7 +71,7 @@ The downloadable [GitHub sample](https://github.com/Azure-Samples/communication-
7171

7272
UI Library requires a React environment to be set up. Next we do that. If you already have a React App, you can skip this section.
7373

74-
### Set Up React App
74+
### Set up react app
7575

7676
We use the create-react-app template for this quickstart. For more information, see: [Get Started with React](https://reactjs.org/docs/create-a-new-react-app.html)
7777

@@ -86,7 +86,7 @@ cd ui-library-quickstart-composites
8686
At the end of this process, you should have a full application inside of the folder `ui-library-quickstart-composites`.
8787
For this quickstart, we're modifying files inside of the `src` folder.
8888

89-
### Install the Package
89+
### Install the package
9090

9191
Use the `npm install` command to install the beta Azure Communication Services UI Library for JavaScript.
9292

@@ -106,7 +106,7 @@ npm install @azure/[email protected]
106106

107107
```
108108

109-
### Run Create React App
109+
### Create React app
110110

111111
Let's test the Create React App installation by running:
112112

@@ -116,7 +116,7 @@ npm run start
116116

117117
```
118118

119-
## Configuring Chat Composite to enable File Sharing
119+
## Configuring Chat Composite to enable file sharing
120120

121121
You need to replace the variable values for both common variable required to initialize the chat composite.
122122

@@ -223,7 +223,7 @@ const fileDownloadHandler: FileDownloadHandler = async (userId, fileData) => {
223223

224224
```
225225

226-
## Configure upload method to use Azure Blob Storage
226+
## Configure upload method to use Azure Blob storage
227227

228228
To enable Azure Blob Storage upload, we modify the `uploadFileToAzureBlob` method we declared previously with the following code. You need to replace the Azure Function information to upload files.
229229

@@ -275,7 +275,7 @@ const uploadFileToAzureBlob = async (fileUpload: FileUploadManager) => {
275275

276276
```
277277

278-
## Error Handling
278+
## Error handling
279279

280280
When an upload fails, the UI Library Chat Composite displays an error message.
281281

@@ -299,7 +299,7 @@ const fileUploadHandler: FileUploadHandler = async (userId, fileUploads) => {
299299
}
300300
```
301301

302-
## File Downloads - Advanced Usage
302+
## File downloads - advanced usage
303303

304304
By default, the file `url` provided through `notifyUploadCompleted` method is used to trigger a file download. However, if you need to handle a download in a different way, you can provide a custom `downloadHandler` to ChatComposite. Next, we modify the `fileDownloadHandler` that we declared previously to check for an authorized user before allowing to download the file.
305305

@@ -324,7 +324,7 @@ const fileDownloadHandler: FileDownloadHandler = async (userId, fileData) => {
324324
}
325325
```
326326

327-
Download errors are be displayed to users in an error bar on top of the Chat Composite.
327+
Download errors are displayed to users in an error bar on top of the Chat Composite.
328328

329329
![File Download Error](./media/download-error.png "Screenshot that shows the File Download Error.")
330330

0 commit comments

Comments
 (0)