@php
$ResultNew=json_decode($Result);
echo "<pre>";
// print_r($Det);
// print_r($ResultNew);
echo "</pre>";
$ImgSrc="https://cloudmyschoolone.s3.ap-south-1.amazonaws.com/cloudt.myschoolone.com/cloud/Gallery/PhotoGallery/2023/07/4b53c40101de48e5504ee8bc8b9d496b.jpg";
$conversationLinkingId=$conversationLinkingId;
@endphp
<div class="chat-system">
	<div class="hamburger"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-menu mail-menu d-lg-none"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg></div>
	<div class="user-list-box" style="display:none;">
		<div class="people ps ps--active-y">
			<div class="person" data-chat="{{$Det['UserNumber']}}" id="{{$conversationLinkingId}}">
				<div class="user-info" >
					<div class="f-head">
						<img src="{{$ImgSrc}}" alt="avatar">
					</div>
					<div class="f-body">
						<div class="meta-info">
							<span class="user-name" data-name="Nia Hillyer">{{$Det['Name']}}</span>
						</div>
					</div>
				</div>
			</div>  
		<div class="ps__rail-x" style="left: 0px; bottom: 0px;"><div class="ps__thumb-x" tabindex="0" style="left: 0px; width: 0px;"></div></div><div class="ps__rail-y" style="top: 0px; height: 537px; right: 0px;"><div class="ps__thumb-y" tabindex="0" style="top: 0px; height: 276px;"></div></div></div>
	</div>
	<div class="chat-box">
		<div class="chat-not-selected">
			<p> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-message-square"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg> Click User To Chat</p>
		</div>
		<div class="chat-box-inner">
			<div class="chat-meta-user">
				<div class="current-chat-user-name"><span><img src="assets/img/90x90.jpg" alt="dynamic-image"><span class="name">{{$Det['Name']}}</span></span></div>
				<div class="chat-action-btn align-self-center">
				</div>
			</div>
			<div class="chat-conversation-box">
				<div id="chat-conversation-box-scroll" class="chat-conversation-box-scroll">
					<div class="chat" data-chat="{{$Det['UserNumber']}}">
						@foreach($ResultNew as $EachChatDetails)
							@php
								$MsgDisplayType="you";
								$Message=$EachChatDetails->Message;
								$MessageSendType=$EachChatDetails->MessageSendType;
								//$ConversationLinkingId=$EachChatDetails->ConversationLinkingId;
								$CreatedDate=$EachChatDetails->CreatedDate;
								$WhatsAppConversationId=$EachChatDetails->WhatsAppConversationId;
								if($MessageSendType==1)
								{
									$MsgDisplayType="you";
								}
								elseif($MessageSendType==2)
								{
									$MsgDisplayType="me";
								}
							@endphp
							<div class="conversation-start">
							</div>
							<div class="bubble {{$MsgDisplayType}}" id="{{$WhatsAppConversationId}}" onclick="DisplayTime('{{$WhatsAppConversationId}}')">
								{{$Message}}
								<br>
								<div id="Time{{$WhatsAppConversationId}}" style="display:none;">{{$CreatedDate}}</div>
							</div>
						@endforeach
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="{{asset('')}}/WhatsApp/WhatsAppChat.js"></script>
<script>
var conversationLinkingId='';
var link = document.getElementById(conversationLinkingId);
  link.click();
var myDiv = document.getElementById('');
myDiv.scrollIntoView(); 
function DisplayTime(WhatsAppConversationId)
{
	document.getElementById("Time"+WhatsAppConversationId).style.display = "block";
}
</script>