BrowserReset.tsx 1.86 KB
Newer Older
Andrey Azov's avatar
Andrey Azov committed
1
import React, { FunctionComponent } from 'react';
Imran Salam's avatar
Imran Salam committed
2

Andrey Azov's avatar
Andrey Azov committed
3
import { ChrLocation } from '../browserState';
4 5 6 7
import { ReactComponent as resetIcon } from 'static/img/browser/track-reset.svg';
import ImageButton, {
  ImageButtonStatus
} from 'src/shared/image-button/ImageButton';
Imran Salam's avatar
Imran Salam committed
8 9

import styles from './BrowserReset.scss';
10
import { getChrLocationStr } from '../browserHelper';
Imran Salam's avatar
Imran Salam committed
11

12
type BrowserResetProps = {
13
  activeGenomeId: string | null;
Andrey Azov's avatar
Andrey Azov committed
14 15 16
  chrLocation: ChrLocation | null;
  defaultChrLocation: ChrLocation | null;
  dispatchBrowserLocation: (genomeId: string, chrLocation: ChrLocation) => void;
17
  isDrawerOpened: boolean;
Imran Salam's avatar
Imran Salam committed
18 19 20 21 22
};

export const BrowserReset: FunctionComponent<BrowserResetProps> = (
  props: BrowserResetProps
) => {
23 24 25 26
  const {
    activeGenomeId,
    chrLocation,
    defaultChrLocation,
27
    isDrawerOpened
28
  } = props;
Imran Salam's avatar
Imran Salam committed
29

30
  const getResetIconStatus = (): ImageButtonStatus => {
Andrey Azov's avatar
Andrey Azov committed
31 32 33 34 35 36
    if (!(activeGenomeId && chrLocation && defaultChrLocation)) {
      return ImageButtonStatus.DISABLED;
    }

    const chrLocationStr = getChrLocationStr(chrLocation);
    const defaultChrLocationStr = getChrLocationStr(defaultChrLocation);
37

38
    if (chrLocationStr === defaultChrLocationStr || isDrawerOpened) {
39
      return ImageButtonStatus.DISABLED;
Imran Salam's avatar
Imran Salam committed
40 41
    }

42
    return ImageButtonStatus.ACTIVE;
Imran Salam's avatar
Imran Salam committed
43 44
  };

Andrey Azov's avatar
Andrey Azov committed
45
  const resetBrowser = () => {
46
    if (isDrawerOpened) {
47 48 49
      return;
    }

Andrey Azov's avatar
Andrey Azov committed
50 51 52 53 54 55
    defaultChrLocation &&
      props.dispatchBrowserLocation(
        activeGenomeId as string,
        defaultChrLocation
      );
  };
Imran Salam's avatar
Imran Salam committed
56 57

  return (
58 59 60 61 62 63 64
    <dd className={styles.resetButton}>
      <div className={styles.imageWrapper}>
        <ImageButton
          buttonStatus={getResetIconStatus()}
          description={'Reset browser image'}
          image={resetIcon}
          onClick={resetBrowser}
65
          classNames={{ disabled: styles.imageButtonDisabled }}
66 67
        />
      </div>
Imran Salam's avatar
Imran Salam committed
68 69 70 71
    </dd>
  );
};

72
export default BrowserReset;