feat(post): add 'loading comments' indicator

public/translations/ar/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "مشاركة واحدة بهذا المعرف",
   "x_posts_by_this_id": "{{number}} منشور من هذا المعرف",
   "ban_expires_at": "محظور من p/{{address}} حتى {{timestamp}}",
-  "user_banned": "تم حظر المستخدم لهذا المنشور"
+  "user_banned": "تم حظر المستخدم لهذا المنشور",
+  "loading_comments": "تحميل التعليقات",
+  "replies": "الردود",
+  "links": "الروابط"
 }

public/translations/bn/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "এই আইডি দ্বারা 1 পোস্ট",
   "x_posts_by_this_id": "এই আইডি থেকে {{number}} পোস্ট",
   "ban_expires_at": "p/{{address}} থেকে {{timestamp}} পর্যন্ত নিষিদ্ধ",
-  "user_banned": "এই পোস্টের জন্য ব্যবহারকারী নিষিদ্ধ হয়েছে"
+  "user_banned": "এই পোস্টের জন্য ব্যবহারকারী নিষিদ্ধ হয়েছে",
+  "loading_comments": "মন্তব্য লোড হচ্ছে",
+  "replies": "উত্তর",
+  "links": "লিঙ্কগুলি"
 }

public/translations/cs/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 příspěvek s tímto ID",
   "x_posts_by_this_id": "{{number}} příspěvků z tohoto ID",
   "ban_expires_at": "Zakázán z p/{{address}} do {{timestamp}}",
-  "user_banned": "Uživatel byl zablokován za tento příspěvek"
+  "user_banned": "Uživatel byl zablokován za tento příspěvek",
+  "loading_comments": "Načítání komentářů",
+  "replies": "Odpovědi",
+  "links": "Odkazy"
 }

public/translations/da/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post med dette ID",
   "x_posts_by_this_id": "{{number}} indlæg fra denne ID",
   "ban_expires_at": "Udelukket fra p/{{address}} indtil {{timestamp}}",
-  "user_banned": "Brugeren blev blokeret for dette indlæg"
+  "user_banned": "Brugeren blev blokeret for dette indlæg",
+  "loading_comments": "Indlæser kommentarer",
+  "replies": "Svar",
+  "links": "Links"
 }

public/translations/de/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 Beitrag mit dieser ID",
   "x_posts_by_this_id": "{{number}} Beiträge von dieser ID",
   "ban_expires_at": "Gesperrt von p/{{address}} bis {{timestamp}}",
-  "user_banned": "Benutzer wurde für diesen Beitrag gesperrt"
+  "user_banned": "Benutzer wurde für diesen Beitrag gesperrt",
+  "loading_comments": "Lade Kommentare",
+  "replies": "Antworten",
+  "links": "Links"
 }

public/translations/el/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 ανάρτηση με αυτό το ID",
   "x_posts_by_this_id": "{{number}} αναρτήσεις από αυτό το ID",
   "ban_expires_at": "Αποκλείστηκε από p/{{address}} έως {{timestamp}}",
-  "user_banned": "Ο χρήστης αποκλείστηκε για αυτή τη δημοσίευση"
+  "user_banned": "Ο χρήστης αποκλείστηκε για αυτή τη δημοσίευση",
+  "loading_comments": "Φόρτωση σχολίων",
+  "replies": "Απαντήσεις",
+  "links": "Σύνδεσμοι"
 }

public/translations/en/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post by this ID",
   "x_posts_by_this_id": "{{number}} posts from this ID",
   "ban_expires_at": "Banned from p/{{address}} until {{timestamp}}",
-  "user_banned": "User was banned for this post"
+  "user_banned": "User was banned for this post",
+  "loading_comments": "Loading comments",
+  "replies": "replies",
+  "links": "links"
 }

public/translations/es/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 publicación con este ID",
   "x_posts_by_this_id": "{{number}} publicaciones desde este ID",
   "ban_expires_at": "Baneado de p/{{address}} hasta {{timestamp}}",
-  "user_banned": "El usuario fue baneado por esta publicación"
+  "user_banned": "El usuario fue baneado por esta publicación",
+  "loading_comments": "Cargando comentarios",
+  "replies": "respuestas",
+  "links": "enlaces"
 }

public/translations/fa/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 پست با این شناسه",
   "x_posts_by_this_id": "{{number}} پست از این شناسه",
   "ban_expires_at": "مسدود از p/{{address}} تا {{timestamp}}",
