Fix a couple spelling and typo errors

jeroenleenarts · jeroenleenarts · commit 2d49718dc932 · 2022-12-06T16:36:43.000+01:00
diff --git a/README.md b/README.md
@@ -40,7 +40,7 @@ The Angular library is created using the [stream-chat-js](https://github.com/get
 
 We welcome code changes that improve this library or fix a problem. Please make sure to follow all best practices and add tests, if applicable, before submitting a pull request on GitHub. We are pleased to merge your code into the official repository if it meets a need. Make sure to sign our [Contributor License Agreement (CLA)](https://docs.google.com/forms/d/e/1FAIpQLScFKsKkAJI7mhCr7K9rEIOpqIDThrWxuvxnwUq2XkHyG154vQ/viewform) first. See our license file for more details.
 
-## We are hiring!
+## We are hiring.
 
 We recently closed a [$38 million Series B funding round](https://techcrunch.com/2021/03/04/stream-raises-38m-as-its-chat-and-activity-feed-apis-power-communications-for-1b-users/) and are actively growing.
 Our APIs are used by more than a billion end-users, and by working at Stream, you have the chance to make a huge impact on a team of very strong engineers.
diff --git a/docusaurus/docs/Angular/basics/upgrade-v2.mdx b/docusaurus/docs/Angular/basics/upgrade-v2.mdx
@@ -31,15 +31,15 @@ You can find the full list of breaking changes in stream-chat [v5](https://githu
 
 #### Angular 13
 
-Run the following command to updgrade if you're using Angular 13:
+Run the following command to upgrade if you're using Angular 13:
 
 ```
 npm install stream-chat@6.4.0 stream-chat-angular
 ```
 
 #### Angular 12
 
-Run the following command to updgrade if you're using Angular 12:
+Run the following command to upgrade if you're using Angular 12:
 
 ```
 npm install stream-chat@6.4.0 stream-chat-angular@3 --legacy-peer-deps
diff --git a/docusaurus/docs/Angular/basics/upgrade-v3.mdx b/docusaurus/docs/Angular/basics/upgrade-v3.mdx
@@ -5,7 +5,7 @@ title: Upgrade from v3
 
 ## About version 4
 
-Version 4 of stream-chat-angular brings a new and improved theming system. To use the new system please refer to our new [theming guide](../theming/introduction.mdx).
+Version 4 of `stream-chat-angular` brings a new and improved theming system. To use the new system please refer to our new [theming guide](../theming/introduction.mdx).
 
 ## Theme-v1
 
@@ -15,7 +15,7 @@ Updating from theme-v1 to theme-v2 will require to rewrite your custom CSS code
 
 Theme-v1 is now deprecated and will be removed in a future release.
 
-## Theard layout
+## Thread layout
 
 Previously you had to provide a selector for the message list and message input component projected inside the [thread component](../components/ThreadComponent.mdx).
 
diff --git a/docusaurus/docs/Angular/code-examples/channel-invites.mdx b/docusaurus/docs/Angular/code-examples/channel-invites.mdx
@@ -299,7 +299,7 @@ First we create a component that will display a pending invitation:
 ng g c invitation --inline-template --inline-style
 ```
 
-Here are the most importnat parts of the component:
+Here are the most important parts of the component:
 
 - The component will be displayed inside the [`NotificationList`](../components/NotificationListComponent.mdx) component
 - We create an input with `Channel` type, this will be provided by the `NotificationList`
@@ -433,7 +433,7 @@ This is how the invitation notifications look like:
 ### Channel filter
 
 If a user is invited to a channel they immediately become member of the channel (the membership applies even if the invite is rejected).
-This means that if you use a channel filter that is based on membership (for example `{members: {$in: [<user id>]}}`), channels with pending and recejted invites will be returned and displayed in the channel list as well.
+This means that if you use a channel filter that is based on membership (for example `{members: {$in: [<user id>]}}`), channels with pending and rejected invites will be returned and displayed in the channel list as well.
 If this is not what you need, you can use the [`joined`](https://getstream.io/chat/docs/javascript/query_channels/?language=javascript#channel-queryable-built-in-fields) flag to only list channels that the user was directly added to or the invitation was accepted by the user.
 
 The channel filter can be provided to the `init` method of the [`ChannelService`](../services/ChannelService.mdx), here is an example:
@@ -475,7 +475,7 @@ this.channelService.customAddedToChannelNotificationHandler =
 
 ### `notification.invite_accepted` event
 
-The `notification.invite_accepted` event emitted by the [`ChatClientService`](../services/ChatClientService.mdx) signals that the user accepted an invitation to a channel, we should add the channel to the channel list, we can do this by reinitializing the channel list.
+The `notification.invite_accepted` event emitted by the [`ChatClientService`](../services/ChatClientService.mdx) signals that the user accepted an invitation to a channel, we should add the channel to the channel list, we can do this by re-initializing the channel list.
 
 Add this to the constructor of your `app.component.ts`:
 
diff --git a/docusaurus/docs/Angular/code-examples/ionic-guide.mdx b/docusaurus/docs/Angular/code-examples/ionic-guide.mdx
@@ -17,7 +17,7 @@ npm install -g @ionic/cli native-run cordova-res
 
 ## Create the app
 
-Next, create an Ionic Angular app using the "sidemenu" template and add Capacitor for native functionality:
+Next, create an Ionic Angular app using the "side menu" template and add Capacitor for native functionality:
 
 ```bash
 ionic start chat-app sidemenu --type=angular --capacitor
diff --git a/docusaurus/docs/Angular/code-examples/pin-messages.mdx b/docusaurus/docs/Angular/code-examples/pin-messages.mdx
@@ -26,7 +26,7 @@ The [`activeChannelPinnedMessages$`](../services/ChannelService.mdx/#activechann
 this.channelService.activeChannelPinnedMessages$.subscribe(console.log);
 ```
 
-- The initial value is retrived from the [channel query response](https://getstream.io/chat/docs/javascript/query_channels/?language=javascript&q=pin#channelstate-response)
+- The initial value is retrieved from the [channel query response](https://getstream.io/chat/docs/javascript/query_channels/?language=javascript&q=pin#channelstate-response)
 - After that, all pin and unpin actions are reflected in the emitted list
 
 ## Pinned messages UI
diff --git a/docusaurus/docs/Angular/code-examples/push-guide.mdx b/docusaurus/docs/Angular/code-examples/push-guide.mdx
@@ -144,7 +144,7 @@ Go to the [Firebase Console](https://console.firebase.google.com/), and select t
 
 Click on the gear icon next to **Project Overview** and navigate to **Project settings**.
 
-Navigate to the **Service Accounts** tab. Under **Firebase Admin SDK section**, click on **Generate new private key** button that will generate a _json_ file with the Firebase Credentials.
+Navigate to the **Service Accounts** tab. Under **Firebase Admin SDK section**, click on **Generate new private key** button that will generate a _JSON_ file with the Firebase Credentials.
 
 <img src={FirebaseConsoleScreenshot} width="500" />
 
@@ -154,11 +154,11 @@ Select **Push notifications** from the left menu.
 
 Add a new **Firebase** configuration.
 
-Upload the _json_ file you created in the Firebase console.
+Upload the _JSON_ file you created in the Firebase console.
 
 For more information about push configurations see our [Push Providers & Multi Bundle guide](https://getstream.io/chat/docs/javascript/push_providers_and_multi_bundle/?language=javascript)
 
-### Push templates in Stream Dashbaord
+### Push templates in Stream Dashboard
 
 The [Capacitor Push API has some limitations around data-only notifications](https://capacitorjs.com/docs/apis/push-notifications#silent-push-notifications--data-only-notifications). The default Firebase APN notification payload works well with the Capacitor Push API, but if you need to send notifications for Android you have to update the **Notification Template** in the **Push Notifications** settings in the **Stream Dashboard**.
 
@@ -184,4 +184,4 @@ Add the following code to your `android/app/src/main/AndroidManifest.xml` file t
 </intent-filter>
 ```
 
-Add this element as a child to the `activity` element. "OPEN_ACTIVITY_1" is the "click_action" field from your Firebase Notification template.
+Add this element as a child to the `activity` element. "OPEN_ACTIVITY_1" is the "`click_action`" field from your Firebase Notification template.
diff --git a/docusaurus/docs/Angular/code-examples/responsive-layout.mdx b/docusaurus/docs/Angular/code-examples/responsive-layout.mdx
@@ -204,7 +204,7 @@ Provide the layout based on the menu state and hide the menu on bigger screens:
 }
 ```
 
-Lastly, implement autoclose behavior for the channel list:
+Lastly, implement auto close behavior for the channel list:
 
 ```html
 <stream-channel-list
diff --git a/docusaurus/docs/Angular/components/AttachmentListComponent.mdx b/docusaurus/docs/Angular/components/AttachmentListComponent.mdx
@@ -91,7 +91,7 @@ The SDK will try to display images and videos with their original aspect ratio,
 :::danger
 **If you're planning to rewrite attachment sizing with your own CSS code** it's important to note that:
 
-The sizing logic for images and videos inside the [`AttachmentConfigurationService`](../services/AttachmentConfigurationService.mdx) requires that host elements of images and videos (ususally `img` and `video` elements) have `max-height`/`height` and `max-width` properties defined and that these values can be computed to a valid pixel value using the [`getComputedStyle`](https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle) (for more information refer to the [Maximum size](#maximum-size) section).
+The sizing logic for images and videos inside the [`AttachmentConfigurationService`](../services/AttachmentConfigurationService.mdx) requires that host elements of images and videos (usually `img` and `video` elements) have `max-height`/`height` and `max-width` properties defined and that these values can be computed to a valid pixel value using the [`getComputedStyle`](https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle) (for more information refer to the [Maximum size](#maximum-size) section).
 :::
 
 [//]: # "Start of generated content"
diff --git a/docusaurus/docs/Angular/components/AttachmentPreviewListComponent.mdx b/docusaurus/docs/Angular/components/AttachmentPreviewListComponent.mdx
@@ -1,6 +1,6 @@
 import Screenshot from "../assets/attachment-preview-list-screenshot.png";
 
-The `AttachmentPreviewList` compontent displays a preview of the attachments uploaded to a message. Users can delete attachments using the preview component, or retry upload if it failed previously.
+The `AttachmentPreviewList` component displays a preview of the attachments uploaded to a message. Users can delete attachments using the preview component, or retry upload if it failed previously.
 
 **Example 1** - attachment previews
 
diff --git a/docusaurus/docs/Angular/components/AutocompleteTextareaComponent.mdx b/docusaurus/docs/Angular/components/AutocompleteTextareaComponent.mdx
@@ -2,7 +2,7 @@ The `AutocompleteTextarea` component is used by the [`MessageInput`](./MessageIn
 
 Message send can be triggered with the `Enter` key, new line can be added with the `Shift+Enter` combination.
 
-The `AutocompleteTextarea` extends the funcitonalities of the [`Textarea`](./TextareaComponent.mdx) component with autocomplete features:
+The `AutocompleteTextarea` extends the functionalities of the [`Textarea`](./TextareaComponent.mdx) component with autocomplete features:
 
 - users can mention other users in a message (transliteration is used to support languages with non-Latin characters)
 - users can send commands (for example /giphy)
diff --git a/docusaurus/docs/Angular/components/AvatarPlaceholderComponent.mdx b/docusaurus/docs/Angular/components/AvatarPlaceholderComponent.mdx
@@ -1,4 +1,4 @@
-The `AvatarPlaceholder` component displays the [default avatar](./AvatarComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This componet is used by the SDK internally, you likely won't need to use it.
+The `AvatarPlaceholder` component displays the [default avatar](./AvatarComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This component is used by the SDK internally, you likely won't need to use it.
 
 [//]: # "Start of generated content"
 [//]: # "End of generated content"
diff --git a/docusaurus/docs/Angular/components/ChannelPreviewComponent.mdx b/docusaurus/docs/Angular/components/ChannelPreviewComponent.mdx
@@ -10,7 +10,7 @@ If you want to build your own `ChannelPreview` component, you might find the fol
 
 ### Avatar
 
-The `ChannelPreview` component uses the [`Avatar`](./AvatarComponent.mdx) component to display the channels's photo.
+The `ChannelPreview` component uses the [`Avatar`](./AvatarComponent.mdx) component to display the channel's photo.
 
 :::
 
diff --git a/docusaurus/docs/Angular/components/IconPlaceholderComponent.mdx b/docusaurus/docs/Angular/components/IconPlaceholderComponent.mdx
@@ -1,4 +1,4 @@
-The `IconPlaceholder` component displays the [default icons](./IconComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This componet is used by the SDK internally, you likely won't need to use it.
+The `IconPlaceholder` component displays the [default icons](./IconComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This component is used by the SDK internally, you likely won't need to use it.
 
 [//]: # "Start of generated content"
 [//]: # "End of generated content"
diff --git a/docusaurus/docs/Angular/components/LoadingIndicatorPlaceholderComponent.mdx b/docusaurus/docs/Angular/components/LoadingIndicatorPlaceholderComponent.mdx
@@ -1,4 +1,4 @@
-The `LoadingInficatorPlaceholder` component displays the [default loading indicator](./LoadingIndicatorComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This componet is used by the SDK internally, you likely won't need to use it.
+The `LoadingInficatorPlaceholder` component displays the [default loading indicator](./LoadingIndicatorComponent.mdx) unless a [custom template](../services/CustomTemplatesService.mdx) is provided. This component is used by the SDK internally, you likely won't need to use it.
 
 [//]: # "Start of generated content"
 [//]: # "End of generated content"
diff --git a/docusaurus/docs/Angular/components/MessageComponent.mdx b/docusaurus/docs/Angular/components/MessageComponent.mdx
@@ -2,7 +2,7 @@ import MessageScreenshot from "../assets/message-screenshot.png";
 import MessageActionsScreenshot from "../assets/message-actions-screenshot.png";
 import MessageReactionsScreenshot from "../assets/message-reactions-screenshot.png";
 
-The `Message` component displays a message with additional information such as sender and date, and enables [interaction with the message (i.e. edit or react)](../concepts/message-interactions.mdx).
+The `Message` component displays a message with additional information such as sender and date, and enables [interaction with the message (for example edit or react)](../concepts/message-interactions.mdx).
 
 **Example 1** - example message:
 
@@ -18,7 +18,7 @@ The `Message` component displays a message with additional information such as s
 
 ## Customization
 
-The message list uses the `Message` component to display messages, if you want to replace that with your own custom component, you can do that by providing it to the [`CustomTemplatesService`](../services/CustomTemplatesService.mdx/#messagetemplate). It's also possible to just override parts of the message comonent.
+The message list uses the `Message` component to display messages, if you want to replace that with your own custom component, you can do that by providing it to the [`CustomTemplatesService`](../services/CustomTemplatesService.mdx/#messagetemplate). It's also possible to just override parts of the message component.
 
 :::note
 
@@ -30,7 +30,7 @@ The `Message` component uses the [`Avatar`](./AvatarComponent.mdx) component to
 
 ### Message actions
 
-The `Message` component uses the [`MessageActionsBox`](./MessageActionsBoxComponent.mdx) component to enable interaction with the message (i.e. edit).
+The `Message` component uses the [`MessageActionsBox`](./MessageActionsBoxComponent.mdx) component to enable interaction with the message (edit).
 
 ### Message reactions
 
@@ -40,9 +40,9 @@ The `Message` component uses the [`MessageReactions`](./MessageReactionsComponen
 
 The `Message` component uses the [`AttachmentList`](./AttachmentListComponent.mdx) component to display the attachments of the message.
 
-### User firendly dates
+### User friendly dates
 
-The `Message` component uses the [`parseDate`](https://github.com/GetStream/stream-chat-angular/tree/master/projects/stream-chat-angular/src/lib/message/parse-date.ts) utility function to create user-firendly dates (for example _Yesterday at 8:15 AM_).
+The `Message` component uses the [`parseDate`](https://github.com/GetStream/stream-chat-angular/tree/master/projects/stream-chat-angular/src/lib/message/parse-date.ts) utility function to create user-friendly dates (for example _Yesterday at 8:15 AM_).
 
 ### Read by
 
diff --git a/docusaurus/docs/Angular/components/MessageInputComponent.mdx b/docusaurus/docs/Angular/components/MessageInputComponent.mdx
@@ -40,7 +40,7 @@ If more than one message input component can exist on your chat UI you should pr
 })
 ```
 
-### Textarea
+### `Textarea`
 
 You can use the [`Textarea`](./TextareaComponent.mdx) or the [`AutocompleteTextarea`](./AutocompleteTextareaComponent.mdx) component to display the input HTML element for the users to type.
 
diff --git a/docusaurus/docs/Angular/components/MessageListComponent.mdx b/docusaurus/docs/Angular/components/MessageListComponent.mdx
@@ -1,7 +1,7 @@
 import MessagesWithGroupingsScreenhot from "../assets/messages-with-grouping-screenshot.png";
 import MessagesWithoutGroupingsScreenhot from "../assets/messages-without-groups-screenshot.png";
 
-The `MessageList` component renders a scrollable list of messages.
+The `MessageList` component renders a scroll-able list of messages.
 
 The `MessageList` displays messages using pagination, new messages are loaded when the user scrolls to the top of the list.
 
diff --git a/docusaurus/docs/Angular/concepts/customization.mdx b/docusaurus/docs/Angular/concepts/customization.mdx
@@ -33,4 +33,4 @@ This template lives in your application so you can freely replace any component
 
 ## `CustomTemplatesService`
 
-However you might just want to override parts of these components, for example you want to use your own custom message component, but don't want to override the whole message list. In these instances you can use the `CustomTemplatesService`, the [full list of overridable parts](../services/CustomTemplatesService.mdx) can be found in the documentation page of the `CustomTemplatesService`.
+However you might just want to override parts of these components, for example you want to use your own custom message component, but don't want to override the whole message list. In these instances you can use the `CustomTemplatesService`, the [full list of override-able parts](../services/CustomTemplatesService.mdx) can be found in the documentation page of the `CustomTemplatesService`.
diff --git a/docusaurus/docs/Angular/concepts/generics.mdx b/docusaurus/docs/Angular/concepts/generics.mdx
@@ -3,7 +3,7 @@ id: generics
 title: Generics
 ---
 
-The [`stream-chat-js`](https://github.com/GetStream/stream-chat-js) library takes advantage of [TypeScript generics](https://www.typescriptlang.org/docs/handbook/2/generics.html) to make it possible to define custom fileds on the following entities:
+The [`stream-chat-js`](https://github.com/GetStream/stream-chat-js) library takes advantage of [TypeScript generics](https://www.typescriptlang.org/docs/handbook/2/generics.html) to make it possible to define custom file ids on the following entities:
 
 1. [`Attachment`](https://github.com/GetStream/stream-chat-js/blob/master/src/types.ts)
 2. [`ChannelResponse`](https://github.com/GetStream/stream-chat-js/blob/master/src/types.ts)
diff --git a/docusaurus/docs/Angular/concepts/opt-in-architecture.mdx b/docusaurus/docs/Angular/concepts/opt-in-architecture.mdx
@@ -34,15 +34,15 @@ import {
 export class AppModule {}
 ```
 
-The chosen module decides what kind of textarea should be used in the message composer, you can choose between the [`AutocompleteTextareaComponent`](../components/AutocompleteTextareaComponent.mdx) with mentions or the [`TextareaComponent`](../components/TextareaComponent.mdx) that doesn't support mentions, but has a smaller bundle size. Your final application bundle will only include either the `TextareaComponent` or the `AutocompleteTextareaComponent`.
+The chosen module decides what kind of `textarea` should be used in the message composer, you can choose between the [`AutocompleteTextareaComponent`](../components/AutocompleteTextareaComponent.mdx) with mentions or the [`TextareaComponent`](../components/TextareaComponent.mdx) that doesn't support mentions, but has a smaller bundle size. Your final application bundle will only include either the `TextareaComponent` or the `AutocompleteTextareaComponent`.
 
 ## Opt-in features
 
 The list of opt-in features can be found below:
 
-### Textarea
+### `Textarea`
 
-For the textarea inside the [`MessageInputComponent`](../components/MessageInputComponent.mdx) you can choose between the [`TextareaComponent`](../components/TextareaComponent.mdx) or the [`AutocompleteTextareaComponent`](../components/AutocompleteTextareaComponent.mdx) component. The table below provides a comparison between the two components:
+For the `textarea` inside the [`MessageInputComponent`](../components/MessageInputComponent.mdx) you can choose between the [`TextareaComponent`](../components/TextareaComponent.mdx) or the [`AutocompleteTextareaComponent`](../components/AutocompleteTextareaComponent.mdx) component. The table below provides a comparison between the two components:
 
 | Feature       | `TextareaComponent` | `AutocompleteTextareaComponent` |
 | ------------- | ------------------- | ------------------------------- |
diff --git a/docusaurus/docs/Angular/concepts/theming-and-css.mdx b/docusaurus/docs/Angular/concepts/theming-and-css.mdx
diff --git a/docusaurus/docs/Angular/concepts/translation.mdx b/docusaurus/docs/Angular/concepts/translation.mdx
diff --git a/docusaurus/docs/Angular/types/stream-message.mdx b/docusaurus/docs/Angular/types/stream-message.mdx
diff --git a/projects/stream-chat-angular/README.md b/projects/stream-chat-angular/README.md
diff --git a/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts b/projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts
diff --git a/projects/stream-chat-angular/src/lib/attachment-preview-list/attachment-preview-list.component.ts b/projects/stream-chat-angular/src/lib/attachment-preview-list/attachment-preview-list.component.ts
diff --git a/projects/stream-chat-angular/src/lib/avatar-placeholder/avatar-placeholder.component.ts b/projects/stream-chat-angular/src/lib/avatar-placeholder/avatar-placeholder.component.ts
diff --git a/projects/stream-chat-angular/src/lib/icon-placeholder/icon-placeholder.component.ts b/projects/stream-chat-angular/src/lib/icon-placeholder/icon-placeholder.component.ts
diff --git a/projects/stream-chat-angular/src/lib/loading-indicator-placeholder/loading-indicator-placeholder.component.ts b/projects/stream-chat-angular/src/lib/loading-indicator-placeholder/loading-indicator-placeholder.component.ts

Original file line number	Diff line number	Diff line change
`@@ -204,7 +204,7 @@ Provide the layout based on the menu state and hide the menu on bigger screens:`
`204`	`204`	`}`
`205`	`205`	```
`206`	`206`
`207`		`-Lastly, implement autoclose behavior for the channel list:`
	`207`	`+Lastly, implement auto close behavior for the channel list:`
`208`	`208`
`209`	`209`	```html
`210`	`210`	`<stream-channel-list`