feat(headless): add sample for smart snippet controller #920
Conversation
olamothe
requested review from
btaillon-coveo,
nbuissoncoveo,
samisayegh and
ThibodeauJF
as code owners
|
Pull Request Report PR Title ✅ Title follows the conventional commit spec. Bundle Size
|
...adless/src/controllers/smart-snippet-questions-list/headless-smart-snippet-questions-list.ts
Outdated
Show resolved
Hide resolved
| return ( | ||
| <div style={{textAlign: 'left'}}> | ||
| People also ask: | ||
| <dl> |
There was a problem hiding this comment.
Interesting tag choices, first time I learn of them. Are dl, dd they recommended for this kind of UI? I'm not clear on what the difference between a description list and unordered is
There was a problem hiding this comment.
I thought it fits well for a quick sample demo.
OOTB, it indents the answer under each question.
The
HTML element represents a description list. The element encloses a list of groups of terms (specified using the
- element) and descriptions (provided by
- elements). Common uses for this element are to implement a glossary or to display metadata (a list of key-value pairs).
| } = this.state; | ||
|
|
||
| if (!answerFound) { | ||
| return <div>Sorry, no answer has been found for this query.</div>; |
There was a problem hiding this comment.
Should we just return null in this case?
There was a problem hiding this comment.
For a sample purpose, I find it more meaningful to be more explicit about what that state mean.
That's a pattern we see in quite a lot of sample (eg: search status), that I find very useful.
I don't expect users to blindly copy paste that as is in their own app, but to get a general understanding of what it's about.
| marginBottom: '10px', | ||
| maskImage: maskImage(), | ||
| WebkitMaskImage: maskImage(), | ||
| }; |
There was a problem hiding this comment.
What is the mask image for?
There was a problem hiding this comment.
Adds a "blur" effect at the bottom of the answer when it is collapsed, to give a better sense that "this can be expanded".
https://coveord.atlassian.net/browse/KIT-782