diff --git a/src/features/chatbot/actionCreators.js b/src/features/chatbot/actionCreators.js index 4384283..6d20314 100644 --- a/src/features/chatbot/actionCreators.js +++ b/src/features/chatbot/actionCreators.js @@ -1,4 +1,6 @@ import * as types from "./actionTypes"; +import api from "./api"; +import { sendHttpRequest } from "../../redux/actions/httpActions"; export function summonWizard() { return { type: types.SUMMON_WIZARD }; @@ -7,3 +9,63 @@ export function summonWizard() { export function dismissBot() { return { type: types.DISMISS_BOT }; } + +export function loadBotSession(botName, userKey) { + return async function(dispatch, getState) { + try { + dispatch({ type: types.INITIALIZE_BOT_SESSION_STARTED }); + const { frontendSession } = getState(); + const externalId = frontendSession.sessionId; + const clientApplication = frontendSession.applicationCode; + const data = await dispatch( + sendHttpRequest( + api.getBotSession(botName, externalId, clientApplication, userKey) + ) + ); + dispatch({ + type: types.INITIALIZE_BOT_SESSION_SUCCESS, + payload: data + }); + } catch (error) { + throw error; + } + }; +} + +export function initializeChat(sessionId) { + return async function(dispatch) { + try { + dispatch({ type: types.INITIALIZE_BOT_CHAT_STARTED }); + const data = await dispatch( + sendHttpRequest(api.initializeChat(sessionId)) + ); + dispatch({ + type: types.INITIALIZE_BOT_CHAT_SUCCESS, + payload: data + }); + } catch (error) { + throw error; + } + }; +} + +export function saveMessage( + chatId, + messageSourceId, + messageDate, + messageContent +) { + return async function(dispatch, getState) { + try { + const event = await dispatch( + sendHttpRequest( + api.saveMessage(chatId, messageSourceId, messageDate, messageContent) + ) + ); + dispatch({ type: types.SAVE_BOT_MESSAGE_SUCCESS, payload: event }); + return event; + } catch (error) { + throw error; + } + }; +} diff --git a/src/features/chatbot/actionTypes.js b/src/features/chatbot/actionTypes.js index 4ba513d..b81c657 100644 --- a/src/features/chatbot/actionTypes.js +++ b/src/features/chatbot/actionTypes.js @@ -1,2 +1,8 @@ export const DISMISS_BOT = "DISMISS_BOT"; export const SUMMON_WIZARD = "SUMMON_WIZARD"; + +export const INITIALIZE_BOT_SESSION_STARTED = "INITIALIZE_BOT_SESSION_STARTED"; +export const INITIALIZE_BOT_SESSION_SUCCESS = "INITIALIZE_BOT_SESSION_SUCCESS"; +export const INITIALIZE_BOT_CHAT_STARTED = "INITIALIZE_BOT_CHAT_STARTED"; +export const INITIALIZE_BOT_CHAT_SUCCESS = "INITIALIZE_BOT_CHAT_SUCCESS"; +export const SAVE_BOT_MESSAGE_SUCCESS = "SAVE_BOT_MESSAGE_SUCCESS"; diff --git a/src/features/chatbot/api.js b/src/features/chatbot/api.js new file mode 100644 index 0000000..c15fa27 --- /dev/null +++ b/src/features/chatbot/api.js @@ -0,0 +1,21 @@ +import { get, post } from "../../api/axiosApi"; +const baseUrl = process.env.CHATBOT_API_URL; + +const getBotSession = (botName, externalId, clientApplication, userKey) => + get( + `${baseUrl}/system/initialize-session/${botName}/${externalId}/${clientApplication}/${userKey}` + ); +const initializeChat = () => get(`${baseUrl}/chat/initialize`); +const saveMessage = (chatId, messageSourceId, messageDate, messageContent) => + post(`${baseUrl}/chat/message`, { + chatId, + messageSourceId, + messageDate, + messageContent + }); + +export default { + getBotSession, + initializeChat, + saveMessage +}; diff --git a/src/features/chatbot/botType.js b/src/features/chatbot/botType.js deleted file mode 100644 index 3512fa9..0000000 --- a/src/features/chatbot/botType.js +++ /dev/null @@ -1,4 +0,0 @@ -export const botType = { - none: Symbol("none"), - wizard: Symbol("wizard") -}; diff --git a/src/features/chatbot/components/BotsManager.js b/src/features/chatbot/components/BotsManager.js index 64e9ef9..2e284c9 100644 --- a/src/features/chatbot/components/BotsManager.js +++ b/src/features/chatbot/components/BotsManager.js @@ -2,10 +2,10 @@ import React, { useEffect, useState } from "react"; import PropTypes from "prop-types"; import { connect } from "react-redux"; import { bindActionCreators } from "redux"; -import { botType } from "../botType"; +import { botType, bots, userKey } from "../constants"; import Wizard from "./Wizard"; import { makeStyles } from "@material-ui/core/styles"; -import { dismissBot } from "../actionCreators"; +import { dismissBot, loadBotSession } from "../actionCreators"; const useStyles = makeStyles(theme => ({ bot: { @@ -24,7 +24,11 @@ const BotsManager = ({ bot, actions }) => { const classes = useStyles(); useEffect(() => { - if (bot.type) setType(bot.type); + if (!bot.type) return; + setType(bot.type); + + if (bot.type == botType.none) return; + actions.loadBotSession(bots.Zirhan, userKey.unknown); }, [bot.type]); return ( @@ -49,7 +53,7 @@ function mapStateToProps(state) { function mapDispatchToProps(dispatch) { return { - actions: bindActionCreators({ dismissBot }, dispatch) + actions: bindActionCreators({ dismissBot, loadBotSession }, dispatch) }; } diff --git a/src/features/chatbot/components/Wizard.js b/src/features/chatbot/components/Wizard.js index aa80c25..d2bd761 100644 --- a/src/features/chatbot/components/Wizard.js +++ b/src/features/chatbot/components/Wizard.js @@ -4,6 +4,7 @@ import ChatBot from "react-simple-chatbot"; import { ThemeProvider } from "styled-components"; import { useTheme } from "@material-ui/core/styles"; import { useTranslation } from "react-i18next"; +import { bots } from "../constants"; const Wizard = ({ dismissBot }) => { const theme = useTheme(); @@ -88,7 +89,7 @@ const Wizard = ({ dismissBot }) => { handleEnd={handleEnd} steps={steps} botAvatar={getAvatar()} - headerTitle="Zirhan" + headerTitle={bots.Zirhan} /> ); diff --git a/src/features/chatbot/constants.js b/src/features/chatbot/constants.js new file mode 100644 index 0000000..ceb8cce --- /dev/null +++ b/src/features/chatbot/constants.js @@ -0,0 +1,12 @@ +export const botType = { + none: Symbol("none"), + wizard: Symbol("wizard") +}; + +export const bots = { + Zirhan: "Zirhan" +}; + +export const userKey = { + unknown: "Unknown" +}; diff --git a/src/features/chatbot/reducer.js b/src/features/chatbot/reducer.js index b8220c9..a697426 100644 --- a/src/features/chatbot/reducer.js +++ b/src/features/chatbot/reducer.js @@ -1,6 +1,6 @@ import * as types from "./actionTypes"; import initialState from "../../redux/reducers/initialState"; -import { botType } from "./botType"; +import { botType } from "./constants"; export default function chatbotReducer(state = initialState.bot, action) { switch (action.type) { @@ -10,6 +10,24 @@ export default function chatbotReducer(state = initialState.bot, action) { case types.DISMISS_BOT: return { ...state, type: botType.none }; + case types.INITIALIZE_BOT_SESSION_STARTED: + return { ...state, session: { loading: true, loaded: false } }; + + case types.INITIALIZE_BOT_SESSION_SUCCESS: + return { + ...state, + session: { loading: false, loaded: true, ...action.payload } + }; + + case types.INITIALIZE_BOT_CHAT_STARTED: + return { ...state, chat: { loading: true, loaded: false } }; + + case types.INITIALIZE_BOT_CHAT_SUCCESS: + return { + ...state, + chat: { loading: false, loaded: true, ...action.payload } + }; + default: return state; } diff --git a/src/redux/reducers/initialState.js b/src/redux/reducers/initialState.js index 026f328..90d82a9 100644 --- a/src/redux/reducers/initialState.js +++ b/src/redux/reducers/initialState.js @@ -19,7 +19,9 @@ export default { type: null }, bot: { - type: null + type: null, + session: { loading: false, loaded: false }, + chat: { loading: false, loaded: false } }, ajaxCallsInProgress: 0 }; diff --git a/webpack.config.dev.js b/webpack.config.dev.js index 7b03efd..c5e0b88 100644 --- a/webpack.config.dev.js +++ b/webpack.config.dev.js @@ -26,7 +26,8 @@ module.exports = { new webpack.DefinePlugin({ "process.env.REVERSE_PROXY_API_URL": JSON.stringify( "http://localhost:5050" - ) + ), + "process.env.CHATBOT_API_URL": JSON.stringify("http://localhost:5061") }), new HtmlWebpackPlugin({ template: "src/index.html", diff --git a/webpack.config.prod.js b/webpack.config.prod.js index 1c205a6..0275ec0 100644 --- a/webpack.config.prod.js +++ b/webpack.config.prod.js @@ -3,7 +3,7 @@ const path = require("path"); const HtmlWebpackPlugin = require("html-webpack-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const webpackBundleAnalyzer = require("webpack-bundle-analyzer"); -const CopyPlugin = require('copy-webpack-plugin'); +const CopyPlugin = require("copy-webpack-plugin"); process.env.NODE_ENV = "production"; process.env.PUBLIC_URL = "/reverse-proxy"; @@ -32,6 +32,9 @@ module.exports = { "process.env.PUBLIC_URL": JSON.stringify(process.env.PUBLIC_URL), "process.env.REVERSE_PROXY_API_URL": JSON.stringify( "https://toodle.ddns.net/reverse-proxy-api" + ), + "process.env.CHATBOT_API_URL": JSON.stringify( + "https://toodle.ddns.net/chatbot-api" ) }), new HtmlWebpackPlugin({ @@ -52,9 +55,7 @@ module.exports = { } }), new CopyPlugin({ - patterns: [ - { from: 'public', to: 'public' } - ], + patterns: [{ from: "public", to: "public" }] }) ], module: {