-  "user_banned": "این کاربر برای این پست مسدود شد"
+  "user_banned": "این کاربر برای این پست مسدود شد",
+  "loading_comments": "بارگذاری نظرات",
+  "replies": "پاسخ‌ها",
+  "links": "لینک‌ها"
 }

public/translations/fi/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 viesti tällä tunnuksella",
   "x_posts_by_this_id": "{{number}} viestiä tältä tunnukselta",
   "ban_expires_at": "Porttikielto p/{{address}} asti {{timestamp}}",
-  "user_banned": "Käyttäjä on estetty tästä viestistä"
+  "user_banned": "Käyttäjä on estetty tästä viestistä",
+  "loading_comments": "Ladataan kommentteja",
+  "replies": "vastaukset",
+  "links": "linkit"
 }

public/translations/fil/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post sa pamamagitan ng ID na ito",
   "x_posts_by_this_id": "{{number}} post mula sa ID na ito",
   "ban_expires_at": "Bawal sa p/{{address}} hanggang {{timestamp}}",
-  "user_banned": "Banal ang user para sa post na ito"
+  "user_banned": "Banal ang user para sa post na ito",
+  "loading_comments": "Naglo-load ng mga komento",
+  "replies": "mga tugon",
+  "links": "mga link"
 }

public/translations/fr/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 publication avec cet identifiant",
   "x_posts_by_this_id": "{{number}} publications depuis cet identifiant",
   "ban_expires_at": "Banni de p/{{address}} jusqu'au {{timestamp}}",
-  "user_banned": "L'utilisateur a été banni pour ce post"
+  "user_banned": "L'utilisateur a été banni pour ce post",
+  "loading_comments": "Chargement des commentaires",
+  "replies": "réponses",
+  "links": "liens"
 }

public/translations/he/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "פוסט אחד עם המזהה הזה",
   "x_posts_by_this_id": "{{number}} פוסטים מהמזהה הזה",
   "ban_expires_at": "נחסם מ-p/{{address}} עד {{timestamp}}",
-  "user_banned": "המשתמש נחסם עבור הפוסט הזה"
+  "user_banned": "המשתמש נחסם עבור הפוסט הזה",
+  "loading_comments": "טוען תגובות",
+  "replies": "תגובות",
+  "links": "קישורים"
 }

public/translations/hi/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "इस आईडी द्वारा 1 पोस्ट",
   "x_posts_by_this_id": "इस आईडी से {{number}} पोस्ट",
   "ban_expires_at": "p/{{address}} से {{timestamp}} तक पर प्रतिबंधित",
-  "user_banned": "इस पोस्ट के लिए उपयोगकर्ता पर प्रतिबंध लगा दिया गया था"
+  "user_banned": "इस पोस्ट के लिए उपयोगकर्ता पर प्रतिबंध लगा दिया गया था",
+  "loading_comments": "टिप्पणियाँ लोड हो रही हैं",
+  "replies": "जवाब",
+  "links": "लिंक"
 }

public/translations/hu/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 bejegyzés ezzel az azonosítóval",
   "x_posts_by_this_id": "{{number}} bejegyzés erről az azonosítóról",
   "ban_expires_at": "Tiltva p/{{address}}-tól {{timestamp}}-ig",
-  "user_banned": "A felhasználót letiltották ennek a posztnak a kapcsán"
+  "user_banned": "A felhasználót letiltották ennek a posztnak a kapcsán",
+  "loading_comments": "Megjegyzések betöltése",
+  "replies": "válaszok",
+  "links": "linkek"
 }

public/translations/id/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 pos dengan ID ini",
   "x_posts_by_this_id": "{{number}} pos dari ID ini",
   "ban_expires_at": "Dilarang dari p/{{address}} sampai {{timestamp}}",
-  "user_banned": "Pengguna diblokir untuk pos ini"
+  "user_banned": "Pengguna diblokir untuk pos ini",
+  "loading_comments": "Memuat komentar",
+  "replies": "balasan",
+  "links": "tautan"
 }

public/translations/it/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post con questo ID",
   "x_posts_by_this_id": "{{number}} post da questo ID",
   "ban_expires_at": "Bannato da p/{{address}} fino al {{timestamp}}",
