@botonic/react
Version:
Build Chatbots using React
191 lines • 6.93 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useWebchat = void 0;
const react_1 = require("react");
const default_theme_1 = require("../theme/default-theme");
const actions_1 = require("./actions");
const webchat_reducer_1 = require("./webchat-reducer");
function getWebchatInitialState(initialTheme) {
return {
replies: [],
messagesJSON: [],
messagesComponents: [],
latestInput: {},
typing: false,
webview: null,
webviewParams: null,
session: { user: undefined },
lastRoutePath: undefined,
handoff: false,
theme: initialTheme,
themeUpdates: {},
error: {},
online: true,
devSettings: { keepSessionOnReload: false },
isWebchatOpen: false,
isEmojiPickerOpen: false,
isPersistentMenuOpen: false,
isCoverComponentOpen: false,
isCustomComponentRendered: false,
lastMessageUpdate: undefined,
currentAttachment: undefined,
numUnreadMessages: 0,
isLastMessageVisible: true,
isInputFocused: false,
};
}
function useWebchat(theme) {
const initialTheme = theme || default_theme_1.defaultTheme;
const webchatInitialState = getWebchatInitialState(initialTheme);
const [webchatState, webchatDispatch] = (0, react_1.useReducer)(webchat_reducer_1.webchatReducer, webchatInitialState);
const webchatContainerRef = (0, react_1.useRef)(null);
const chatAreaRef = (0, react_1.useRef)(null);
const inputPanelRef = (0, react_1.useRef)(null);
const headerRef = (0, react_1.useRef)(null);
const scrollableMessagesListRef = (0, react_1.useRef)(null);
const repliesRef = (0, react_1.useRef)(null);
const addMessage = (message) => webchatDispatch({ type: actions_1.WebchatAction.ADD_MESSAGE, payload: message });
const addMessageComponent = (message) => webchatDispatch({
type: actions_1.WebchatAction.ADD_MESSAGE_COMPONENT,
payload: message,
});
const updateMessage = (message) => webchatDispatch({ type: actions_1.WebchatAction.UPDATE_MESSAGE, payload: message });
const updateReplies = (replies) => webchatDispatch({ type: actions_1.WebchatAction.UPDATE_REPLIES, payload: replies });
const removeReplies = () => webchatDispatch({ type: actions_1.WebchatAction.REMOVE_REPLIES, payload: [] });
const updateLatestInput = (input) => webchatDispatch({ type: actions_1.WebchatAction.UPDATE_LATEST_INPUT, payload: input });
const updateTyping = (typing) => webchatDispatch({ type: actions_1.WebchatAction.UPDATE_TYPING, payload: typing });
const updateWebview = (webview, params) => webchatDispatch({
type: actions_1.WebchatAction.UPDATE_WEBVIEW,
payload: { webview, webviewParams: params },
});
const removeWebview = () => webchatDispatch({
type: actions_1.WebchatAction.REMOVE_WEBVIEW,
});
const updateSession = (session) => {
webchatDispatch({
type: actions_1.WebchatAction.UPDATE_SESSION,
payload: session,
});
};
const updateLastRoutePath = (path) => webchatDispatch({
type: actions_1.WebchatAction.UPDATE_LAST_ROUTE_PATH,
payload: path,
});
const updateHandoff = (handoff) => webchatDispatch({
type: actions_1.WebchatAction.UPDATE_HANDOFF,
payload: handoff,
});
const updateTheme = (theme, themeUpdates) => {
const payload = themeUpdates !== undefined ? { theme, themeUpdates } : { theme };
webchatDispatch({
type: actions_1.WebchatAction.UPDATE_THEME,
payload,
});
};
const updateDevSettings = (settings) => webchatDispatch({
type: actions_1.WebchatAction.UPDATE_DEV_SETTINGS,
payload: settings,
});
const toggleWebchat = (toggle) => {
webchatDispatch({
type: actions_1.WebchatAction.TOGGLE_WEBCHAT,
payload: toggle,
});
};
const toggleEmojiPicker = (toggle) => webchatDispatch({
type: actions_1.WebchatAction.TOGGLE_EMOJI_PICKER,
payload: toggle,
});
const togglePersistentMenu = (toggle) => webchatDispatch({
type: actions_1.WebchatAction.TOGGLE_PERSISTENT_MENU,
payload: toggle,
});
const toggleCoverComponent = (toggle) => webchatDispatch({
type: actions_1.WebchatAction.TOGGLE_COVER_COMPONENT,
payload: toggle,
});
const doRenderCustomComponent = (toggle) => webchatDispatch({
type: actions_1.WebchatAction.DO_RENDER_CUSTOM_COMPONENT,
payload: toggle,
});
const setError = (error) => webchatDispatch({
type: actions_1.WebchatAction.SET_ERROR,
payload: error,
});
const setOnline = (online) => webchatDispatch({
type: actions_1.WebchatAction.SET_ONLINE,
payload: online,
});
const clearMessages = () => {
webchatDispatch({
type: actions_1.WebchatAction.CLEAR_MESSAGES,
});
};
const updateLastMessageDate = (date) => {
webchatDispatch({
type: actions_1.WebchatAction.UPDATE_LAST_MESSAGE_DATE,
payload: date,
});
};
const setCurrentAttachment = (attachment) => {
webchatDispatch({
type: actions_1.WebchatAction.SET_CURRENT_ATTACHMENT,
payload: attachment,
});
};
const resetUnreadMessages = () => {
webchatDispatch({
type: actions_1.WebchatAction.RESET_UNREAD_MESSAGES,
});
};
const setLastMessageVisible = (isLastMessageVisible) => {
webchatDispatch({
type: actions_1.WebchatAction.SET_LAST_MESSAGE_VISIBLE,
payload: isLastMessageVisible,
});
};
const setIsInputFocused = (isInputFocused) => {
webchatDispatch({
type: actions_1.WebchatAction.SET_IS_INPUT_FOCUSED,
payload: isInputFocused,
});
};
return {
addMessage,
addMessageComponent,
clearMessages,
doRenderCustomComponent,
resetUnreadMessages,
setCurrentAttachment,
setError,
setIsInputFocused,
setLastMessageVisible,
setOnline,
toggleCoverComponent,
toggleEmojiPicker,
togglePersistentMenu,
toggleWebchat,
updateDevSettings,
updateHandoff,
updateLastMessageDate,
updateLastRoutePath,
updateLatestInput,
updateMessage,
updateReplies,
updateSession,
updateTheme,
updateTyping,
updateWebview,
removeReplies,
removeWebview,
webchatState,
webchatContainerRef,
headerRef,
chatAreaRef,
scrollableMessagesListRef,
repliesRef,
inputPanelRef,
};
}
exports.useWebchat = useWebchat;
//# sourceMappingURL=use-webchat.js.map