Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 11350 | Rev 14577 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 11350 Rev 14176
Línea 1... Línea 1...
1 
import React from "react";
 1 
import React from 'react'
2 
import { useState, useRef, useEffect } from "react";
 2 
import { useState, useRef, useEffect } from 'react'
3 
import styled from "styled-components";
 3 
import styled from 'styled-components'
4 
import { axios } from "../../../utils";
 4 
import { axios } from '../../../utils'
5 
import Spinner from "../../../shared/loading-spinner/Spinner";
 5 
import Spinner from '../../../shared/loading-spinner/Spinner'
6 
import Emojione from "./emojione/Emojione";
 6 
import Emojione from './emojione/Emojione'
7 
import SendFileModal from "./send-file-modal/SendFileModal";
 7 
import SendFileModal from './send-file-modal/SendFileModal'
8 
import ConfirmModal from "../../../shared/confirm-modal/ConfirmModal";
 8 
import ConfirmModal from '../../../shared/confirm-modal/ConfirmModal'
9 
import MessageTemplate from "./messageTemplate/MessageTemplate";
 9 
import MessageTemplate from './messageTemplate/MessageTemplate'
Línea 10... Línea 10...
10 
 
 10 
 
11 
const StyledChatHead = styled.div`
 11 
const StyledChatHead = styled.div`
12 
  .notify {
 12 
  .notify {
13 
    animation: notify 2s infinite;
 13 
    animation: notify 2s infinite;
Línea 22... Línea 22...
22 
    }
 22 
    }
23 
    100% {
 23 
    100% {
24 
      background-color: unset;
 24 
      background-color: unset;
25 
    }
 25 
    }
26 
  }
 26 
  }
27 
`;
 27 
`
Línea 28... Línea 28...
28 
 
 28 
 
29 
const StyledShowOptions = styled.div`
 29 
const StyledShowOptions = styled.div`
30 
  height: 342px;
 30 
  height: 342px;
31 
  flex-direction: column;
 31 
  flex-direction: column;
Línea 63... Línea 63...
63 
      align-items: center;
 63 
      align-items: center;
64 
      padding: 0.2rem 0.5rem;
 64 
      padding: 0.2rem 0.5rem;
65 
      border-bottom: 1px solid #e2e2e2;
 65 
      border-bottom: 1px solid #e2e2e2;
66 
    }
 66 
    }
67 
  }
 67 
  }
68 
`;
 68 
`
Línea 69... Línea 69...
69 
 
 69 
 
467 
              </span>
 468 
							</span>
468 
              Integrantes
 469 
              Integrantes
469 
            </li>
 470 
						</li>
470 
          )}
 471 
					)}
471 
          {!!url_add_user_to_group && (
 472 
					{!!url_add_user_to_group && (
472 
            <li
 473 
						<li
473 
              className="optionsTab__option"
 474 
							className="optionsTab__option"
474 
              onClick={() => handleChangeTab(optionTabs.add_person_to_group)}
 475 
							onClick={() => handleChangeTab(optionTabs.add_person_to_group)}
475 
            >
 476 
						>
476 
              <span className="optionsTab__option__icon">
 477 
							<span className="optionsTab__option__icon">
477 
                <i className="fa fa-user-plus"></i>
 478 
								<i className="fa fa-user-plus"></i>
478 
              </span>
 479 
							</span>
479 
              Agregar contactos
 480 
              Agregar contactos
480 
            </li>
 481 
						</li>
481 
          )}
 482 
					)}
482 
          {!!url_delete && (
 483 
					{!!url_delete && (
483 
            <li
 484 
						<li
484 
              className="optionsTab__option"
 485 
							className="optionsTab__option"
485 
              style={{ color: "red" }}
 486 
							style={{ color: 'red' }}
486 
              onClick={() => {
 487 
							onClick={() => {
487 
                handleConfirmModalShow();
 488 
								handleConfirmModalShow()
488 
                modalActionUrl.current = url_delete;
 489 
								modalActionUrl.current = url_delete
489 
              }}
 490 
							}}
490 
            >
 491 
						>
491 
              <span className="optionsTab__option__icon">
 492 
							<span className="optionsTab__option__icon">
492 
                <i className="fa fa-trash"></i>
 493 
								<i className="fa fa-trash"></i>
493 
              </span>
 494 
							</span>
494 
              Eliminar grupo
 495 
              Eliminar grupo
495 
            </li>
 496 
						</li>
496 
          )}
 497 
					)}
