-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Andrew Lundy
authored and
Andrew Lundy
committed
Mar 4, 2024
1 parent
b222eab
commit d1b5b03
Showing
7 changed files
with
214 additions
and
175 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,43 @@ | ||
| .chat-content { | ||
| position: relative; | ||
| font-weight: 400; | ||
| line-height: 1.3; | ||
| max-width: 70%; | ||
| padding: 10px; | ||
| font-size: 0.875em; | ||
| border-radius: 10px 10px 0; | ||
| float: right; | ||
| margin-left: 40px; | ||
| } | ||
|
|
||
| .chat-content.chat-bot-v4 { | ||
| background-color: #fff !important; | ||
| padding: 0 !important; | ||
| max-width: 100%; | ||
| overflow: hidden; | ||
| } | ||
|
|
||
| .agent.chat-content { | ||
| color: #000000; | ||
| background: #F2F2F3; | ||
| border-radius: 10px 10px 10px 0; | ||
| float: left; | ||
| } | ||
|
|
||
| /* .chasitor.chat-content { | ||
| background: #1f1f28; | ||
| color: #fff; | ||
| margin-left: auto; | ||
| } */ | ||
|
|
||
| .message-hidden{ | ||
| display:none; | ||
| } | ||
|
|
||
| .slds-rich-text-editor__output > span { | ||
| display: block; | ||
| text-align: left; | ||
| } | ||
|
|
||
| /* loader */ | ||
| .chat-content { | ||
| position: relative; | ||
| font-weight: 400; | ||
| line-height: 1.3; | ||
| max-width: 70%; | ||
| padding: 10px; | ||
| font-size: 0.875em; | ||
| border-radius: 10px 10px 0; | ||
| float: right; | ||
| margin-left: 40px; | ||
| } | ||
|
|
||
| .chat-content.chat-bot-v4 { | ||
| background-color: #fff !important; | ||
| padding: 0 !important; | ||
| max-width: 100%; | ||
| overflow: hidden; | ||
| } | ||
|
|
||
| .agent.chat-content { | ||
| color: #000000; | ||
| background: #F2F2F3; | ||
| border-radius: 10px 10px 10px 0; | ||
| float: left; | ||
| } | ||
|
|
||
| /* .chasitor.chat-content { | ||
| background: #1f1f28; | ||
| color: #fff; | ||
| margin-left: auto; | ||
| } */ | ||
|
|
||
| .message-hidden{ | ||
| display:none; | ||
| } | ||
|
|
||
| .slds-rich-text-editor__output > span { | ||
| display: block; | ||
| text-align: left; | ||
| } | ||
|
|
||
| /* loader */ | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,16 +1,16 @@ | ||
| <template> | ||
| <!-- DEFAULT CHAT TEMPLATE --> | ||
| <div class={messageStyle}> | ||
| <lightning-formatted-rich-text value={strMessage}></lightning-formatted-rich-text> | ||
| <template if:true={showLoader} > | ||
| <span class="loader"> | ||
| <div class="tiblock"> | ||
| <div class="tidot"></div> | ||
| <div class="tidot"></div> | ||
| <div class="tidot"></div> | ||
| </div> | ||
| </span> | ||
| </template> | ||
| </div> | ||
|
|
||
| <template> | ||
| <!-- DEFAULT CHAT TEMPLATE --> | ||
| <div class={messageStyle}> | ||
| <lightning-formatted-rich-text value={strMessage}></lightning-formatted-rich-text> | ||
| <template if:true={showLoader} > | ||
| <span class="loader"> | ||
| <div class="tiblock"> | ||
| <div class="tidot"></div> | ||
| <div class="tidot"></div> | ||
| <div class="tidot"></div> | ||
| </div> | ||
| </span> | ||
| </template> | ||
| </div> | ||
|
|
||
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,58 +1,58 @@ | ||
| import BaseChatMessage from 'lightningsnapin/baseChatMessage'; | ||
| import { track } from 'lwc'; | ||
|
|
||
| const CHAT_CONTENT_CLASS = 'chat-content rich-content-wrapper'; | ||
| const CHAT_BOT_V4_CLASS = 'chat-bot-v4'; | ||
| const AGENT_USER_TYPE = 'agent'; | ||
| const CHASITOR_USER_TYPE = 'chasitor'; | ||
| const SUPPORTED_USER_TYPES = [AGENT_USER_TYPE, CHASITOR_USER_TYPE]; | ||
|
|
||
| const V1_KEY = '&&version1&&'; | ||
| const V2_KEY = '&&version2&&'; | ||
| const V3_KEY = '&&version3&&'; | ||
| const V4_KEY = '&&version4&&'; | ||
| const VERSIONS_LIST = [V1_KEY, V2_KEY, V3_KEY, V4_KEY]; | ||
|
|
||
| export default class Lwcchatpack extends BaseChatMessage | ||
| { | ||
| @track strMessage = ''; | ||
| @track showLoader = false; | ||
| connectedCallback() | ||
| { | ||
| this.strMessage = this.messageContent.value; | ||
| const isSupported = this.isSupportedUserType(this.userType); | ||
| if (isSupported) | ||
| { | ||
| this.showLoader = this.userType === AGENT_USER_TYPE; | ||
| this.messageStyle = `${CHAT_CONTENT_CLASS} ${this.userType}`; | ||
| VERSIONS_LIST.forEach((itemKey) => { | ||
| if(this.strMessage.includes(itemKey)) { | ||
| this.strMessage = this.strMessage.replace(itemKey, ''); | ||
| if (itemKey === V4_KEY) { | ||
| this.messageStyle = `${CHAT_CONTENT_CLASS} ${CHAT_BOT_V4_CLASS} ${this.userType}`; | ||
| } | ||
| } | ||
| }) | ||
| if(this.showLoader){ | ||
| this.messageStyle = `${this.messageStyle} has-loader` | ||
| } | ||
| this.strMessage = this.strMessage.replace(/<a\shref=[\s\S]+target='_blank'>/g, '').replace(/<\/a>/g, '').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(///g, "/"); | ||
| } | ||
| else | ||
| { | ||
| throw new Error('Unsupported user type passed in: ${this.userType}'); | ||
| } | ||
| } | ||
|
|
||
|
|
||
| isSupportedUserType(userType) | ||
| { | ||
| return SUPPORTED_USER_TYPES.some((supportedUserType) => supportedUserType === userType); | ||
| } | ||
| import BaseChatMessage from 'lightningsnapin/baseChatMessage'; | ||
| import { track } from 'lwc'; | ||
|
|
||
| const CHAT_CONTENT_CLASS = 'chat-content rich-content-wrapper'; | ||
| const CHAT_BOT_V4_CLASS = 'chat-bot-v4'; | ||
| const AGENT_USER_TYPE = 'agent'; | ||
| const CHASITOR_USER_TYPE = 'chasitor'; | ||
| const SUPPORTED_USER_TYPES = [AGENT_USER_TYPE, CHASITOR_USER_TYPE]; | ||
|
|
||
| const V1_KEY = '&&version1&&'; | ||
| const V2_KEY = '&&version2&&'; | ||
| const V3_KEY = '&&version3&&'; | ||
| const V4_KEY = '&&version4&&'; | ||
| const VERSIONS_LIST = [V1_KEY, V2_KEY, V3_KEY, V4_KEY]; | ||
|
|
||
| export default class Lwcchatpack extends BaseChatMessage | ||
| { | ||
| @track strMessage = ''; | ||
| @track showLoader = false; | ||
| connectedCallback() | ||
| { | ||
| this.strMessage = this.messageContent.value; | ||
| const isSupported = this.isSupportedUserType(this.userType); | ||
| if (isSupported) | ||
| { | ||
| this.showLoader = this.userType === AGENT_USER_TYPE; | ||
| this.messageStyle = `${CHAT_CONTENT_CLASS} ${this.userType}`; | ||
| VERSIONS_LIST.forEach((itemKey) => { | ||
| if(this.strMessage.includes(itemKey)) { | ||
| this.strMessage = this.strMessage.replace(itemKey, ''); | ||
| if (itemKey === V4_KEY) { | ||
| this.messageStyle = `${CHAT_CONTENT_CLASS} ${CHAT_BOT_V4_CLASS} ${this.userType}`; | ||
| } | ||
| } | ||
| }) | ||
| if(this.showLoader){ | ||
| this.messageStyle = `${this.messageStyle} has-loader` | ||
| } | ||
| this.strMessage = this.strMessage.replace(/<a\shref=[\s\S]+target='_blank'>/g, '').replace(/<\/a>/g, '').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(///g, "/"); | ||
| } | ||
| else | ||
| { | ||
| throw new Error('Unsupported user type passed in: ${this.userType}'); | ||
| } | ||
| } | ||
|
|
||
|
|
||
| isSupportedUserType(userType) | ||
| { | ||
| return SUPPORTED_USER_TYPES.some((supportedUserType) => supportedUserType === userType); | ||
| } | ||
| } |
16 changes: 8 additions & 8 deletions
16
rich-message-lightning-web-component/lwcchatpack.js-meta.xml
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,9 @@ | ||
| <?xml version="1.0" encoding="UTF-8"?> | ||
| <LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata"> | ||
| <apiVersion>48.0</apiVersion> | ||
| <isExposed>true</isExposed> | ||
| <masterLabel>Chat Lightning Web Component Pack</masterLabel> | ||
| <targets> | ||
| <target>lightningSnapin__ChatMessage</target> | ||
| </targets> | ||
| <?xml version="1.0" encoding="UTF-8"?> | ||
| <LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata"> | ||
| <apiVersion>48.0</apiVersion> | ||
| <isExposed>true</isExposed> | ||
| <masterLabel>Chat Lightning Web Component Pack</masterLabel> | ||
| <targets> | ||
| <target>lightningSnapin__ChatMessage</target> | ||
| </targets> | ||
| </LightningComponentBundle> |
Oops, something went wrong.