ProductMap ProductMapPopup.tsx

25% Statements 2/8

0% Branches 0/4

0% Functions 0/3

28.57% Lines 2/7

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46  
4x
 
 
 
 
 
 
 
 
4x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import React, { FC, useMemo, useState } from 'react';
const styles = require('./ProductMap.module.css')
import { Loading } from 'ag-ems-ui-library';
import { Modal } from '../Modal';
import { Map } from '../Map';
 
export const ProductMapPopup: FC<{
  product: any;
  isOpen: boolean;
  onClose: () => void;
}> = ({
  product,
  isOpen,
  onClose
}) => {
  const [preloader, setPreloader] = useState(true);
 
  const onInit = () => setPreloader(false);
 
  const map = useMemo(() => {
    return <Map
      products={[product]}
      onInit={onInit}
      center={product.coordinates
        ? [product.coordinates.lat, product.coordinates.lon]
        : [product.location.coordinates.lat, product.location.coordinates.lon]
      }
      zoom={14}
      open={isOpen}
    />
  }, [product, isOpen]);
 
  return (
    <Modal
      isOpen={isOpen}
      onClose={onClose}
      headerClasses={styles.ProductMapPopupHeader}
      containerClasses={styles.ProductMapPopupContainer}
      contentClasses={styles.ProductMapPopupContent}
      existed={true}
    >
      {preloader && <Loading color="#007c00" />}
      {map}
    </Modal>
  );
};