497 
          {!!url_leave && (
 498 
					{!!url_leave && (
498 
            <li
 499 
						<li
499 
              className="optionsTab__option"
 500 
							className="optionsTab__option"
500 
              style={{ color: "red" }}
 501 
							style={{ color: 'red' }}
501 
              onClick={() => {
 502 
							onClick={() => {
502 
                handleConfirmModalShow();
 503 
								handleConfirmModalShow()
503 
                modalActionUrl.current = url_leave;
 504 
								modalActionUrl.current = url_leave
504 
              }}
 505 
							}}
505 
            >
 506 
						>
506 
              <span className="optionsTab__option__icon">
 507 
							<span className="optionsTab__option__icon">
507 
                <i className="fa fa-user-times"></i>
 508 
								<i className="fa fa-user-times"></i>
508 
              </span>
 509 
							</span>
657 
                      {/* <span>
 650 
											{/* <span>
658 
                      <i className="fa fa-trash"></i>
 651 
                      <i className="fa fa-trash"></i>
659 
                    </span> */}
 652 
                    </span> */}
660 
                    </div>
 653 
										</div>
661 
                    <div
 654 
										<div
662 
                      className="btn-group"
 655 
											className="btn-group"
663 
                    // onClick="javascript:clearHistory(\''+chatboxtitle+'\')"
 656 
											// onClick="javascript:clearHistory(\''+chatboxtitle+'\')"
664 
                    // href="javascript:void(0)"
 657 
											// href="javascript:void(0)"
665 
                    >
 658 
										>
666 
                      {/* <span>
 659 
											{/* <span>
667 
                      <i className="fa fa-trash"></i>
 660 
                      <i className="fa fa-trash"></i>
668 
                    </span> */}
 661 
                    </span> */}
669 
                    </div>
 662 
										</div>
670 
                    <div
 663 
										<div
671 
                      className="btn-group"
 664 
											className="btn-group"
672 
                    // onClick="javascript:toggleChatBoxGrowth(\''+chatboxtitle+'\')"
 665 
											// onClick="javascript:toggleChatBoxGrowth(\''+chatboxtitle+'\')"
673 
                    // href="javascript:void(0)"
 666 
											// href="javascript:void(0)"
674 
                    >
 667 
										>
675 
                      <span>
 668 
											<span>
676 
                        <i
 669 
												<i
677 
                          className={`fa fa-minus-circle`}
 670 
													className={'fa fa-minus-circle'}
678 
                          onClick={handleActive}
 671 
													onClick={handleActive}
679 
                        ></i>
 672 
												></i>
680 
                      </span>
 673 
											</span>
681 
                    </div>
 674 
										</div>
682 
                    <div
 675 
										<div
683 
                      className="btn-group"
 676 
											className="btn-group"
684 
                    // onClick="javascript:closeChatBox(\''+chatboxtitle+'\')"
 677 
											// onClick="javascript:closeChatBox(\''+chatboxtitle+'\')"
685 
                    // href="javascript:void(0)"
 678 
											// href="javascript:void(0)"
686 
                    >
 679 
										>
687 
                      <span>
 680 
											<span>
688 
                        <i
 681 
												<i
689 
                          className="fa fa-times-circle"
 682 
													className="fa fa-times-circle"
690 
                          onClick={handleCloseChat}
 683 
													onClick={handleCloseChat}
691 
                        ></i>
 684 
												></i>
692 
                      </span>
 685 
											</span>
693 
                    </div>
 686 
										</div>
694 
                  </div>
 687 
									</div>
695 
                </div>
 688 
								</div>
696 
              </div>
 689 
							</div>
697 
            </div>
 690 
						</div>
698 
          </StyledChatHead>
 691 
					</StyledChatHead>
699 
          <div
 692 
					<div
700 
            className="panel-body"
 693 
						className="panel-body"
701 
            style={{ display: !minimized ? "block" : "none" }}
 694 
						style={{ display: !minimized ? 'block' : 'none' }}
702 
          >
 695 
					>
703 
            <div
 696 
						<div
704 
              id="uploader_'+chatboxtitle+'"
 697 
							id="uploader_'+chatboxtitle+'"
705 
              style={{ display: "none", height: "342px" }}
 698 
							style={{ display: 'none', height: '342px' }}
706 
            >
 699 
						>
707 
              <p>
 700 
							<p>
708 
                Your browser does not have Flash, Silverlight or HTML5 support.
 701 
                Your browser does not have Flash, Silverlight or HTML5 support.
709 
              </p>
 702 
							</p>
710 
            </div>
 703 
						</div>
711 
            <div className="chat-conversation" style={{ position: "relative" }}>
 704 
						<div className="chat-conversation" style={{ position: 'relative' }}>
712 
              <div className="reverseChatBox" ref={conversationListEl}>
 705 
							<div className="reverseChatBox" ref={conversationListEl}>
713 
                <ul
 706 
								<ul
714 
                  className="conversation-list chatboxcontent"
 707 
									className="conversation-list chatboxcontent"
715 
                  id="resultchat_'+chatboxtitle+'"
 708 
									id="resultchat_'+chatboxtitle+'"
716 
                >
 709 
								>
717 
                  {messagesRender()}
 710 
									{messagesRender()}
718 
                </ul>
 711 
								</ul>
719 
              </div>
 712 
							</div>
720 
              <div className="wchat-footer wchat-chat-footer chatboxinput">
 713 
							<div className="wchat-footer wchat-chat-footer chatboxinput">
721 
                <div id="chatFrom" className="chatFrom">
 714 
								<div id="chatFrom" className="chatFrom">
722 
                  <div className={responseMessage ? "resp_messages-container active" : "resp_messages-container"}>
 715 
									<div className={responseMessage ? 'resp_messages-container active' : 'resp_messages-container'}>
723 
                    {
 716 
										{
724 
                      responseMessage
 717 
											responseMessage
725 
                      &&
 718 
                      &&
726 
                      <>
 719 
                      <>
727 
                        <span>{`Respondiendo a ${responseMessage.user_name}`}</span>
 720 
                      	<span>{`Respondiendo a ${responseMessage.user_name}`}</span>
728 
                        <p>{responseMessage.m}</p>
 721 
                      	<p>{responseMessage.m}</p>
729 
                      </>
 722 
                      </>
730 
                    }
 723 
										}
731 
                  </div>
 724 
									</div>
732 
                  <div className="block-wchat">
 725 
									<div className="block-wchat">
733 
                    <button
 726 
										<button
734 
                      className="icon ti-clip attachment font-24 btn-attach btn-attach uploadFile"
 727 
											className="icon ti-clip attachment font-24 btn-attach btn-attach uploadFile"
735 
                      id="uploadFile"
 728 
											id="uploadFile"
736 
                      onClick={handleShareFileModalShow}
 729 
											onClick={handleShareFileModalShow}
737 
                    ></button>
 730 
										></button>
738 
                    <button
 731 
										<button
739 
                      className="icon ti-face-smile font-24 btn-emoji"
 732 
											className="icon ti-face-smile font-24 btn-emoji"
740 
                      id="toggle-emoji"
 733 
											id="toggle-emoji"
741 
                      onClick={handleShowEmojiTab}
 734 
											onClick={handleShowEmojiTab}
742 
                    ></button>
 735 
										></button>
743 
                    <div className="input-container">
 736 
										<div className="input-container">
744 
                      <div className="input-emoji">
 737 
											<div className="input-emoji">
745 
                        <div
 738 
												<div
746 
                          className="input-placeholder"
 739 
													className="input-placeholder"
747 
                          style={{ visibility: "hidden", display: "none" }}
 740 
													style={{ visibility: 'hidden', display: 'none' }}
748 
                        >
 741 
												>
749 
                          Escribe un mensaje
 742 
                          Escribe un mensaje
750 
                        </div>
 743 
												</div>
751 
                        <textarea
 744 
												<textarea
752 
                          className="input chatboxtextarea"
 745 
													className="input chatboxtextarea"
753 
                          id="chatboxtextarea"
 746 
													id="chatboxtextarea"
754 
                          name="chattxt"
 747 
													name="chattxt"
755 
                          style={{ resize: "none", height: "20px" }}
 748 
													style={{ resize: 'none', height: '20px' }}
756 
                          placeholder="Escribe un mensaje"
 749 
													placeholder="Escribe un mensaje"
757 
                          onKeyDown={handleChatBoxKeyDown}
 750 
													onKeyDown={handleChatBoxKeyDown}
758 
                          ref={textAreaEl}
 751 
													ref={textAreaEl}
759 
                          onFocus={()=> onRead(index)}
 752 
													onFocus={() => onRead(index)}
760 
                        ></textarea>
 753 
												></textarea>
761 
                        <input
 754 
												<input
762 
                          id="to_uname"
 755 
													id="to_uname"
763 
                          name="to_uname"
 756 
													name="to_uname"
764 
                          value="'+chatboxtitle+'"
 757 
													value="'+chatboxtitle+'"
765 
                          type="hidden"
 758 
													type="hidden"
766 
                        />
 759 
												/>
767 
                        <input
 760 
												<input
768 
                          id="from_uname"
 761 
													id="from_uname"
769 
                          name="from_uname"
 762 
													name="from_uname"
770 
                          value="Beenny"
 763 
													value="Beenny"
771 
                          type="hidden"
 764 
													type="hidden"
772 
                        />
 765 
												/>
773 
                      </div>
 766 
											</div>
774 
                    </div>
 767 
										</div>
775 
                  </div>
 768 
									</div>
776 
                </div>
 769 
								</div>
777 
                <div className="wchat-box-items-positioning-container">
 770 
								<div className="wchat-box-items-positioning-container">
778 
                  <div className="wchat-box-items-overlay-container">
 771 
									<div className="wchat-box-items-overlay-container">
779 
                    <div
 772 
										<div
780 
                      className="target-emoji"
 773 
											className="target-emoji"
781 
                      style={{ display: showEmojiTab ? "block" : "none" }}
 774 
											style={{ display: showEmojiTab ? 'block' : 'none' }}
782 
                    >
 775 
										>
783 
                      <div id={`smileyPanel_${id}`}>
 776 
											<div id={`smileyPanel_${id}`}>
784 
                        <div>
 777 
												<div>
785 
                          <Emojione onClickEmoji={handleClickEmoji} />
 778 
													<Emojione onClickEmoji={handleClickEmoji} />
786 
                        </div>
 779 
												</div>
787 
                      </div>
 780 
											</div>
788 
                    </div>
 781 
										</div>
789 
                  </div>
 782 
									</div>
790 
                </div>
 783 
								</div>
791 
              </div>
 784 
							</div>
792 
            </div>
 785 
						</div>
793 
          </div>
 786 
					</div>
794 
        </div>
 787 
				</div>
795 
      </div>
 788 
			</div>
796 
      {shareFileModal}
 789 
			{shareFileModal}
797 
    </React.Fragment>
 790 
		</React.Fragment>
798 
  );
 791 
	)
