From 11a52e98b550e3f53de515f6f98cb2d96850e9ab Mon Sep 17 00:00:00 2001
From: Radiquum <kentai.waah@gmail.com>
Date: Sat, 22 Mar 2025 22:51:07 +0500
Subject: [PATCH] refactor: older changelogs fetching

---
 .../ChangelogModal/ChangelogModal.tsx         | 60 +++++++++++--------
 .../ReleasePlayer/MediaThemeSutro.tsx         |  2 +-
 2 files changed, 36 insertions(+), 26 deletions(-)

diff --git a/app/components/ChangelogModal/ChangelogModal.tsx b/app/components/ChangelogModal/ChangelogModal.tsx
index 0d12d07..294ef8f 100644
--- a/app/components/ChangelogModal/ChangelogModal.tsx
+++ b/app/components/ChangelogModal/ChangelogModal.tsx
@@ -4,6 +4,7 @@ import { Modal, Accordion } from "flowbite-react";
 import Markdown from "markdown-to-jsx";
 import { useEffect, useState } from "react";
 import Styles from "./ChangelogModal.module.css";
+import { tryCatch } from "#/api/utils";
 
 export const ChangelogModal = (props: {
   isOpen: boolean;
@@ -17,29 +18,20 @@ export const ChangelogModal = (props: {
   >({});
 
   async function _fetchVersionChangelog(version: string) {
-    const res = await fetch(`/changelog/${version}.md`);
-    return await res.text();
+    const { data, error } = await tryCatch(fetch(`/changelog/${version}.md`));
+    if (error) {
+      return "Нет списка изменений";
+    }
+    return await data.text();
   }
 
   useEffect(() => {
     if (props.version != "" && currentVersionChangelog == "") {
+      setCurrentVersionChangelog("Загрузка ...");
       _fetchVersionChangelog(props.version).then((data) => {
         setCurrentVersionChangelog(data);
       });
     }
-
-    if (props.previousVersions.length > 0) {
-      props.previousVersions.forEach((version) => {
-        _fetchVersionChangelog(version).then((data) => {
-          setPreviousVersionsChangelog((prev) => {
-            return {
-              ...prev,
-              [version]: data,
-            };
-          });
-        });
-      });
-    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [props.version]);
 
@@ -50,20 +42,38 @@ export const ChangelogModal = (props: {
         <Markdown className={Styles.markdown}>
           {currentVersionChangelog}
         </Markdown>
-        {Object.keys(previousVersionsChangelog).length == props.previousVersions.length && (
-          <Accordion collapseAll={true} className="mt-4">
-            {props.previousVersions.map(
-              (version) => (
+        <Accordion collapseAll={true} className="mt-4">
+          {props.previousVersions.length > 0 &&
+            props.previousVersions.map((version) => {
+              return (
                 <Accordion.Panel key={version}>
-                  <Accordion.Title>Список изменений v{version}</Accordion.Title>
+                  <Accordion.Title
+                    onClickCapture={(e) => {
+                      if (!previousVersionsChangelog.hasOwnProperty(version)) {
+                        _fetchVersionChangelog(version).then((data) => {
+                          setPreviousVersionsChangelog((prev) => {
+                            return {
+                              ...prev,
+                              [version]: data,
+                            };
+                          });
+                        });
+                      }
+                    }}
+                  >
+                    Список изменений v{version}
+                  </Accordion.Title>
                   <Accordion.Content>
-                    <Markdown className={Styles.markdown}>{previousVersionsChangelog[version]}</Markdown>
+                    {previousVersionsChangelog.hasOwnProperty(version) ?
+                      <Markdown className={Styles.markdown}>
+                        {previousVersionsChangelog[version]}
+                      </Markdown>
+                    : <div>Загрузка ...</div>}
                   </Accordion.Content>
                 </Accordion.Panel>
-              )
-            )}
-          </Accordion>
-        )}
+              );
+            })}
+        </Accordion>
       </Modal.Body>
     </Modal>
   );
diff --git a/app/components/ReleasePlayer/MediaThemeSutro.tsx b/app/components/ReleasePlayer/MediaThemeSutro.tsx
index 92e9b59..7ebb900 100644
--- a/app/components/ReleasePlayer/MediaThemeSutro.tsx
+++ b/app/components/ReleasePlayer/MediaThemeSutro.tsx
@@ -590,7 +590,7 @@ export default function Page(props: { children: any, className?: string }) {
               <!-- Skip opening Button -->
 
               <media-seek-forward-button class="media-button" seekoffset="90">
-                <svg slot="icon" width="256" height="256" viewBox="-75 -75 400 400">
+                <svg slot="icon" width="256" height="256" viewBox="-65 -75 400 400">
                     <path fill="#fff" d="m246.52 118l-88.19-56.13a12 12 0 0 0-12.18-.39A11.66 11.66 0 0 0 140 71.84v44.59L54.33 61.87a12 12 0 0 0-12.18-.39A11.66 11.66 0 0 0 36 71.84v112.32a11.66 11.66 0 0 0 6.15 10.36a12 12 0 0 0 12.18-.39L140 139.57v44.59a11.66 11.66 0 0 0 6.15 10.36a12 12 0 0 0 12.18-.39L246.52 138a11.81 11.81 0 0 0 0-19.94Zm-108.3 13.19L50 187.38a3.91 3.91 0 0 1-4 .13a3.76 3.76 0 0 1-2-3.35V71.84a3.76 3.76 0 0 1 2-3.35a4 4 0 0 1 1.91-.5a3.94 3.94 0 0 1 2.13.63l88.18 56.16a3.8 3.8 0 0 1 0 6.44Zm104 0L154 187.38a3.91 3.91 0 0 1-4 .13a3.76 3.76 0 0 1-2-3.35V71.84a3.76 3.76 0 0 1 2-3.35a4 4 0 0 1 1.91-.5a3.94 3.94 0 0 1 2.13.63l88.18 56.16a3.8 3.8 0 0 1 0 6.44Z" />
                 </svg>
               </media-seek-forward-button>