TrackPanel.tsx 2.41 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
import React, { memo, useEffect } from 'react';
18
import { connect } from 'react-redux';
Andrey Azov's avatar
Andrey Azov committed
19
import isEqual from 'lodash/isEqual';
20

21
import TrackPanelList from './track-panel-list/TrackPanelList';
22
import TrackPanelModal from './track-panel-modal/TrackPanelModal';
23
import { SidebarLoader } from 'src/shared/components/loader';
24

25
import { getIsTrackPanelModalOpened } from './trackPanelSelectors';
26 27
import {
  getBrowserActivated,
28
  getBrowserActiveGenomeId,
29
  getBrowserActiveEnsObject
30
} from '../browserSelectors';
31

32 33
import { restoreBrowserTrackStates } from '../browserActions';

34
import { RootState } from 'src/store';
35
import { EnsObject } from 'src/shared/state/ens-object/ensObjectTypes';
36

37
export type TrackPanelProps = {
Andrey Azov's avatar
Andrey Azov committed
38
  activeGenomeId: string | null;
39
  browserActivated: boolean;
40
  activeEnsObject: EnsObject | null;
Imran Salam's avatar
Imran Salam committed
41
  isTrackPanelModalOpened: boolean;
42
  restoreBrowserTrackStates: () => void;
43 44
};

45
export const TrackPanel = (props: TrackPanelProps) => {
46 47 48
  const shouldRenderContent =
    props.activeGenomeId && props.browserActivated && props.activeEnsObject;

49 50 51 52
  useEffect(() => {
    props.restoreBrowserTrackStates();
  }, [props.activeEnsObject]);

53 54 55 56 57 58
  return shouldRenderContent ? (
    props.isTrackPanelModalOpened ? (
      <TrackPanelModal />
    ) : (
      <TrackPanelList />
    )
59 60 61
  ) : (
    <SidebarLoader />
  );
62
};
63

64
const mapStateToProps = (state: RootState) => {
65 66 67 68 69
  const activeGenomeId = getBrowserActiveGenomeId(state);

  return {
    activeGenomeId,
    browserActivated: getBrowserActivated(state),
70
    activeEnsObject: getBrowserActiveEnsObject(state),
71
    isTrackPanelModalOpened: getIsTrackPanelModalOpened(state)
72 73
  };
};
74

75 76 77 78 79 80 81 82
const mapDispatchToProps = {
  restoreBrowserTrackStates
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(memo(TrackPanel, isEqual));