799 
 
 792 
 
800 
  const groupChat = (
 793 
	const groupChat = (
801 
    <React.Fragment>
 794 
		<React.Fragment>
802 
      <div
 795 
			<div
803 
        className="chatbox active-chat"
 796 
				className="chatbox active-chat"
804 
        style={{
 797 
				style={{
805 
          bottom: "0px",
 798 
					bottom: '0px',
806 
          right: `${(index + 1) * 295}px`,
 799 
					right: `${(index + 1) * 295}px`,
807 
          zIndes: "1",
 800 
					zIndes: '1',
808 
          display: "block",
 801 
					display: 'block',
809 
        }}
 802 
				}}
810 
        id={`chatbox_${id}`}
 803 
				id={`chatbox_${id}`}
811 
        ref={chatboxEl}
 804 
				ref={chatboxEl}
812 
      >
 805 
			>
813 
        <div className="chatbox-icon">
 806 
				<div className="chatbox-icon">
814 
          <div className="contact-floating red">
 807 
					<div className="contact-floating red">
815 
            <img className="chat-image img-circle pull-left" src={image} />
 808 
						<img className="chat-image img-circle pull-left" src={image} />
816 
            <small className="unread-msg">2</small>
 809 
						<small className="unread-msg">2</small>
817 
            {/* <small className="status"'+ status+'></small> */}
 810 
						{/* <small className="status"'+ status+'></small> */}
818 
          </div>
 811 
					</div>
819 
        </div>
 812 
				</div>
820 
        <div className="panel personal-chat">
 813 
				<div className="panel personal-chat">
821 
          <StyledChatHead>
 814 
					<StyledChatHead>
822 
            <div
 815 
						<div
823 
              className={`panel-heading chatboxhead ${unsee_messages ? "notify" : ""
 816 
							className={`panel-heading chatboxhead ${unsee_messages ? 'notify' : ''
824 
                }`}
 817 
							}`}
825 
            >
 818 
						>
826 
              <div className="panel-title-group">
 819 
							<div className="panel-title-group">
827 
                <img
 820 
								<img
828 
                  className="chat-image img-circle pull-left"
 821 
									className="chat-image img-circle pull-left"
829 
                  height="36"
 822 
									height="36"
830 
                  width="36"
 823 
									width="36"
831 
                  src="/images/users-group.png"
 824 
									src="/images/users-group.png"
832 
                  alt="avatar-image"
 825 
									alt="avatar-image"
833 
                />
 826 
								/>
834 
                <div className="header-elements">
 827 
								<div className="header-elements">
835 
                  <p>{name}</p>
 828 
									<p>{name}</p>
836 
                  <br />
 829 
									<br />
837 
                  <div className="pull-right options">
 830 
									<div className="pull-right options">
838 
                    <div
 831 
										<div
839 
                      className="btn-group uploadFile"
 832 
											className="btn-group uploadFile"
840 
                      id="uploadFile"
 833 
											id="uploadFile"
841 
                      data-client="'+chatboxtitle+'"
 834 
											data-client="'+chatboxtitle+'"
842 
                    >
 835 
										>
843 
                      {/* <span>
 836 
											{/* <span>
844 
                      <i className="fa fa-trash"></i>
 837 
                      <i className="fa fa-trash"></i>
845 
                    </span> */}
 838 
                    </span> */}
846 
                    </div>
 839 
										</div>
847 
                    <div
 840 
										<div
848 
                      className="btn-group"
 841 
											className="btn-group"
849 
                    // onClick="javascript:clearHistory(\''+chatboxtitle+'\')"
 842 
											// onClick="javascript:clearHistory(\''+chatboxtitle+'\')"
850 
                    // href="javascript:void(0)"
 843 
											// href="javascript:void(0)"
851 
                    >
 844 
										>
852 
                      {/* <span>
 845 
											{/* <span>
853 
                      <i className="fa fa-trash"></i>
 846 
                      <i className="fa fa-trash"></i>
854 
                    </span> */}
 847 
                    </span> */}
