Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 6931 Rev 6932
Línea 1... Línea 1...
1 
import React, { useEffect, useRef, useState } from 'react'
 1 
import React, { memo, useEffect, useRef, useState } from 'react'
2 
import { axios } from '../../utils'
 2 
import { axios } from '../../utils'
3 
import { useForm } from 'react-hook-form'
 3 
import { useForm } from 'react-hook-form'
4 
import { useDispatch } from 'react-redux'
 4 
import { useDispatch } from 'react-redux'
5 
import { addNotification } from '../../redux/notification/notification.actions'
 5 
import { addNotification } from '../../redux/notification/notification.actions'
6 
import parse from 'html-react-parser'
 6 
import parse from 'html-react-parser'
Línea 97... Línea 97...
97 
    width: 1rem;
 97 
    width: 1rem;
98 
    height: 1rem;
 98 
    height: 1rem;
99 
  }
 99 
  }
Línea 100... Línea 100...
100 
 
 100 
 
101 
  ${(props) => {
 101 
  ${(props) => {
102 
    console.log(props.send)
 - 
 
103 
    console.log(props.$send)
 102 
    console.log('Render')
104 
    if (props.$send) {
 103 
    if (props.send) {
105 
      return css`
 104 
      return css`
106 
        align-self: flex-end;
 105 
        align-self: flex-end;
107 
        background-color: var(--chat-send);
 106 
        background-color: var(--chat-send);
108 
        border-radius: 10px 0 10px 10px;
 107 
        border-radius: 10px 0 10px 10px;
Línea 114... Línea 113...
114 
      border-radius: 0 10px 10px 10px;
 113 
      border-radius: 0 10px 10px 10px;
115 
    `
 114 
    `
116 
  }}
 115 
  }}
117 
`
 116 
`
Línea -... Línea 117...
- 
 
 117 
 
- 
 
 118 
function messageAreEqual(oldMessages = [], newMessages = []) {
- 
 
 119 
  const messageDifference = oldMessages.filter(
- 
 
 120 
    (message, index) => newMessages[index].id !== message.id && message
- 
 
 121 
  )
- 
 
 122 
 
- 
 
 123 
  return Boolean(messageDifference.length)
- 
 
 124 
}
118 
 
 125 
 
119 
const Chat = ({ children }) => {
 126 
const Chat = ({ children }) => {
120 
  return <StyledChatContainer>{children}</StyledChatContainer>
 127 
  return <StyledChatContainer>{children}</StyledChatContainer>
Línea 121... Línea 128...
121 
}
 128 
}
Línea 142... Línea 149...
142 
      <StyledTitle>{children}</StyledTitle>
 149 
      <StyledTitle>{children}</StyledTitle>
143 
    </a>
 150 
    </a>
144 
  )
 151 
  )
145 
}
 152 
}
Línea 146... Línea 153...
146 
 
 153 
 
147 
const List = ({
 154 
const MemoList = memo(function List({
148 
  messages,
 155 
  messages,
149 
  pages,
 156 
  pages,
150 
  currentPage,
 157 
  currentPage,
151 
  onPagination,
 158 
  onPagination,
152 
  scrollRef,
 159 
  scrollRef,
153 
  loading,
 160 
  loading,
154 
}) => {
 161 
}) {
Línea 155... Línea 162...
155 
  const loadMoreEl = useRef(null)
 162 
  const loadMoreEl = useRef(null)
156 
 
 163 
 
Línea 167... Línea 174...
167 
  }, [messages])
 174 
  }, [messages])
Línea 168... Línea 175...
168 
 
 175 
 
169 
  return (
 176 
  return (
170 
    <StyledMessageList ref={scrollRef}>
 177 
    <StyledMessageList ref={scrollRef}>
171 
      {messages.map((message) => (
 178 
      {messages.map((message) => (
172 
        <List.Message message={message} key={message.id} />
 179 
        <MemoList.Message message={message} key={message.id} />
173 
      ))}
 180 
      ))}
174 
      {pages > currentPage && !loading && <p ref={loadMoreEl}>Cargando...</p>}
 181 
      {pages > currentPage && !loading && <p ref={loadMoreEl}>Cargando...</p>}
175 
    </StyledMessageList>
 182 
    </StyledMessageList>
176 
  )
 183 
  )
- 
 
 184 
},
Línea 177... Línea 185...
177 
}
 185 
messageAreEqual)
178 
 
 186 
 
179 
const Message = ({ message }) => {
 187 
const Message = ({ message }) => {
180 
  const senderName = (message) => {
 188 
  const senderName = (message) => {
Línea 313... Línea 321...
313 
  )
 321 
  )
314 
}
 322 
}
Línea 315... Línea 323...
315 
 
 323 
 
316 
Chat.Header = Header
 324 
Chat.Header = Header
317 
Chat.Title = Title
 325 
Chat.Title = Title
318 
Chat.List = List
 326 
Chat.List = MemoList
319 
List.Message = Message
 327 
MemoList.Message = Message
Línea 320... Línea 328...
320 
Chat.SubmitForm = SubmitForm
 328 
Chat.SubmitForm = SubmitForm