-  "user_banned": "L'utente è stato bannato per questo post"
+  "user_banned": "L'utente è stato bannato per questo post",
+  "loading_comments": "Caricamento commenti",
+  "replies": "commenti",
+  "links": "link"
 }

public/translations/ja/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "このIDで1件の投稿",
   "x_posts_by_this_id": "このIDからの{{number}} 件の投稿",
   "ban_expires_at": "p/{{address}}から{{timestamp}}まで禁止",
-  "user_banned": "この投稿のためにユーザーが禁止されました"
+  "user_banned": "この投稿のためにユーザーが禁止されました",
+  "loading_comments": "コメントを読み込み中",
+  "replies": "返信",
+  "links": "リンク"
 }

public/translations/ko/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "이 ID로 게시된 1개의 글",
   "x_posts_by_this_id": "이 ID로부터의 {{number}}개의 글",
   "ban_expires_at": "p/{{address}}에서 {{timestamp}}까지 금지됨",
-  "user_banned": "이 게시물로 인해 사용자가 차단되었습니다"
+  "user_banned": "이 게시물로 인해 사용자가 차단되었습니다",
+  "loading_comments": "댓글 로드 중",
+  "replies": "답글",
+  "links": "링크"
 }

public/translations/mr/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "या ID वर 1 पोस्ट",
   "x_posts_by_this_id": "या ID पासून {{number}} पोस्ट",
   "ban_expires_at": "p/{{address}} ते {{timestamp}} पर्यंत प्रतिबंधित",
-  "user_banned": "या पोस्टसाठी वापरकर्ता ब्लॉक केला गेला होता"
+  "user_banned": "या पोस्टसाठी वापरकर्ता ब्लॉक केला गेला होता",
+  "loading_comments": "टिप्पणी लोड होत आहे",
+  "replies": "उत्तर",
+  "links": "लिंक"
 }

public/translations/nl/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 bericht met dit ID",
   "x_posts_by_this_id": "{{number}} berichten met dit ID",
   "ban_expires_at": "Verbannen van p/{{address}} tot {{timestamp}}",
-  "user_banned": "Gebruiker is verbannen voor deze post"
+  "user_banned": "Gebruiker is verbannen voor deze post",
+  "loading_comments": "Reacties laden",
+  "replies": "reacties",
+  "links": "links"
 }

public/translations/no/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post med denne ID-en",
   "x_posts_by_this_id": "{{number}} poster med denne ID-en",
   "ban_expires_at": "Utestengt fra p/{{address}} til {{timestamp}}",
-  "user_banned": "Brukeren ble utestengt for dette innlegget"
+  "user_banned": "Brukeren ble utestengt for dette innlegget",
+  "loading_comments": "Laster inn kommentarer",
+  "replies": "svar",
+  "links": "lenker"
 }

public/translations/pl/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post z tym identyfikatorem",
   "x_posts_by_this_id": "{{number}} postów z tego identyfikatora",
   "ban_expires_at": "Zablokowany na p/{{address}} do {{timestamp}}",
-  "user_banned": "Użytkownik został zablokowany za ten post"
+  "user_banned": "Użytkownik został zablokowany za ten post",
+  "loading_comments": "Ładowanie komentarzy",
+  "replies": "odpowiedzi",
+  "links": "linki"
 }

public/translations/pt/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post com este ID",
   "x_posts_by_this_id": "{{number}} posts com este ID",
   "ban_expires_at": "Banido de p/{{address}} até {{timestamp}}",
-  "user_banned": "O usuário foi banido por este post"
+  "user_banned": "O usuário foi banido por este post",
+  "loading_comments": "Carregando comentários",
+  "replies": "respostas",
+  "links": "links"
 }

public/translations/ro/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 post cu acest ID",
   "x_posts_by_this_id": "{{number}} postări cu acest ID",
   "ban_expires_at": "Interzis de la p/{{address}} până la {{timestamp}}",
-  "user_banned": "Utilizatorul a fost interzis pentru acest mesaj"
+  "user_banned": "Utilizatorul a fost interzis pentru acest mesaj",
+  "loading_comments": "Se încarcă comentariile",
+  "replies": "răspunsuri",
+  "links": "linkuri"
 }

public/translations/ru/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 сообщение с этим идентификатором",
   "x_posts_by_this_id": "{{number}} сообщений с этого идентификатора",
   "ban_expires_at": "Забанен на p/{{address}} до {{timestamp}}",