855 
                    </div>
 848 
										</div>
856 
                    <div
 849 
										<div
857 
                      className="btn-group addUser"
 850 
											className="btn-group addUser"
858 
                      data-client="8cb2a840-56c2-4f93-9cf1-27ad598acd8f"
 851 
											data-client="8cb2a840-56c2-4f93-9cf1-27ad598acd8f"
859 
                      data-name="Grupo de jesus"
 852 
											data-name="Grupo de jesus"
860 
                    >
 853 
										>
861 
                      <span>
 854 
											<span>
862 
                        <i
 855 
												<i
863 
                          // className="fa fa-user-plus"
 856 
													// className="fa fa-user-plus"
864 
                          className="fa fa-gear"
 857 
													className="fa fa-gear"
865 
                          onClick={handleShowOptions}
 858 
													onClick={handleShowOptions}
866 
                        ></i>
 859 
												></i>
867 
                      </span>
 860 
											</span>
868 
                    </div>
 861 
										</div>
869 
                    <div
 862 
										<div
870 
                      className="btn-group"
 863 
											className="btn-group"
871 
                    // onClick="javascript:toggleChatBoxGrowth(\''+chatboxtitle+'\')"
 864 
											// onClick="javascript:toggleChatBoxGrowth(\''+chatboxtitle+'\')"
