fix: keep video downloads visible while playing

src/pages/Browse/index.tsx

@@ -2,18 +2,20 @@ import { useSearchParams } from "react-router-dom";
 import { MessageStream } from "../../components/messageStream/MessageStream";
 import { SectionHeader } from "../../components/SectionHeader";
 import { useI18n } from "../../i18n";
+import { isPopularTag } from "../../utils/popularTag";
 
 export function Browse() {
-  const { t } = useI18n();
+  const { t, lang } = useI18n();
   const [sp] = useSearchParams();
   const q = sp.get("q") || "";
   const sort = sp.get("sort") || "";
+  const tag = sp.get("tag") || "";
   const title = q
     ? `${t("search")}: ${q}`
-    : sort === "latest"
-      ? t("latest")
-      : sort === "popular"
-        ? t("popular")
+    : isPopularTag(tag, lang)
+      ? t("popular")
+      : sort === "latest"
+        ? t("latest")
         : sort === "recommended"
           ? t("official")
           : t("all");

src/pages/Home/index.tsx

@@ -13,6 +13,7 @@ import { SectionHeader } from "../../components/SectionHeader";
 import { MessageBubble } from "../../components/messageStream/MessageBubble";
 import { langQuery, useI18n } from "../../i18n";
 import { sourceLanguageQuery } from "../../i18nLanguages";
+import { popularTagParam } from "../../utils/popularTag";
 import { cleanCategoryDisplayName } from "../../utils/categoryDisplay";
 import {
   postToResource,
@@ -69,7 +70,7 @@ export function Home() {
       getJSON<{ items: Post[] }>(`/api/posts/recommended${postQ}&limit=12`),
       getJSON<{ items: Post[] }>(`/api/posts/latest${postQ}&limit=5`),
       getJSON<{ items: Post[] }>(
-        `/api/posts${postQ}&sort=popular&limit=5`,
+        `/api/posts${postQ}&tag=${popularTagParam(lang)}&limit=5`,
       ).catch((): { items: Post[] } => ({ items: [] })),
     ])
       .then(([c, r, l, p]) => {
@@ -392,7 +393,7 @@ export function Home() {
         <div className="px-4 md:px-0">
           <SectionHeader
             title={t("popularSection")}
-            viewAllTo="/browse?sort=popular"
+            viewAllTo={`/browse?tag=${popularTagParam(lang)}`}
             viewAllLabel={t("viewAll")}
           />
         </div>