36 lines
1.2 KiB
React
36 lines
1.2 KiB
React
|
import {useShopStore} from "./shop_store";
|
||
|
|
import {useClickAway} from "./options/useClickAway";
|
||
|
|
import {Modal} from "react-bootstrap";
|
||
|
|
import {Validation} from "./validate";
|
||
|
|
import React from "react";
|
||
|
|
|
||
|
|
export function RFQFeedback() {
|
||
|
|
const {closeRFQ, shouldShow, status} = useShopStore(state => ({
|
||
|
|
closeRFQ: state.closeRFQFeedback,
|
||
|
|
shouldShow: state.shouldShowRFQFeedback,
|
||
|
|
status: state.processingResult
|
||
|
|
}))
|
||
|
|
|
||
|
|
const ref = useClickAway((e) => {
|
||
|
|
if (e.type === "mousedown") // ignore touchstart
|
||
|
|
closeRFQ()
|
||
|
|
});
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Modal show={shouldShow} animation={true} centered>
|
||
|
|
<Modal.Body ref={ref}>
|
||
|
|
<div className="d-flex">
|
||
|
|
<div>
|
||
|
|
{status.status === Validation.OK ?
|
||
|
|
<img width="30px" src="/images/shop/icon-done.svg" alt="close"/>
|
||
|
|
: <img width="30px" src="/images/shop/icon-warning.svg" alt="close"/>
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
<div style={{'padding': '0 .5em'}}>
|
||
|
|
{status.message}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</Modal.Body>
|
||
|
|
</Modal>
|
||
|
|
)
|
||
|
|
}
|