-  "user_banned": "Пользователь был заблокирован за этот пост"
+  "user_banned": "Пользователь был заблокирован за этот пост",
+  "loading_comments": "Загрузка комментариев",
+  "replies": "ответы",
+  "links": "ссылки"
 }

public/translations/sq/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 postim me këtë ID",
   "x_posts_by_this_id": "{{number}} postime nga ky ID",
   "ban_expires_at": "I ndaluar nga p/{{address}} deri më {{timestamp}}",
-  "user_banned": "Përdoruesi u ndalua për këtë postim"
+  "user_banned": "Përdoruesi u ndalua për këtë postim",
+  "loading_comments": "Duke u ngarkuar komentet",
+  "replies": "përgjigje",
+  "links": "lidhje"
 }

public/translations/sv/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 inlägg med detta ID",
   "x_posts_by_this_id": "{{number}} inlägg från detta ID",
   "ban_expires_at": "Bannad från p/{{address}} till {{timestamp}}",
-  "user_banned": "Användaren blev blockerad för detta inlägg"
+  "user_banned": "Användaren blev blockerad för detta inlägg",
+  "loading_comments": "Laddar kommentarer",
+  "replies": "svar",
+  "links": "länkar"
 }

public/translations/te/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "ఈ ID ద్వారా 1 పోస్టు",
   "x_posts_by_this_id": "ఈ ID నుండి {{number}} పోస్టు",
   "ban_expires_at": "p/{{address}} నుండి {{timestamp}} వరకు నిషేధించబడింది",
-  "user_banned": "ఈ పోస్టు కోసం వాడు బ్యాన్ చేయబడింది"
+  "user_banned": "ఈ పోస్టు కోసం వాడు బ్యాన్ చేయబడింది",
+  "loading_comments": "వ్యాఖ్యలను లోడ్ అవుతోంది",
+  "replies": "సమాధానాలు",
+  "links": "లింక్లు"
 }

public/translations/th/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 โพสต์โดย ID นี้",
   "x_posts_by_this_id": "{{number}} โพสต์จาก ID นี้",
   "ban_expires_at": "ถูกห้ามใช้งานจาก p/{{address}} จนถึง {{timestamp}}",
-  "user_banned": "ผู้ใช้ถูกห้ามใช้งานสำหรับโพสต์นี้"
+  "user_banned": "ผู้ใช้ถูกห้ามใช้งานสำหรับโพสต์นี้",
+  "loading_comments": "กำลังโหลดความคิดเห็น",
+  "replies": "คำตอบ",
+  "links": "ลิงก์"
 }

public/translations/tr/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "Bu ID ile 1 gönderi",
   "x_posts_by_this_id": "Bu ID ile {{number}} gönderi",
   "ban_expires_at": "p/{{address}} adresinden {{timestamp}} tarihine kadar yasaklandı",
-  "user_banned": "Kullanıcı bu gönderi için yasaklandı"
+  "user_banned": "Kullanıcı bu gönderi için yasaklandı",
+  "loading_comments": "Yorumlar yükleniyor",
+  "replies": "cevaplar",
+  "links": "bağlantılar"
 }

public/translations/uk/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 пост з цим ідентифікатором",
   "x_posts_by_this_id": "{{number}} пост з цього ідентифікатора",
   "ban_expires_at": "Заборонений з p/{{address}} до {{timestamp}}",
-  "user_banned": "Користувач був заблокований за цей пост"
+  "user_banned": "Користувач був заблокований за цей пост",
+  "loading_comments": "Завантаження коментарів",
+  "replies": "відповіді",
+  "links": "посилання"
 }

public/translations/ur/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "اس آئی ڈی پر 1 پوسٹ",
   "x_posts_by_this_id": "اس آئی ڈی سے {{number}} پوسٹ",
   "ban_expires_at": "p/{{address}} سے {{timestamp}} تک ممنوع",
-  "user_banned": "اس پوسٹ کے لئے صارف کو پابندی عائد کردی گئی تھی"
+  "user_banned": "اس پوسٹ کے لئے صارف کو پابندی عائد کردی گئی تھی",
+  "loading_comments": "تبصرے لوڈ ہو رہے ہیں",
+  "replies": "جوابات",
+  "links": "لنکس"
 }

