Add timestamp to the message. Close #16 #17
Conversation
package.json
Outdated
| @@ -53,5 +53,8 @@ | |||
| "!src/core/index.ts", | |||
| "!src/ui/index.ts" | |||
| ] | |||
| }, | |||
| "dependencies": { | |||
There was a problem hiding this comment.
moment is an awesome lib to manipulate date, but it's a heavy lib.
Thinking of keeping the yvebot more customizable as possible, I'd rather leave it for the user to choose.
You can use a formatter function from options, allowing the user to override it:
new YveBot(..., {
timestampable: true,
timestampFormatter: ts => moment(ts).fromNow(),
})I would create a simple formatter as default:
formatTimestamp = ts => new Date(ts).toUTCString().slice(-12, -4);
// 00:19:43
src/ui/bot.ts
Outdated
| const sender = source === 'BOT' ? this.options.name : null; | ||
| const thread = UI.createThread(source, UI.createTextMessage(message, sender)); | ||
| const thread = UI.createThread(source, UI.createTextMessage(message, sender, showTimestamp)); |
There was a problem hiding this comment.
the UI instance has access to options object, so, it's unnecessary to pass as arg [comment below]
src/ui/ui.ts
Outdated
| @@ -179,7 +180,7 @@ export class ChatUI { | |||
| conversation.scrollTop = conversation.scrollHeight; | |||
| } | |||
|
|
|||
| createTextMessage(answer: Answer | Answer[], senderName?: string) { | |||
| createTextMessage(answer: Answer | Answer[], senderName?: string, showTimestamp?: boolean) { | |||
src/ui/ui.ts
Outdated
| @@ -204,6 +205,13 @@ export class ChatUI { | |||
| message.innerHTML = text; | |||
| bubble.appendChild(message); | |||
|
|
|||
| if (showTimestamp) { | |||
There was a problem hiding this comment.
extract it from options
const { ... } = this.options;
src/ui/bot.ts
Outdated
| @@ -19,6 +19,7 @@ export class YveBotChat { | |||
| doneMultipleChoiceLabel: 'Done', | |||
| andSeparatorText: 'and', | |||
| submitLabel: 'Send', | |||
| showTimestamp: true, | |||
src/types.ts
Outdated
| @@ -49,6 +49,7 @@ export interface ChatOptions { | |||
| doneMultipleChoiceLabel?: string; | |||
| andSeparatorText?: string; | |||
| submitLabel?: string; | |||
| showTimestamp?: boolean; | |||
|
Fix the tests, also, create one to ensure this new feature |
|
Thank you for the feedback ! I will happily work on this tonight or tomorrow, i definitely like the date formatter idea better. |
Set webpack to have custom props for node and browser
Expect Type.parser method to be an async function
|
Awesome, @soueuls 🤘 |
# This is the 1st commit message: Add timestamp to the message. # This is the commit message andersonba#2: Timestamp feature is now generic + tests
|
I rebased from master, build the files. I am still learning few things with git 🤕 |
This is my attempt at adding support for timestamp message.
I also added a CSS class so the user can further customize.
This is my first public PR, let me know if there is anything I can do.