872 
                    // href="javascript:void(0)"
 865 
											// href="javascript:void(0)"
873 
                    >
 866 
										>
874 
                      <span>
 867 
											<span>
875 
                        <i
 868 
												<i
876 
                          className={`fa fa-minus-circle`}
 869 
													className={'fa fa-minus-circle'}
877 
                          onClick={handleActive}
 870 
													onClick={handleActive}
878 
                        ></i>
 871 
												></i>
879 
                      </span>
 872 
											</span>
880 
                    </div>
 873 
										</div>
881 
                    <div
 874 
										<div
882 
                      className="btn-group"
 875 
											className="btn-group"
883 
                    // onClick="javascript:closeChatBox(\''+chatboxtitle+'\')"
 876 
											// onClick="javascript:closeChatBox(\''+chatboxtitle+'\')"
884 
                    // href="javascript:void(0)"
 877 
											// href="javascript:void(0)"
885 
                    >
 878 
										>
886 
                      <span>
 879 
											<span>
887 
                        <i
 880 
												<i
888 
                          className="fa fa-times-circle"
 881 
													className="fa fa-times-circle"
889 
                          onClick={handleCloseChat}
 882 
													onClick={handleCloseChat}
890 
                        ></i>
 883 
												></i>
891 
                      </span>
 884 
											</span>
