Added settings fetch logic.
This commit is contained in:
parent
439ac9945c
commit
a02da77739
6
public/settings.json
Normal file
6
public/settings.json
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
{
|
||||||
|
"slideshows": [
|
||||||
|
"pics",
|
||||||
|
["memes", "funny"]
|
||||||
|
]
|
||||||
|
}
|
@ -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
35
src/hooks/fetch.js
Normal 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;
|
Loading…
Reference in New Issue
Block a user