Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 3706 Rev 5185
Línea -... Línea 1...
- 
 
 1 
/* eslint-disable camelcase */
1 
import React from 'react'
 2 
import React from 'react'
Línea 2... Línea 3...
2 
 
 3 
 
- 
 
 4 
const MessageTemplate = ({ message, date }) => {
Línea 3... Línea 5...
3 
const MessageTemplate = ({ message, date }) => {
 5 
  const isRightPosition = message.side === 'right'
- 
 
 6 
 
Línea 4... Línea -...
4 
 
 - 
 
5 
    const isRightPosition = message.side === "right";
 - 
 
6 
 
 - 
 
7 
    const messageRenderer = (msg) => {
 - 
 
8 
 
 - 
 
9 
        const {
 - 
 
10 
            sender_name,
 - 
 
11 
            sender_image,
 - 
 
12 
            sender_profile,
 - 
 
13 
            side,
 - 
 
14 
            message,
 - 
 
15 
            type,
 - 
 
16 
            filename
 7 
  const messageRenderer = (msg) => {
17 
        } = msg;
 8 
    const { sender_name, sender_image, sender_profile, side, message, type, filename } = msg
18 
 
 9 
 
19 
        switch (type) {
 10 
    switch (type) {
20 
            case "text":
 11 
      case 'text':
21 
                return (
 12 
        return (
22 
                    <div className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`} key={message}>
 13 
                    <div className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`} key={message}>
23 
                        <div className="messg-usr-img">
 14 
                        <div className="messg-usr-img">
24 
                            <a href={sender_profile}>
 15 
                            <a href={sender_profile}>
25 
                                <img
 16 
                                <img
26 
                                    src={sender_image}
 17 
                                    src={sender_image}
27 
                                    className="cursor-pointer"
 18 
                                    className="cursor-pointer"
28 
                                    alt={`${sender_name} profile image`}
 19 
                                    alt={`${sender_name} profile image`}
29 
                                />
 20 
                                />
30 
                            </a>
 21 
                            </a>
31 
                        </div>
 22 
                        </div>
32 
                        <div className={`message-dt mw-30`}>
 23 
                        <div className={'message-dt mw-30'}>
33 
                            <div className="message-inner-dt">
 24 
                            <div className="message-inner-dt">
34 
                                <p className={`w-100 ${'text-' + side}`}>
 25 
                                <p className={`w-100 ${'text-' + side}`}>
35 
                                    {message}
 26 
                                    {message}
36 
                                </p>
 27 
                                </p>
37 
                            </div>
 28 
                            </div>
38 
                            <span className="p-1">{date}</span>
 29 
                            <span className="p-1">{date}</span>
39 
                        </div>
 30 
                        </div>
40 
                    </div>
 31 
                    </div>
41 
                );
 32 
        )
42 
            case "image":
 33 
      case 'image':
43 
                return (
 34 
        return (
44 
                    <div className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`} key={message}>
 35 
                    <div className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`} key={message}>
45 
                        <div className="messg-usr-img">
 36 
                        <div className="messg-usr-img">
46 
                            <a href={sender_profile}>
 37 
                            <a href={sender_profile}>
47 
                                <img
 38 
                                <img
48 
                                    src={sender_image}
 39 
                                    src={sender_image}
49 
                                    className="cursor-pointer"
 40 
                                    className="cursor-pointer"
50 
                                    alt={`${sender_name} profile image`}
 41 
                                    alt={`${sender_name} profile image`}
51 
                                />
 42 
                                />
52 
                            </a>
 43 
                            </a>
53 
                        </div>
 44 
                        </div>
54 
                        <div className={`message-dt mw-30`}>
 45 
                        <div className={'message-dt mw-30'}>
55 
                            <div className="message-inner-dt">
 46 
                            <div className="message-inner-dt">
56 
                                <img
 47 
                                <img
57 
                                    src={filename}
 48 
                                    src={filename}
58 
                                    alt={`${sender_name} message image`}
 49 
                                    alt={`${sender_name} message image`}
59 
                                />
 50 
                                />
60 
                            </div>
 51 
                            </div>
61 
                            <span className="p-1">{date}</span>
 52 
                            <span className="p-1">{date}</span>
62 
                        </div>
 53 
                        </div>
63 
                    </div>
 54 
                    </div>
64 
                );
 55 
        )
65 
            case "video":
 56 
      case 'video':
66 
                return (
 57 
        return (
67 
                    <div
 58 
                    <div
68 
                        className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`}
 59 
                        className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`}
Línea 75... Línea 66...
75 
                                    className="cursor-pointer"
 66 
                                    className="cursor-pointer"
76 
                                    alt={sender_name}
 67 
                                    alt={sender_name}
77 
                                />
 68 
                                />
78 
                            </a>
 69 
                            </a>
79 
                        </div>
 70 
                        </div>
80 
                        <div className={`message-dt mw-30`}>
 71 
                        <div className={'message-dt mw-30'}>
81 
                            <div className="message-inner-dt">
 72 
                            <div className="message-inner-dt">
82 
                                <video src={filename} />
 73 
                                <video src={filename} />
83 
                            </div>
 74 
                            </div>
84 
                            <span className="p-1">{date}</span>
 75 
                            <span className="p-1">{date}</span>
85 
                        </div>
 76 
                        </div>
86 
                    </div>
 77 
                    </div>
87 
                );
 78 
        )
88 
            case "document":
 79 
      case 'document':
89 
                return (
 80 
        return (
90 
                    <div
 81 
                    <div
91 
                        key={message}
 82 
                        key={message}
92 
                        className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`}
 83 
                        className={`main-message-box ${isRightPosition ? 'ta-right' : ''}`}
93 
                    >
 84 
                    >
94 
                        <div className="messg-usr-img">
 85 
                        <div className="messg-usr-img">
Línea 98... Línea 89...
98 
                                    className="cursor-pointer"
 89 
                                    className="cursor-pointer"
99 
                                    alt={sender_name}
 90 
                                    alt={sender_name}
100 
                                />
 91 
                                />
101 
                            </a>
 92 
                            </a>
102 
                        </div>
 93 
                        </div>
103 
                        <div className={`message-dt mw-30`}>
 94 
                        <div className={'message-dt mw-30'}>
104 
                            <div className="message-inner-dt">
 95 
                            <div className="message-inner-dt">
105 
                                <a href={filename} target="_blank" className={'downloadBtn'} rel="noreferrer">
 96 
                                <a href={filename} target="_blank" className={'downloadBtn'} rel="noreferrer">
106 
                                    Abrir documento
 97 
                                    {LABELS.OPEN_DOCUMENT}
107 
                                    <i className="fa ti-arrow-circle-down" />
 98 
                                    <i className="fa ti-arrow-circle-down" />
108 
                                </a>
 99 
                                </a>
109 
                            </div>
 100 
                            </div>
110 
                            <span className="p-1">{date}</span>
 101 
                            <span className="p-1">{date}</span>
111 
                        </div>
 102 
                        </div>
112 
                    </div>
 103 
                    </div>
113 
                );
 104 
        )
114 
            default:
 105 
      default:
115 
                break;
 106 
        break
116 
        }
 107 
    }
117 
    };
 108 
  }
118 
 
 - 
 
119 
    return messageRenderer(message)
 - 
 
Línea -... Línea 109...
- 
 
 109 
 
120 
 
 110 
  return messageRenderer(message)
121 
}
 - 
 
122 
export default MessageTemplate
 111 
}
- 
 
 112 
export default MessageTemplate