refactor: older changelogs fetching

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`);
+    const { data, error } = await tryCatch(fetch(`/changelog/${version}.md`));
-    return await res.text();
+    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(
+          {props.previousVersions.length > 0 &&
-              (version) => (
+            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>
-        )}
       </Modal.Body>
     </Modal>
   );

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>