Commit 268dedcc authored by Aron Fiechter's avatar Aron Fiechter
Browse files

Add NoResultsModal

parent c20730b0
Pipeline #882 canceled with stage
......@@ -3,6 +3,7 @@ import CNavbar from './components/navbar/CNavbar';
import './App.css';
import Main from './components/Main';
import SearchModal from './components/search/SearchModal';
import NoResultsModal from './components/queryResult/NoResultsModal';
const App = () => {
return (
......@@ -10,6 +11,7 @@ const App = () => {
<CNavbar />
<Main />
<SearchModal />
<NoResultsModal />
</div>
);
};
......
import React from 'react';
import Modal from 'react-bootstrap/Modal';
import Button from 'react-bootstrap/Button';
import { useDispatch, useSelector } from 'react-redux';
import { closeNoResultModal, selectNoResultModalOpen, selectQuery } from '../navbar/querySlice';
import Card from 'react-bootstrap/Card';
export default function NoResultsModal(props) {
const dispatch = useDispatch();
const noResultModalOpen = useSelector(selectNoResultModalOpen);
// Function to close modal
const handleClose = () => dispatch(closeNoResultModal());
return (
<Modal
show={noResultModalOpen}
onHide={handleClose}
backdrop="static"
keyboard={false}
size="lg"
>
<Modal.Header closeButton>
<Modal.Title>No results!</Modal.Title>
</Modal.Header>
<Modal.Body>
<Card.Text>Your query produced no results.</Card.Text>
</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={handleClose}>
Close
</Button>
</Modal.Footer>
</Modal>
);
}
......@@ -128,14 +128,7 @@ export default function SearchModal() {
return (
<Form inline>
<Modal
show={showModal}
onHide={handleClose}
backdrop="static"
keyboard={false}
animation={false}
size="lg"
>
<Modal show={showModal} onHide={handleClose} backdrop="static" keyboard={false} size="lg">
<Modal.Header closeButton>
<Modal.Title>Advanced Search</Modal.Title>
</Modal.Header>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment