v2.0.1

index.d.ts

@@ -1,22 +1,38 @@
-// Type definitions for ReactBot v2.0.0
+// Type definitions for ReactBot v2.0.1
 // Project: <https://github.com/cozimacode/react-bot>
 // Definitions by: Naser Baig <https://github.com/cozimacode>
 
-import { ElementType } from "react";
+import { ElementType, FunctionComponent } from "react";
 
-export const ReactBot: ElementType;
+export interface InitialResponse {
+  Component: ElementType;
+  props: Record<string, unknown>;
+  avatar?: boolean;
+}
+
+export interface MainProps {
+  botId?: string;
+  className?: string;
+  customLauncherIcon?: string | boolean;
+  title?: string;
+  messagePlaceHolder?: string;
+  autofocus?: boolean;
+  initialResponse?: InitialResponse | boolean;
+  typingGif?: string;
+  titleAvatar?: string;
+  chatAvatar?: string;
+  handleUserInput: (
+    input: string,
+    displayTypingEffect: () => void,
+    hideTypingEffect: () => void
+  ) => void;
+}
+
+export const ReactBot: FunctionComponent<MainProps>;
 
 export function addUserMessage(message: string, botId?: string): Promise<void>;
 export function addBotMessage(message: string, botId?: string): Promise<void>;
 export function addCustomComponent(
-  {
-    Component,
-    props,
-    avatar,
-  }: {
-    Component: ElementType;
-    props: Record<string, unknown>;
-    avatar?: boolean;
-  },
+  { Component, props, avatar }: InitialResponse,
   botId?: string
 ): Promise<void>;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cozimacode/react-bot",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "A clean, compact and responsive chat widget for React Apps.",
   "author": {
     "name": "Naser Mohd Baig",

src/ReactBot.tsx

@@ -8,7 +8,7 @@ import "./coreComponents/coreStyles/BrowserSpecific.css";
 
 export interface InitialResponse {
   Component: ElementType;
-  props: Record<string, any>;
+  props: Record<string, unknown>;
   avatar?: boolean;
 }
 

src/coreComponents/Container.tsx

@@ -13,6 +13,7 @@ import { ConversationUI, Conversation } from "./ConversationUI";
 import { Header } from "./Header";
 import {
   addUserMessage,
+  addBotMessage,
   typingEffect,
   hideTyping,
 } from "../redux/actions/dispatch";
@@ -77,7 +78,15 @@ const Inner: FunctionComponent<ContainerProps> = ({
 
   const handleClick = async () => {
     await addUserMessage(userInput, botId);
-    handleUserInput(userInput, displayTypingEffect, hideTypingEffect);
+    if (typeof handleUserInput === "function") {
+      handleUserInput(userInput, displayTypingEffect, hideTypingEffect);
+    } else {
+      addBotMessage(
+        `Sorry. Your last message wasn't processed as you probably forgot to supply a valid function as 'handleUserInput' prop to ReactBot.`,
+        botId
+      );
+    }
+
     setUserInput("");
   };
 

src/redux/actions/dispatch.ts

@@ -1,4 +1,4 @@
-import { ElementType } from "react";
+import { InitialResponse } from "../../ReactBot";
 import { store } from "../store";
 import {
   InitializeBot,
@@ -28,15 +28,7 @@ function addUserMessage(message: string, botId = "default"): Promise<void> {
 }
 
 function addCustomComponent(
-  {
-    Component,
-    props,
-    avatar = false,
-  }: {
-    Component: ElementType;
-    props: Record<string, unknown>;
-    avatar?: boolean;
-  },
+  { Component, props, avatar = false }: InitialResponse,
   botId = "default"
 ): Promise<void> {
   return new Promise((resolve) => {