public/translations/vi/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "1 bài đăng bởi ID này",
   "x_posts_by_this_id": "{{number}} bài đăng từ ID này",
   "ban_expires_at": "Bị cấm từ p/{{address}} cho đến {{timestamp}}",
-  "user_banned": "Người dùng đã bị cấm vì bài đăng này"
+  "user_banned": "Người dùng đã bị cấm vì bài đăng này",
+  "loading_comments": "Đang tải bình luận",
+  "replies": "trả lời",
+  "links": "liên kết"
 }

public/translations/zh/default.json

@@ -210,5 +210,8 @@
   "1_post_by_this_id": "此ID的1篇帖子",
   "x_posts_by_this_id": "此ID的{{number}}篇帖子",
   "ban_expires_at": "被禁止从p/{{address}}到{{timestamp}}",
-  "user_banned": "用户因此帖子被禁止"
+  "user_banned": "用户因此帖子被禁止",
+  "loading_comments": "正在加载评论",
+  "replies": "回复",
+  "links": "链接"
 }

src/components/board-buttons/board-buttons.tsx

@@ -10,6 +10,7 @@ import CatalogFilters from '../../views/catalog/catalog-filters/';
 import styles from './board-buttons.module.css';
 import Tooltip from '../tooltip';
 import useCountLinksInReplies from '../../hooks/use-count-links-in-replies';
+import _ from 'lodash';
 
 interface BoardButtonsProps {
   address?: string | undefined;
@@ -223,6 +224,7 @@ export const MobileBoardButtons = () => {
 };
 
 const PostPageStats = () => {
+  const { t } = useTranslation();
   const params = useParams();
   const location = useLocation();
   const isInDescriptionView = isDescriptionView(location.pathname, params);
@@ -232,11 +234,14 @@ const PostPageStats = () => {
   const { closed, pinned, replyCount } = comment || {};
   const linkCount = useCountLinksInReplies(comment);
 
+  const displayReplyCount = replyCount ? replyCount.toString() : '?';
+  const replyCountTooltip = replyCount ? _.capitalize(t('replies')) : t('loading');
+
   return (
     <span>
-      {(pinned || isInDescriptionView || isInRulesView) && 'Sticky / '}
+      {(pinned || isInDescriptionView || isInRulesView) && `${_.capitalize(t('sticky'))} / `}
-      {(closed || isInDescriptionView || isInRulesView) && 'Closed / '}
+      {(closed || isInDescriptionView || isInRulesView) && `${_.capitalize(t('closed'))} / `}
-      <Tooltip children={replyCount?.toString()} content='Replies' /> / <Tooltip children={linkCount?.toString()} content='Links' />
+      <Tooltip children={displayReplyCount} content={replyCountTooltip} /> / <Tooltip children={linkCount?.toString()} content={_.capitalize(t('links'))} />
     </span>
   );
 };

src/components/post-desktop/post-desktop.tsx

@@ -410,6 +410,11 @@ const PostDesktop = ({ openReplyModal, post, roles, showAllReplies, showReplies
             )}
           </span>
         )}
+        {replyCount === undefined && (
+          <span className={styles.loadingString}>
+            <LoadingEllipsis string={t('loading_comments')} />
+          </span>
+        )}
         {!isHidden &&
           !(pinned && !isInPostPageView && !showOmittedReplies[cid]) &&
           !isInPendingPostView &&

src/components/post-mobile/post-mobile.tsx

@@ -336,6 +336,11 @@ const PostMobile = ({ openReplyModal, post, roles, showAllReplies, showReplies =
                 </div>
               )}
             </div>
+            {replyCount === undefined && (
+              <span className={styles.loadingString}>
+                <LoadingEllipsis string={t('loading_comments')} />
+              </span>
+            )}
             {!(pinned && !isInPostView) &&
               !isInPendingPostView &&
               !isDescription &&

src/views/post/post.module.css

@@ -185,6 +185,11 @@
   color: var(--post-mobile-abbr-text-color);
 }
 
+.loadingString {
+  display: block;
+  color: var(--post-mobile-abbr-text-color);
+} 
+
 .postDesktop .summary .omittedRepliesButtonWrapper {
   position: absolute;
   top: 8px;
@@ -511,6 +516,11 @@
   .replyDesktop {
     display: none;
   }
+
+  .loadingString {
+    margin-top: 10px;
+    margin-left: 5px;
+  } 
 }
 
 @media (min-width: 640px) {