Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 1889 | Rev 2981 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

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