Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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