@botonic/react
Version:
Build Chatbots using React
54 lines • 2.18 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.Handoff = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const constants_1 = require("../constants");
const context_1 = require("../webchat/context");
const Container = styled_components_1.default.div `
display: flex;
font-family: inherit;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 24px;
`;
const TransferredContainer = styled_components_1.default.div `
text-align: center;
white-space: normal;
`;
const EndedContainer = styled_components_1.default.div `
text-align: center;
white-space: normal;
`;
const StyledButton = styled_components_1.default.button `
max-width: 60%;
padding: 12px 24px;
background-color: ${constants_1.COLORS.SOLID_WHITE};
border: none;
border-radius: 4px;
margin-top: 8px;
cursor: pointer;
`;
const Handoff = props => {
const { resolveCase } = (0, react_1.useContext)(context_1.WebchatContext);
const [state, setState] = (0, react_1.useState)({ showContinue: true });
const continueClick = () => {
setState({ showContinue: false });
resolveCase();
};
const bgColor = state.showContinue
? constants_1.COLORS.FRINGY_FLOWER_GREEN
: constants_1.COLORS.TASMAN_GRAY;
const fontColor = state.showContinue
? constants_1.COLORS.APPLE_GREEN
: constants_1.COLORS.CACTUS_GREEN;
return ((0, jsx_runtime_1.jsxs)(Container, Object.assign({ style: {
color: fontColor,
backgroundColor: bgColor,
} }, { children: [state.showContinue ? ((0, jsx_runtime_1.jsx)(TransferredContainer, { children: "Conversation transferred to a human agent..." })) : ((0, jsx_runtime_1.jsx)(EndedContainer, { children: "Human handoff ended" })), state.showContinue && ((0, jsx_runtime_1.jsx)(StyledButton, Object.assign({ onClick: continueClick }, { children: "Continue" })))] })));
};
exports.Handoff = Handoff;
//# sourceMappingURL=handoff.js.map