892 
                    </div>
 885 
										</div>
893 
                  </div>
 886 
									</div>
894 
                </div>
 887 
								</div>
895 
              </div>
 888 
							</div>
896 
            </div>
 889 
						</div>
897 
          </StyledChatHead>
 890 
					</StyledChatHead>
898 
          <div
 891 
					<div
899 
            className="panel-body"
 892 
						className="panel-body"
900 
            style={{ display: !minimized ? "block" : "none" }}
 893 
						style={{ display: !minimized ? 'block' : 'none' }}
901 
          >
 894 
					>
902 
            <StyledShowOptions className={` ${showOptions ? "show" : "hide"}`}>
 895 
						<StyledShowOptions className={` ${showOptions ? 'show' : 'hide'}`}>
903 
              {optionRender()}
 896 
							{optionRender()}
904 
            </StyledShowOptions>
 897 
						</StyledShowOptions>
905 
 
 898 
 
906 
            <div
 899 
						<div
907 
              className="chat-conversation"
 900 
							className="chat-conversation"
908 
              style={{
 901 
							style={{
909 
                display: showOptions ? "none" : "block",
 902 
								display: showOptions ? 'none' : 'block',
910 
                position: "relative",
 903 
								position: 'relative',
911 
              }}
 904 
							}}
912 
            >
 905 
						>
913 
              <div className="reverseChatBox" ref={conversationListEl}>
 906 
							<div className="reverseChatBox" ref={conversationListEl}>
914 
                <ul
 907 
								<ul
915 
                  className="conversation-list chatboxcontent"
 908 
									className="conversation-list chatboxcontent"
916 
                  id="resultchat_'+chatboxtitle+'"
 909 
									id="resultchat_'+chatboxtitle+'"
917 
                >
 910 
								>
918 
                  {messagesRender()}
 911 
									{messagesRender()}
919 
                </ul>
 912 
								</ul>
920 
              </div>
 913 
							</div>
921 
              <div className="wchat-footer wchat-chat-footer chatboxinput">
 914 
							<div className="wchat-footer wchat-chat-footer chatboxinput">
922 
                <div id="chatFrom">
 915 
								<div id="chatFrom">
923 
                  <div className="block-wchat">
 916 
									<div className="block-wchat">
924 
                    <button
 917 
										<button
925 
                      className="icon ti-clip attachment font-24 btn-attach btn-attach uploadFile"
 918 
											className="icon ti-clip attachment font-24 btn-attach btn-attach uploadFile"
926 
                      id="uploadFile"
 919 
											id="uploadFile"
927 
                      onClick={handleShareFileModalShow}
 920 
											onClick={handleShareFileModalShow}
928 
                    ></button>
 921 
										></button>
929 
                    <button
 922 
										<button
930 
                      className="icon ti-face-smile font-24 btn-emoji"
 923 
											className="icon ti-face-smile font-24 btn-emoji"
931 
                      id="toggle-emoji"
 924 
											id="toggle-emoji"
932 
                      onClick={handleShowEmojiTab}
 925 
											onClick={handleShowEmojiTab}
933 
                    ></button>
 926 
										></button>
934 
                    <div className="input-container">
 927 
										<div className="input-container">
935 
                      <div className="input-emoji">
 928 
											<div className="input-emoji">
936 
                        <div
 929 
												<div
937 
                          className="input-placeholder"
 930 
													className="input-placeholder"
938 
                          style={{ visibility: "hidden", display: "none" }}
 931 
													style={{ visibility: 'hidden', display: 'none' }}
