From 27a8a4e5202c71b3bcd84fd2eb16021fc474859c Mon Sep 17 00:00:00 2001
From: plebbitor <mottoes_recap0u@icloud.com>
Date: Sun, 23 Apr 2023 13:37:09 +0200
Subject: [PATCH] added media to thread mobile replies

---
 src/components/views/Thread.jsx | 34 +++++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/src/components/views/Thread.jsx b/src/components/views/Thread.jsx
index 3087cfcd..7e767efd 100644
--- a/src/components/views/Thread.jsx
+++ b/src/components/views/Thread.jsx
@@ -746,6 +746,7 @@ const Thread = () => {
                   </div>
                   {comment.replyCount === undefined ? <PostLoader /> : null}
                   {renderedComments.map((reply, index) => {
+                    const replyMediaInfo = getCommentMediaInfo(reply);
                     const shortParentCid = findShortParentCid(reply.parentCid, comment);
                     return (
                     <div key={`${index}mob-rc-${index}`} className="reply-container">
@@ -804,6 +805,39 @@ const Thread = () => {
                             )}
                           </span>
                         </div>
+                        {reply.link ? (
+                            <div key={`mob-f-${reply.cid}`} className="file-mobile">
+                              <a key={`link-a-${reply.cid}`} href={replyMediaInfo?.url} target="_blank" rel="noopener noreferrer">
+                                {replyMediaInfo?.url ? (
+                                  replyMediaInfo.type === "webpage" ? (
+                                      <span key={`mob-ft${reply.cid}`} className="file-thumb-mobile">
+                                        <img key={`mob-img-${reply.cid}`} src={reply.thumbnailUrl} alt="thumbnail" onError={(e) => e.target.src = fallbackImgUrl} />
+                                        <div key={`mob-fi-${reply.cid}`} className="file-info-mobile">{replyMediaInfo.type}</div>
+                                      </span>
+                                  ) : replyMediaInfo.type === "image" ? (
+                                      <span key={`mob-ft${reply.cid}`} className="file-thumb-mobile">
+                                        <img key={`mob-img-${reply.cid}`} src={replyMediaInfo.url} alt={replyMediaInfo.type} onError={(e) => e.target.src = fallbackImgUrl} />
+                                        <div key={`mob-fi-${reply.cid}`} className="file-info-mobile">{replyMediaInfo.type}</div>
+                                      </span>
+                                  ) : replyMediaInfo.type === "video" ? (
+                                      <span key={`mob-ft${reply.cid}`} className="file-thumb-mobile">
+                                          <video key={`fti-${reply.cid}`} 
+                                          src={replyMediaInfo.url} 
+                                          alt={replyMediaInfo.type} 
+                                          style={{ pointerEvents: "none" }}
+                                          onError={(e) => e.target.src = fallbackImgUrl} />
+                                        <div key={`mob-fi-${reply.cid}`} className="file-info-mobile">{replyMediaInfo.type}</div>
+                                      </span>
+                                  ) : replyMediaInfo.type === "audio" ? (
+                                      <span key={`mob-ft${reply.cid}`} className="file-thumb-mobile">
+                                        <audio key={`mob-img-${reply.cid}`} src={replyMediaInfo.url} alt={replyMediaInfo.type} onError={(e) => e.target.src = fallbackImgUrl} />
+                                        <div key={`mob-fi-${reply.cid}`} className="file-info-mobile">{replyMediaInfo.type}</div>
+                                      </span>
+                                  ) : null
+                                ) : null}
+                              </a>
+                            </div>
+                          ) : null}
                         <blockquote key={`mob-pm-${index}`} className="post-message-mobile">
                           <Link to={() => {}} key={`mob-ql-${index}`} className="quotelink-mobile" 
                           onClick={(event) => handleQuoteClick(reply, shortParentCid, comment.shortCid, event)}>