docs: Rename usetoast hook

Author: tjtanjin

docs/api/hooks.md

@@ -93,7 +93,7 @@ Below is a list of available hooks along with a brief description for each of th
 | useSettings         | Accesses and modifies chatbot settings.                                                 |
 | useStyles           | Accesses and modifies chatbot styles.                                                   |
 | useTextArea         | Manages the text input area of the chatbot, including setting and clearing values.      |
-| useToast            | Manages toasts shown within the chatbot, such as showing or missing them.               |
+| useToasts            | Manages toasts shown within the chatbot, such as showing or missing them.               |
 | useVoice            | Manages voice functionality, such as toggling voice on or off                           |
 
 ## Hook Details
@@ -421,10 +421,10 @@ const MyNestedComponent = () => {
 };
 ```
 
-### useToast
+### useToasts
 
 #### Description
-The `useToast` hook allows you to track and manage the chatbot's toasts.
+The `useToasts` hook allows you to track and manage the chatbot's toasts.
 
 #### Return Values
 | Name                         | Type        | Description                                              |

docs/concepts/conversations.md

@@ -186,7 +186,7 @@ Toasts are strictly speaking not essential for chatbot conversations. However, t
 
 :::info Info
 
-For manipulating toasts, it is recommended that you utilize `showToast` and `dismissToast` which are provided in [**params**](/docs/api/params#showtoast) or [**hooks**](/docs/api/hooks#useToast). If you are directly manipulating the `toasts` array (not recommended), which is possible via the [`useToast`](/docs/api/hooks#usetoast) hook, you need to specify **at least the 2 required fields** yourself.
+For manipulating toasts, it is recommended that you utilize `showToast` and `dismissToast` which are provided in [**params**](/docs/api/params#showtoast) or [**hooks**](/docs/api/hooks#useToasts). If you are directly manipulating the `toasts` array (not recommended), which is possible via the [`useToasts`](/docs/api/hooks#usetoast) hook, you need to specify **at least the 2 required fields** yourself.
 
 :::
 

docs/examples/custom_hooks.md

@@ -7,13 +7,13 @@ keywords: [react, chat, chatbot, chatbotify]
 
 # Custom Hooks
 
-The following is an example for using custom hooks, which allows you to interact with the chatbot functionalities **externally** (i.e. from your own components). The full list of hooks and the functionalities they expose can be found [**here**](/docs/api/hooks). For this example, we'll only be looking at a few hooks such as [**`useAudio`**](/docs/api/hooks#useaudio), [**`useFlow`**](/docs/api/hooks#useflow), [**`useToast`**](/docs/api/hooks#usetoast) and [**`useNotifications`**](/docs/api/hooks#usenotifications). The hooks are imported within the `MyChatBotWrapper` component which is nested under `ChatBotProvider`.
+The following is an example for using custom hooks, which allows you to interact with the chatbot functionalities **externally** (i.e. from your own components). The full list of hooks and the functionalities they expose can be found [**here**](/docs/api/hooks). For this example, we'll only be looking at a few hooks such as [**`useAudio`**](/docs/api/hooks#useaudio), [**`useFlow`**](/docs/api/hooks#useflow), [**`useToasts`**](/docs/api/hooks#usetoast) and [**`useNotifications`**](/docs/api/hooks#usenotifications). The hooks are imported within the `MyChatBotWrapper` component which is nested under `ChatBotProvider`.
 
 ```jsx live noInline title=MyChatBot.js
 const MyChatBotWrapper = () => {
     const { toggleAudio } = useAudio();
     const { restartFlow } = useFlow();
-    const { showToast } = useToast();
+    const { showToast } = useToasts();
     const { playNotificationSound } = useNotifications();
 
     const settings = {