diff --git a/pairent_frontend_react/package.json b/pairent_frontend_react/package.json index a84c997..bc7a23b 100644 --- a/pairent_frontend_react/package.json +++ b/pairent_frontend_react/package.json @@ -12,6 +12,7 @@ "react-dom": "^18.2.0", "react-router-dom": "^6.11.0", "react-select": "^5.7.3", + "react-spinners": "^0.13.8", "styled-components": "^6.0.0-rc.1", "swiper": "^9.2.4" }, diff --git a/pairent_frontend_react/src/pages/IndexPage/index.jsx b/pairent_frontend_react/src/pages/IndexPage/index.jsx index 975e2f1..c4c7846 100644 --- a/pairent_frontend_react/src/pages/IndexPage/index.jsx +++ b/pairent_frontend_react/src/pages/IndexPage/index.jsx @@ -13,6 +13,7 @@ import 'swiper/css/navigation'; // swiper customization import './swiper.css'; import ApartamentService from "../../API/ApartamentService"; +import { HashLoader } from 'react-spinners'; const SVGIcon = styled(ISVGIcon)` @@ -27,10 +28,6 @@ const Title = styled.p` text-shadow: 0 2px 1px #00000020; `; -const HighlightWord = styled.span` - color: cornflowerblue; -`; - const SwiperImage = styled.div` background: url(${props => props.src ? props.src : ''}); background-repeat: no-repeat; @@ -94,13 +91,7 @@ const SubmitBtn = styled.button` background: royalblue; padding: 10px; border-radius: 8px; - color: #f9f9f9; - font-weight: 700; - float: right; - - &:active { - background: #3759bf - } + color: #f9f9f9;W `; const SearchBarFilter = styled.div` @@ -166,6 +157,12 @@ const IndexPageRoot = styled.div` margin: 50px auto `; +const Splash = styled.h3` + font-weight: 500; + margin: 48px 0; + text-align: center; +`; + const FiltersForm = () => { const apart_sizes = [ @@ -300,12 +297,14 @@ export default class IndexPage extends React.Component { apartments: [], pageSize: 10, page: 0, - data_loaded: false + data_loaded: false, + load_err: false }; ApartamentService.getAll(100).then(data => { - globalThis.data = data.data.results; this.setState({apartments: data.data.results, data_loaded: true}); + }).catch(err => { + this.setState({data_loaded: true, apartments: [], load_err: err.message}); }); } @@ -338,7 +337,7 @@ export default class IndexPage extends React.Component {