ZmenuAppLinks.tsx 2.85 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
/**
 * See the NOTICE file distributed with this work for additional information
 * regarding copyright ownership.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

17 18 19 20 21
import React from 'react';
import { connect } from 'react-redux';
import { push } from 'connected-react-router';

import * as urlFor from 'src/shared/helpers/urlHelper';
22 23
import { parseFeatureId } from 'src/content/app/browser/browserHelper';
import { buildFocusIdForUrl } from 'src/shared/state/ens-object/ensObjectHelpers';
24 25 26 27 28 29 30 31

import {
  getBrowserActiveGenomeId,
  getBrowserActiveEnsObjectId,
  isFocusObjectPositionDefault
} from '../browserSelectors';

import { ToggleButton as ToolboxToggleButton } from 'src/shared/components/toolbox';
32
import ViewInApp from 'src/shared/components/view-in-app/ViewInApp';
33 34 35 36 37 38 39 40 41 42 43 44 45 46

import { RootState } from 'src/store';

import styles from './Zmenu.scss';

type Props = {
  featureId: string;
  activeFeatureId: string | null;
  genomeId: string | null;
  isInDefaultPosition: boolean;
  push: (path: string) => void;
};

const ZmenuAppLinks = (props: Props) => {
47
  const parsedFeatureId = parseFeatureId(props.featureId);
48

49
  if (parsedFeatureId.type !== 'gene') {
50 51 52
    return null;
  }

53 54
  const featureIdForUrl = buildFocusIdForUrl(parsedFeatureId);

55
  const getBrowserLink = () =>
56
    urlFor.browser({ genomeId: props.genomeId, focus: featureIdForUrl });
57 58 59 60

  const getEntityViewerLink = () =>
    urlFor.entityViewer({
      genomeId: props.genomeId,
61
      entityId: featureIdForUrl
62 63 64 65 66
    });

  const shouldShowBrowserButton =
    props.featureId !== props.activeFeatureId || !props.isInDefaultPosition;

67 68 69 70 71 72 73 74 75 76 77 78
  type linkType = {
    genomeBrowser?: string;
    entityViewer?: string;
  };

  const links: Partial<linkType> = {};

  if (shouldShowBrowserButton) {
    links['genomeBrowser'] = getBrowserLink();
  }
  links['entityViewer'] = getEntityViewerLink();

79 80
  return (
    <div className={styles.zmenuAppLinks}>
81
      <ViewInApp links={links} />
82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100
      <ToolboxToggleButton
        className={styles.zmenuToggleFooter}
        openElement={<span>Download</span>}
      />
    </div>
  );
};

const mapStateToProps = (state: RootState) => ({
  genomeId: getBrowserActiveGenomeId(state),
  activeFeatureId: getBrowserActiveEnsObjectId(state),
  isInDefaultPosition: isFocusObjectPositionDefault(state)
});

const mapDispatchToProps = {
  push
};

export default connect(mapStateToProps, mapDispatchToProps)(ZmenuAppLinks);