add helmet

[alttp.git] / resources / js / components / pages / AosSeed.js

diff --git a/resources/js/components/pages/AosSeed.js b/resources/js/components/pages/AosSeed.js
index 6cea156640001c3228ac93c911db88c82a3eb11f..ece8406ea69774b6f7965625f8e4decbe25d3e59 100644 (file)
--- a/resources/js/components/pages/AosSeed.js
+++ b/resources/js/components/pages/AosSeed.js
@@ -1,5 +1,6 @@
 import axios from 'axios';
-import React, { useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
+import { Helmet } from 'react-helmet';
 import { useParams } from 'react-router-dom';
 
 import NotFound from './NotFound';
@@ -17,29 +18,49 @@ const AosSeed = () => {
        const [patch, setPatch] = useState(null);
        const [seed, setSeed] = useState(null);
 
-       useEffect(() => {
-               setLoading(true);
-               const ctrl = new AbortController();
+       const loadSeed = useCallback((hash, ctrl) => {
                axios
                        .get(`/api/aos-seed/${hash}`, { signal: ctrl.signal })
                        .then(response => {
                                setError(null);
                                setLoading(false);
                                setSeed(response.data);
-                               window.document.title = response.data.hash;
                        })
                        .catch(error => {
                                setError(error);
                                setLoading(false);
                                setSeed(null);
                        });
+       }, []);
+
+       useEffect(() => {
+               setLoading(true);
+               const ctrl = new AbortController();
+               loadSeed(hash, ctrl);
                return () => {
                        ctrl.abort();
                };
        }, [hash]);
 
+       useEffect(() => {
+               if (!seed || seed.status !== 'pending') {
+                       return;
+               }
+               const ctrl = new AbortController();
+               const timer = setTimeout(() => {
+                       loadSeed(seed.hash, ctrl);
+               }, 2000);
+               return () => {
+                       clearTimeout(timer);
+                       ctrl.abort();
+               };
+       }, [seed]);
+
        useEffect(() => {
                setPatch(null);
+               if (!seed || seed.status !== 'generated') {
+                       return;
+               }
                const ctrl = new AbortController();
                axios
                        .get(`/aos-seeds/${hash}.bps`, {
@@ -55,7 +76,12 @@ const AosSeed = () => {
                return () => {
                        ctrl.abort();
                };
-       }, [hash]);
+       }, [hash, seed]);
+
+       const retry = useCallback(async () => {
+               await axios.post(`/api/aos-seed/${hash}/retry`);
+               setSeed(seed => ({ ...seed, status: 'pending' }));
+       });
 
        if (loading) {
                return <Loading />;
@@ -70,7 +96,12 @@ const AosSeed = () => {
        }
 
        return <ErrorBoundary>
-               <Seed patch={patch} seed={seed} />
+               <Helmet>
+                       {seed ?
+                               <title>{seed.hash}</title>
+                       : null}
+               </Helmet>
+               <Seed onRetry={retry} patch={patch} seed={seed} />
        </ErrorBoundary>;
 };