Skip to content

Commit

Permalink
conversation observer for chat editor toggling
Browse files Browse the repository at this point in the history
  • Loading branch information
michelson committed Nov 15, 2023
1 parent f154763 commit 08b8c72
Show file tree
Hide file tree
Showing 6 changed files with 99 additions and 8 deletions.
4 changes: 0 additions & 4 deletions TODO.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,6 @@ TODO.md

+ tour manager url is hardcoded!

APP PACKAGES:
confirm phase not

# MESSENGER WIDGET

+ animations transitions
Expand Down Expand Up @@ -42,7 +39,6 @@ APP PACKAGES:
+ display block
appBlockAppPackage

+ notify typing
+ hide text chat on wait package

+ articles frame are not in iframe, iframeize it
Expand Down
2 changes: 2 additions & 0 deletions app/javascript/controllers/messenger_controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -286,6 +286,8 @@ export default class extends Controller {
// console.log('Received message from parent:', event.data);
}



streamListener() {
const element = document.querySelector(
'#chaskiq-streams turbo-cable-stream-source'
Expand Down
92 changes: 92 additions & 0 deletions app/javascript/controllers/messenger_conversation_controller.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
import { Controller } from '@hotwired/stimulus';

export default class extends Controller {
static targets = ["conversationPart"];

connect() {
this.observer = new MutationObserver(mutations => this.onMutation(mutations));
this.observeConversation();
this.checkForInput()
}

disconnect() {
this.observer.disconnect();
}

observeConversation() {
const conversationElement = this.element;
console.log("OVSERVE", this.element)
this.observer.observe(conversationElement, { childList: true });
}

onMutation(mutations) {
mutations.forEach(mutation => {
console.log(mutation)
if (mutation.type === 'childList') {
// Handle added or removed conversation parts
this.handleConversationChange();
}
});
this.handleConversationChange();
console.log("mutation observed cycle")
}

handleConversationChange() {
// Your logic here, executed when conversation parts change
console.log('Conversation parts have changed.');
this.checkForInput()
}

checkForInput(){
const state = this.isInputEnabled()
if(state){
document.getElementById("chat-editor").classList.remove("hidden")
}else {
document.getElementById("chat-editor").classList.add("hidden")
}

console.log("INPUT RNABLED", state)
}


isInputEnabled() {

const conversationData = this.element.dataset

if(conversationData.closed === "true") return true

if(!this.hasConversationPartTarget) return true

/*if(!this.hasConversationTarget) return
if (this.conversationTarget.closed === 'closed') {
if (isInboundRepliesClosed()) {
return false;
}
return false
}*/

//if (isEmpty(conversation.messages)) return true;

/*const messages = conversation.messages.collection;
if (messages.length === 0) return true;
const message = messages[0].message;
if (isEmpty(message.blocks)) return true;
if (message.blocks && message.blocks.type === 'wait_for_reply') return true;
// strict comparison of false
if (message.blocks && message.blocks.wait_for_input === false) return true;
if (message.blocks && message.blocks.waitForInput === false) return true;*/
const message = this.conversationPartTargets[0]

const data = message.dataset

if(data.blockKind === "app_package" || data.blockKind === "ask_option"){
if( data.replied === "true") return true
return false
}

return true
}
}
2 changes: 2 additions & 0 deletions app/views/messenger/conversations/_conversation.erb
Original file line number Diff line number Diff line change
Expand Up @@ -39,9 +39,11 @@
<div class="cache-emo-1prjld7 fade-in-bottom"
data-infinite-scroll-target="entries"
data-messenger-target="conversation"
data-controller="messenger-conversation"
data-messenger-target="animated"
data-in="fade-in-bottom"
data-out="fade-out-bottom"
data-closed="<%= conversation.closed? %>"
data-conversation-key="<%= conversation.key %>"
id="conversation-<%= conversation.key %>">

Expand Down
6 changes: 2 additions & 4 deletions app/views/messenger/conversations/_text_editor.erb
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@

<div class="cache-emo-1c9rau9" id="text_editor-<%= conversation.key %>">

<%= Time.now.to_i %>
<% if conversation.state == "closed" && app.inbound_replies_closed_for?(user) %>
<div class="h-[93px] top-[-60px] bg-white absolute flex flex-col justify-center items-center w-full">
<p class="text-xs py-2">
Expand All @@ -17,7 +16,7 @@

</div>
<% else %>
<div class="cache-emo-1ndl2to">
<div class="cache-emo-1ndl2to" id="chat-editor">
<div class="cache-emo-dddhpq">

<div class="absolute bottom-[17px] left-[13px] z-50 hidden" data-messenger-target="loader">
Expand Down Expand Up @@ -54,8 +53,7 @@
<input type="text"
placeholder="search gifs in giphy"
class="block w-full rounded-md border-0 py-1.5 px-1 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
data-messenger-target="giphySearchInput" data-action="messenger#debouncedGiphySearch">
</input>
data-messenger-target="giphySearchInput" data-action="messenger#debouncedGiphySearch" />
<div data-messenger-target="giphyList"
class="mx-2 mt-2 flex flex-col overflow-y-auto h-[213px]">
</div>
Expand Down
1 change: 1 addition & 0 deletions app/views/messenger/messages/_conversation_part.erb
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
data: {
controller: "conversation-part-wrapper",
messenger_target: "conversationPart",
messenger_conversation_target: "conversationPart",
is_new: message.new_record?,
read: message.read?,
request_next_trigger: message.request_next_trigger,
Expand Down

0 comments on commit 08b8c72

Please sign in to comment.