Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5034 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 5034 Rev 5035
Línea 8... Línea 8...
8 
// Components
 8 
// Components
9 
import NotificationAlert from "../../shared/notification/NotificationAlert";
 9 
import NotificationAlert from "../../shared/notification/NotificationAlert";
10 
import PersonalChat from "./personal-chat/PersonalChat";
 10 
import PersonalChat from "./personal-chat/PersonalChat";
11 
import ContactsModal from "./components/ContactsModal";
 11 
import ContactsModal from "./components/ContactsModal";
12 
import ContactsList from "./components/ContactsList";
 12 
import ContactsList from "./components/ContactsList";
- 
 
 13 
import contactsFilters from "./components/ContactsFilters";
Línea 13... Línea 14...
13 
 
 14 
 
Línea 14... Línea 15...
14 
const notifyAudio = new Audio("/audio/chat.mp3");
 15 
const notifyAudio = new Audio("/audio/chat.mp3");
15 
 
 16 
 
Línea 16... Línea 17...
16 
const Chat = (props) => {
 17 
const Chat = (props) => {
17 
  const { defaultNetwork } = props
 18 
  const { defaultNetwork } = props
18 
 
 - 
 
19 
  // states
 19 
 
Línea 20... Línea 20...
20 
  const [contacts, setContacts] = useState([]);
 20 
  // states
21 
  const [groups, setGroups] = useState([]);
 21 
  const [contacts, setContacts] = useState([]);
22 
  const [activeChats, setActiveChats] = useState([]);
 22 
  const [activeChats, setActiveChats] = useState([]);
23 
 
 23 
 
Línea 24... Línea -...
24 
  const [isChatOpen, setIsChatOpen] = useState(false);
 - 
 
25 
  const [isMuted, setIsMuted] = useState(false);
 - 
 
26 
  const [showModal, setShowModal] = useState(false);
 24 
  const [isChatOpen, setIsChatOpen] = useState(false);
Línea 27... Línea -...
27 
  const [loading, setLoading] = useState(false);
 - 
 
28 
 
 - 
 
29 
  const [activeTab, setActiveTab] = useState("user");
 - 
 
30 
  const [search, setSearch] = useState('');
 - 
 
31 
  const [pendingConversation, setPendingConversation] = useState('')
 - 
 
32 
 
 25 
  const [isMuted, setIsMuted] = useState(false);
33 
 
 - 
 
34 
  const filtredContacts = contacts.filter(({ name }) => name.toLowerCase().includes(search.toLowerCase()))
 - 
 
35 
  const filtredGroups = groups.filter(({ name }) => name.toLowerCase().includes(search.toLowerCase()))
 26 
  const [showModal, setShowModal] = useState(false);
36 
 
 27 
  const [loading, setLoading] = useState(false);
37 
 
 28 
 
38 
  const handleEntities = entities => {
 29 
  const [pendingConversation, setPendingConversation] = useState('')
39 
    let newUserContacts = [];
 - 
 
40 
    let newGroups = [];
 - 
 
41 
    entities.map((entity) => {
 - 
 
42 
      if (entity.not_received_messages) handleNewMessage(entity)
 30 
 
43 
      if (entity.not_seen_messages) handleNotSeenMessage(entity)
 - 
 
44 
      if (entity.is_open) handleOpenConversation(entity, false);
 - 
 
45 
      switch (entity.type) {
 - 
 
46 
        case "user":
 - 
 
47 
          newUserContacts = [...newUserContacts, entity];
 - 
 
48 
          handleUpdateOnline(entity);
 - 
 
49 
          break;
 - 
 
50 
        case "group":
 31 
  const handleEntities = entities => {
51 
          newGroups = [...newGroups, entity];
 32 
    entities.map((entity) => {
52 
          break;
 - 
 
53 
        default:
 33 
      if (entity.not_received_messages) handleNewMessage(entity)
Línea 54... Línea 34...
54 
          break;
 34 
      if (entity.not_seen_messages) handleNotSeenMessage(entity)
55 
      }
 35 
      if (entity.is_open) handleOpenConversation(entity, false)
56 
    });
 36 
      if (entity.type === 'user') handleUpdateOnline(entity)
Línea 165... Línea 145...
165 
    if (isMuted) {
 145 
    if (isMuted) {
166 
      notifyAudio.play();
 146 
      notifyAudio.play();
167 
    }
 147 
    }
168 
  };
 148 
  };
Línea 169... Línea -...
169 
 
 - 
 
170 
  const handleChangeTab = (tab) => setActiveTab(tab)
 - 
 
171 
 
 149 
 
172 
  useEffect(() => {
 150 
  useEffect(() => {
173 
    if (!loading) {
 151 
    if (!loading) {
174 
      const fetchData = async () => {
 152 
      const fetchData = async () => {
175 
        setLoading(true)
 153 
        setLoading(true)
Línea 204... Línea 182...
204 
    emojione.imagePathPNG = props.emojiOnePath;
 182 
    emojione.imagePathPNG = props.emojiOnePath;
205 
  }, []);
 183 
  }, []);
Línea 206... Línea 184...
206 
 
 184 
 
Línea -... Línea 185...
- 
 
 185 
  if (window.innerWidth < 1000 || window.location.pathname === '/chat') return null
- 
 
 186 
 
207 
  if (window.innerWidth < 1000 || window.location.pathname === '/chat') return null
 187 
  const FilterContactList = contactsFilters(ContactsList, contacts, { selectConversation: handleOpenConversation })
208 
 
 188 
 
209 
  return (
 189 
  return (
210 
    <>
 190 
    <>
211 
      <div className="chat-helper">
 191 
      <div className="chat-helper">
Línea 223... Línea 203...
223 
              className={`fa ${isChatOpen ? "fa-angle-down" : "fa-angle-up"} text-20`}
 203 
              className={`fa ${isChatOpen ? "fa-angle-down" : "fa-angle-up"} text-20`}
224 
              onClick={() => setIsChatOpen(!isChatOpen)}
 204 
              onClick={() => setIsChatOpen(!isChatOpen)}
225 
            />
 205 
            />
226 
          </div>
 206 
          </div>
227 
        </div>
 207 
        </div>
228 
        <div
 - 
 
229 
          id="showhidechatlist"
 - 
 
230 
          style={{ display: isChatOpen ? "grid" : "none" }}
 - 
 
231 
        >
 - 
 
232 
          <div className="drupalchat_search_main chatboxinput">
 - 
 
233 
            <input
 - 
 
234 
              className="drupalchat_searchinput live-search-box"
 - 
 
235 
              id="live-search-box"
 - 
 
236 
              type="text"
 - 
 
237 
              name='search'
 - 
 
238 
              value={search}
 - 
 
239 
              onChange={(e) => setSearch(e.target.value)}
 - 
 
240 
            />
 - 
 
241 
            <i className="searchbutton fas fa-search" />
 - 
 
242 
          </div>
 - 
 
243 
          {defaultNetwork !== 'y' &&
 208 
        {defaultNetwork !== 'y' &&
244 
            <div
 209 
          <div
245 
              className="d-flex align-items-center cursor-pointer"
 210 
            className="d-flex align-items-center cursor-pointer"
246 
              style={{ gap: '.5rem', background: '#fff' }}
 211 
            style={{ gap: '.5rem', background: '#fff' }}
247 
              onClick={() => setShowModal(true)}
 212 
            onClick={() => setShowModal(true)}
248 
            >
 213 
          >
249 
              <AddIcon />
 214 
            <AddIcon />
250 
              <span>Iniciar conversación</span>
 215 
            <span>Iniciar conversación</span>
251 
            </div>
 - 
 
252 
          }
 - 
 
253 
          <div className="drupalchat_search_main chatboxinput">
 - 
 
254 
            <button className={activeTab === 'user' && 'active'} onClick={() => handleChangeTab("user")}>
 - 
 
255 
              Contactos
 - 
 
256 
            </button>
 - 
 
257 
            <button className={activeTab === 'group' && 'active'} onClick={() => handleChangeTab("group")}>
 - 
 
258 
              Grupos
 - 
 
259 
            </button>
 - 
 
260 
          </div>
 216 
          </div>
261 
          <ContactsList
 - 
 
262 
            contacts={filtredContacts}
 - 
 
263 
            groups={filtredGroups}
 - 
 
264 
            activeTab={activeTab}
 - 
 
265 
            selectConversation={handleOpenConversation}
 - 
 
266 
          />
 217 
        }
267 
        </div>
 218 
        <FilterContactList />
268 
      </div>
 219 
      </div>
269 
      <div className="active_chats-list">
 220 
      <div className="active_chats-list">
270 
        {activeChats.map((entity, index) => (
 221 
        {activeChats.map((entity, index) => (
271 
          <PersonalChat
 222 
          <PersonalChat
272 
            index={index}
 223 
            index={index}