Added settings fetch logic.

This commit is contained in:
moonstar-x 2023-06-02 12:48:41 -05:00
parent 439ac9945c
commit a02da77739
3 changed files with 61 additions and 1 deletions

6
public/settings.json Normal file
View File

@ -0,0 +1,6 @@
{
"slideshows": [
"pics",
["memes", "funny"]
]
}

View File

@ -1,10 +1,29 @@
import React from 'react'; import React from 'react';
import useFetch from '../../hooks/fetch';
import './SlideshowPicker.css'; import './SlideshowPicker.css';
const SlideshowPicker = () => { const SlideshowPicker = () => {
const { data: settings, error, loading } = useFetch('/settings.json');
if (loading) {
return (
<div>
LOADING
</div>
);
}
if (error) {
return (
<div>
{error}
</div>
);
}
return ( return (
<div className="container"> <div className="container">
{JSON.stringify(settings)}
</div> </div>
); );
}; };

35
src/hooks/fetch.js Normal file
View File

@ -0,0 +1,35 @@
import { useEffect, useMemo, useState } from 'react';
import axios from 'axios';
const useFetch = (url) => {
const http = useMemo(() => {
return axios.create({
baseURL: ''
});
}, []);
const [data, setData] = useState(null);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
useEffect(() => {
setLoading(true);
setData(null);
setError(null);
http.get(url)
.then((response) => {
setData(response.data);
})
.catch((error) => {
setError(error);
})
.finally(() => {
setLoading(false);
});
}, [url, http]);
return { data, error, loading };
};
export default useFetch;