939 
                        >
 932 
												>
940 
                          Escribe un mensaje
 933 
                          Escribe un mensaje
941 
                        </div>
 934 
												</div>
942 
                        <textarea
 935 
												<textarea
943 
                          className="input chatboxtextarea"
 936 
													className="input chatboxtextarea"
944 
                          id="chatboxtextarea"
 937 
													id="chatboxtextarea"
945 
                          name="chattxt"
 938 
													name="chattxt"
946 
                          style={{ resize: "none", height: "20px" }}
 939 
													style={{ resize: 'none', height: '20px' }}
947 
                          placeholder="Escribe un mensaje"
 940 
													placeholder="Escribe un mensaje"
948 
                          onKeyDown={handleChatBoxKeyDown}
 941 
													onKeyDown={handleChatBoxKeyDown}
949 
                          ref={textAreaEl}
 942 
													ref={textAreaEl}
950 
                          onFocus={()=> onRead(index)}
 943 
													onFocus={() => onRead(index)}
951 
                        ></textarea>
 944 
												></textarea>
952 
                        <input
 945 
												<input
953 
                          id="to_uname"
 946 
													id="to_uname"
954 
                          name="to_uname"
 947 
													name="to_uname"
955 
                          value="'+chatboxtitle+'"
 948 
													value="'+chatboxtitle+'"
956 
                          type="hidden"
 949 
													type="hidden"
957 
                        />
 950 
												/>
958 
                        <input
 951 
												<input
959 
                          id="from_uname"
 952 
													id="from_uname"
960 
                          name="from_uname"
 953 
													name="from_uname"
961 
                          value="Beenny"
 954 
													value="Beenny"
962 
                          type="hidden"
 955 
													type="hidden"
963 
                        />
 956 
												/>
964 
                      </div>
 957 
											</div>
965 
                    </div>
 958 
										</div>
966 
                  </div>
 959 
									</div>
967 
                </div>
 960 
								</div>
968 
                <div className="wchat-box-items-positioning-container">
 961 
								<div className="wchat-box-items-positioning-container">
969 
                  <div className="wchat-box-items-overlay-container">
 962 
									<div className="wchat-box-items-overlay-container">
970 
                    <div
 963 
										<div
971 
                      className="target-emoji"
 964 
											className="target-emoji"
972 
                      style={{ display: showEmojiTab ? "block" : "none" }}
 965 
											style={{ display: showEmojiTab ? 'block' : 'none' }}
973 
                    >
 966 
										>
974 
                      <div id={`smileyPanel_${id}`}>
 967 
											<div id={`smileyPanel_${id}`}>
975 
                        <div>
 968 
												<div>
976 
                          <Emojione onClickEmoji={handleClickEmoji} />
 969 
													<Emojione onClickEmoji={handleClickEmoji} />
977 
                        </div>
 970 
												</div>
978 
                      </div>
 971 
											</div>
979 
                    </div>
 972 
										</div>
980 
                  </div>
 973 
									</div>
981 
                </div>
 974 
								</div>
982 
              </div>
 975 
							</div>
983 
            </div>
 976 
						</div>
984 
          </div>
 977 
					</div>
985 
        </div>
 978 
				</div>
986 
      </div>
 979 
			</div>
987 
      <ConfirmModal
 980 
			<ConfirmModal
988 
        show={confirmModalShow}
 981 
				show={confirmModalShow}
989 
        onClose={handleConfirmModalShow}
 982 
				onClose={handleConfirmModalShow}
990 
        onAccept={handleConfirmModalAccept}
 983 
				onAccept={handleConfirmModalAccept}
991 
      />
 984 
			/>
992 
      {shareFileModal}
 985 
			{shareFileModal}
993 
    </React.Fragment>
 986 
		</React.Fragment>
994 
  );
 987 
	)
995 
 
 988 
 
996 
  switch (type) {
 989 
	switch (type) {
997 
    case "user":
 990 
	case 'user':
998 
      return userChat;
 991 
		return userChat
999 
    case "group":
 992 
	case 'group':
1000 
      return groupChat;
 993 
		return groupChat
1001 
    default:
 994 
	default:
1002 
      break;
 995 
		break
1003 
  }
 996 
	}
Línea 1004... Línea 997...
1004 
};
 997 
}