Skip to content
This repository was archived by the owner on Jun 3, 2025. It is now read-only.

Commit 488df28

Browse files
authored
Merge pull request #78 from SAPConversationalAI/mergeToOpenSource
Merge to open source
2 parents e0618ab + 8059512 commit 488df28

File tree

9 files changed

+261
-19
lines changed

9 files changed

+261
-19
lines changed

package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "webchat",
3-
"version": "1.4.37",
3+
"version": "1.4.38",
44
"description": "",
55
"main": "lib/index.js",
66
"scripts": {

src/components/Input/index.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { safeArrayOfItem } from 'helpers'
88
import Menu from 'components/Menu'
99
import MenuSVG from 'components/svgs/menu'
1010
import './style.scss'
11+
import { pathOr } from 'ramda'
1112

1213
// Number of minimum char to display the char limit.
1314
const NUMBER_BEFORE_LIMIT = 5
@@ -106,7 +107,8 @@ class Input extends Component {
106107
}
107108
sendMenuSelection = (action) => {
108109
if (action) {
109-
this.props.onSubmit(action)
110+
const title = pathOr(null, ['content', 'title'], action)
111+
this.props.onSubmit(action, title)
110112
}
111113
}
112114
sendMessage = () => {
@@ -115,7 +117,7 @@ class Input extends Component {
115117
this.props.onSubmit({
116118
type: 'text',
117119
content,
118-
})
120+
}, content.title)
119121
this.setState(prevState => {
120122
const historyValues = append(content, prevState.historyValues)
121123
const previousValues = append('', historyValues)

src/components/Message/QuickReplies.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { truncate, safeArrayOfItem, validButtonContent } from 'helpers'
1010

1111
import Text from './Text'
1212
import { PrevArrow, NextArrow } from 'components/arrows'
13+
import { pathOr } from 'ramda'
1314

1415
class QuickReplies extends Component {
1516
state = {
@@ -46,8 +47,9 @@ class QuickReplies extends Component {
4647
// then one button click has already been send.
4748
if (!this._messageHasAlreadyBeenSent) {
4849
this._messageHasAlreadyBeenSent = true
50+
const title = pathOr(null, ['content', 'title'], message)
4951
this.setState({ displayQuickReplies: false }, () => {
50-
this.props.sendMessage(message)
52+
this.props.sendMessage(message, title)
5153
})
5254
}
5355
}

src/components/Message/index.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,13 @@ import Picture from './Picture'
1212
import Carousel from './Carousel'
1313
import QuickReplies from './QuickReplies'
1414

15+
// Replace cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css with ours to avoid
16+
// conflicts in other slick.scss
17+
import './styleMin.scss'
18+
19+
// Replace cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css with ours to avoid
20+
// conflicts in other slick.scss
21+
import './styleThemeMin.scss'
1522
import './style.scss'
1623

1724
class Message extends Component {
Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
.CaiAppCarousel,
2+
.CaiAppQuickReplies {
3+
.slick-list,.slick-slider,.slick-track {
4+
position: relative;
5+
display: block;
6+
}
7+
8+
.slick-loading .slick-slide,.slick-loading .slick-track {
9+
visibility: hidden;
10+
}
11+
12+
.slick-slider {
13+
box-sizing: border-box;
14+
-webkit-user-select: none;
15+
-moz-user-select: none;
16+
-ms-user-select: none;
17+
user-select: none;
18+
-webkit-touch-callout: none;
19+
-khtml-user-select: none;
20+
-ms-touch-action: pan-y;
21+
touch-action: pan-y;
22+
-webkit-tap-highlight-color: transparent;
23+
}
24+
25+
.slick-list {
26+
overflow: hidden;
27+
margin: 0;
28+
padding: 0;
29+
}
30+
31+
.slick-list:focus {
32+
outline: 0;
33+
}
34+
35+
.slick-list.dragging {
36+
cursor: pointer;
37+
cursor: hand;
38+
}
39+
40+
.slick-slider .slick-list,.slick-slider .slick-track {
41+
-webkit-transform: translate3d(0,0,0);
42+
-moz-transform: translate3d(0,0,0);
43+
-ms-transform: translate3d(0,0,0);
44+
-o-transform: translate3d(0,0,0);
45+
transform: translate3d(0,0,0);
46+
}
47+
48+
.slick-track {
49+
top: 0;
50+
left: 0;
51+
}
52+
53+
.slick-track:after,.slick-track:before {
54+
display: table;
55+
content: '';
56+
}
57+
58+
.slick-track:after {
59+
clear: both;
60+
}
61+
62+
.slick-slide {
63+
display: none;
64+
float: left;
65+
height: 100%;
66+
min-height: 1px;
67+
}
68+
69+
[dir=rtl] .slick-slide {
70+
float: right;
71+
}
72+
73+
.slick-slide img {
74+
display: block;
75+
}
76+
77+
.slick-slide.slick-loading img {
78+
display: none;
79+
}
80+
81+
.slick-slide.dragging img {
82+
pointer-events: none;
83+
}
84+
85+
.slick-initialized .slick-slide {
86+
display: block;
87+
}
88+
89+
.slick-vertical .slick-slide {
90+
display: block;
91+
height: auto;
92+
border: 1px solid transparent;
93+
}
94+
95+
.slick-arrow.slick-hidden {
96+
display: none;
97+
}
98+
}
Lines changed: 143 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,143 @@
1+
.CaiAppCarousel,
2+
.CaiAppQuickReplies {
3+
.slick-dots,.slick-next,.slick-prev {
4+
position: absolute;
5+
display: block;
6+
padding: 0;
7+
}
8+
9+
.slick-dots li button:before,.slick-next:before,.slick-prev:before {
10+
font-family: slick;
11+
-webkit-font-smoothing: antialiased;
12+
-moz-osx-font-smoothing: grayscale;
13+
}
14+
15+
.slick-next,.slick-prev {
16+
font-size: 0;
17+
line-height: 0;
18+
top: 50%;
19+
width: 20px;
20+
height: 20px;
21+
-webkit-transform: translate(0,-50%);
22+
-ms-transform: translate(0,-50%);
23+
transform: translate(0,-50%);
24+
cursor: pointer;
25+
color: transparent;
26+
outline: 0;
27+
background: 0 0;
28+
}
29+
30+
.slick-next:focus,.slick-next:hover,.slick-prev:focus,.slick-prev:hover {
31+
color: transparent;
32+
outline: 0;
33+
background: 0 0;
34+
}
35+
36+
.slick-next:focus:before,.slick-next:hover:before,.slick-prev:focus:before,.slick-prev:hover:before {
37+
opacity: 1;
38+
}
39+
40+
.slick-next.slick-disabled:before,.slick-prev.slick-disabled:before {
41+
opacity: .25;
42+
}
43+
44+
.slick-next:before,.slick-prev:before {
45+
font-size: 20px;
46+
line-height: 1;
47+
opacity: .75;
48+
color: #fff;
49+
}
50+
51+
.slick-prev {
52+
left: -25px;
53+
}
54+
55+
[dir=rtl] .slick-prev {
56+
right: -25px;
57+
left: auto;
58+
}
59+
60+
.slick-prev:before {
61+
content: '';
62+
}
63+
64+
.slick-next:before,[dir=rtl] .slick-prev:before {
65+
content: '';
66+
}
67+
68+
.slick-next {
69+
right: -25px;
70+
}
71+
72+
[dir=rtl] .slick-next {
73+
right: auto;
74+
left: -25px;
75+
}
76+
77+
[dir=rtl] .slick-next:before {
78+
content: '';
79+
}
80+
81+
.slick-dotted.slick-slider {
82+
margin-bottom: 30px;
83+
}
84+
85+
.slick-dots {
86+
bottom: -25px;
87+
width: 100%;
88+
margin: 0;
89+
list-style: none;
90+
text-align: center;
91+
}
92+
93+
.slick-dots li {
94+
position: relative;
95+
display: inline-block;
96+
width: 20px;
97+
height: 20px;
98+
margin: 0 5px;
99+
padding: 0;
100+
cursor: pointer;
101+
}
102+
103+
.slick-dots li button {
104+
font-size: 0;
105+
line-height: 0;
106+
display: block;
107+
width: 20px;
108+
height: 20px;
109+
padding: 5px;
110+
cursor: pointer;
111+
color: transparent;
112+
border: 0;
113+
outline: 0;
114+
background: 0 0;
115+
}
116+
117+
.slick-dots li button:focus,.slick-dots li button:hover {
118+
outline: 0;
119+
}
120+
121+
.slick-dots li button:focus:before,.slick-dots li button:hover:before {
122+
opacity: 1;
123+
}
124+
125+
.slick-dots li button:before {
126+
font-size: 6px;
127+
line-height: 20px;
128+
position: absolute;
129+
top: 0;
130+
left: 0;
131+
width: 20px;
132+
height: 20px;
133+
content: '';
134+
text-align: center;
135+
opacity: .25;
136+
color: #000;
137+
}
138+
139+
.slick-dots li.slick-active button:before {
140+
opacity: .75;
141+
color: #000;
142+
}
143+
}

src/containers/App/index.js

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ const NO_LOCALSTORAGE_MESSAGE
2424
removeAllMessages,
2525
},
2626
)
27+
2728
class App extends Component {
2829
state = {
2930
expanded: this.props.expanded || false,
@@ -90,7 +91,7 @@ class App extends Component {
9091
}
9192

9293
componentDidUpdate (prevProps, prevState) {
93-
const { onToggle, conversationHistoryId } = this.props
94+
const { onToggle } = this.props
9495

9596
if (prevState.expanded !== this.state.expanded) {
9697
if (window.localStorage) {
@@ -146,17 +147,6 @@ class App extends Component {
146147

147148
return (
148149
<div className='RecastApp CaiApp'>
149-
<link
150-
rel='stylesheet'
151-
type='text/css'
152-
href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.min.css'
153-
/>
154-
<link
155-
rel='stylesheet'
156-
type='text/css'
157-
href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css'
158-
/>
159-
160150
<Expander
161151
show={!expanded}
162152
onClick={this.toggleChat}

src/containers/Chat/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -253,7 +253,7 @@ class Chat extends Component {
253253
}
254254

255255
this.setState(
256-
prevState => ({ messages: concat(prevState.messages, [backendMessage]) }),
256+
prevState => ({ messages: concat(prevState.messages, [userMessage || backendMessage]) }),
257257
() => {
258258
if (sendMessagePromise) {
259259
addUserMessage(userMessage || backendMessage)

0 commit comments

Comments
 (0)