Commit 8d69ebf3 authored by Jyothish NT's avatar Jyothish NT

Initial replacement of selected-species

parent 29b8f1cd
Pipeline #104174 failed with stages
in 2 minutes and 29 seconds
......@@ -28,7 +28,7 @@ import { getEnabledCommittedSpecies } from 'src/content/app/species-selector/sta
import AppBar, {
HelpAndDocumentation
} from 'src/shared/components/app-bar/AppBar';
import { FocusableSelectedSpecies } from 'src/shared/components/selected-species';
import { SelectedSpecies } from 'src/shared/components/selected-species';
import SpeciesTabsWrapper from 'src/shared/components/species-tabs-wrapper/SpeciesTabsWrapper';
import { RootState } from 'src/store';
......@@ -43,7 +43,7 @@ type BrowserAppBarProps = {
const BrowserAppBar = (props: BrowserAppBarProps) => {
const speciesTabs = useMemo(() => {
return props.species.map((species, index) => (
<FocusableSelectedSpecies
<SelectedSpecies
key={index}
species={species}
isActive={species.genome_id === props.activeGenomeId}
......
......@@ -26,7 +26,7 @@ import { getEnabledCommittedSpecies } from 'src/content/app/species-selector/sta
import AppBar, {
HelpAndDocumentation
} from 'src/shared/components/app-bar/AppBar';
import { FocusableSelectedSpecies } from 'src/shared/components/selected-species';
import { SelectedSpecies } from 'src/shared/components/selected-species';
import SpeciesTabsWrapper from 'src/shared/components/species-tabs-wrapper/SpeciesTabsWrapper';
import { RootState } from 'src/store';
......@@ -41,7 +41,7 @@ type CustomDownloadAppBarProps = {
const CustomDownloadAppBar = (props: CustomDownloadAppBarProps) => {
const speciesTabs = props.species.map((species, index) => (
<FocusableSelectedSpecies
<SelectedSpecies
key={index}
species={species}
isActive={species.genome_id === props.activeGenomeId}
......
......@@ -30,7 +30,7 @@ import { changeActiveGenomeId } from 'src/content/app/entity-viewer/state/genera
import AppBar, {
HelpAndDocumentation
} from 'src/shared/components/app-bar/AppBar';
import { FocusableSelectedSpecies } from 'src/shared/components/selected-species';
import { SelectedSpecies } from 'src/shared/components/selected-species';
import SpeciesTabsWrapper from 'src/shared/components/species-tabs-wrapper/SpeciesTabsWrapper';
import { RootState } from 'src/store';
......@@ -45,7 +45,7 @@ type EntityViewerAppBarProps = {
const EntityViewerAppBar = (props: EntityViewerAppBarProps) => {
const speciesTabs = useMemo(() => {
return props.species.map((species, index) => (
<FocusableSelectedSpecies
<SelectedSpecies
key={index}
species={species}
isActive={species.genome_id === props.activeGenomeId}
......
......@@ -26,7 +26,7 @@ import {
import * as urlFor from 'src/shared/helpers/urlHelper';
import AppBar from 'src/shared/components/app-bar/AppBar';
import SelectedSpecies from 'src/content/app/species-selector/components/selected-species/SelectedSpecies';
import SelectedSpecies from 'src/shared/components/selected-species/SelectedSpecies';
import SpeciesTabsWrapper from 'src/shared/components/species-tabs-wrapper/SpeciesTabsWrapper';
import { HelpPopupButton } from 'src/shared/components/help-popup';
......@@ -37,7 +37,6 @@ import styles from './SpeciesSelectorAppBar.scss';
type Props = {
selectedSpecies: CommittedItem[];
toggleSpeciesUse: (genomeId: string) => void;
onSpeciesDelete: (genomeId: string) => void;
};
......@@ -65,6 +64,10 @@ export const SpeciesSelectorAppBar = (props: Props) => {
);
};
const showSpeciesHomepage = () => {
return;
};
const SelectedSpeciesList = (props: Props) => {
const shouldLinkToGenomeBrowser =
props.selectedSpecies.filter(({ isEnabled }) => isEnabled).length > 0;
......@@ -73,8 +76,9 @@ const SelectedSpeciesList = (props: Props) => {
<SelectedSpecies
key={species.genome_id}
species={species}
onToggleUse={props.toggleSpeciesUse}
onRemove={props.onSpeciesDelete}
onClick={showSpeciesHomepage}
// onToggleUse={props.toggleSpeciesUse}
// onRemove={props.onSpeciesDelete}
/>
));
......@@ -90,6 +94,7 @@ const mapStateToProps = (state: RootState) => ({
});
const mapDispatchToProps = {
showSpeciesHomepage: showSpeciesHomepage,
toggleSpeciesUse: toggleSpeciesUseAndSave,
onSpeciesDelete: deleteSpeciesAndSave
};
......
......@@ -18,7 +18,7 @@ import React, { useEffect } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import classNames from 'classnames';
import { getDisplayName } from 'src/shared/components/new-selected-species/selectedSpeciesHelpers';
import { getDisplayName } from 'src/shared/components/selected-species/selectedSpeciesHelpers';
import { isSidebarOpen as getSidebarStatus } from 'src/content/app/species/state/sidebar/speciesSidebarSelectors';
import { getCommittedSpeciesById } from 'src/content/app/species-selector/state/speciesSelectorSelectors';
......
......@@ -23,12 +23,13 @@ import { getEnabledCommittedSpecies } from 'src/content/app/species-selector/sta
import AppBar from 'src/shared/components/app-bar/AppBar';
import SpeciesTabsWrapper from 'src/shared/components/species-tabs-wrapper/SpeciesTabsWrapper';
import { SimpleSelectedSpecies } from 'src/shared/components/selected-species';
import { SelectedSpecies } from 'src/shared/components/selected-species';
import { RootState } from 'src/store';
import { CommittedItem } from 'src/content/app/species-selector/types/species-search';
import styles from './HomepageSpeciesBar.scss';
import { handleSelectedSpecies } from 'src/content/app/species-selector/state/speciesSelectorActions';
type Props = {
species: CommittedItem[];
......@@ -52,7 +53,11 @@ const HomepageSpeciesBar = (props: Props) => {
);
} else {
const speciesItems = props.species.map((species, index) => (
<SimpleSelectedSpecies key={index} species={species} />
<SelectedSpecies
key={index}
species={species}
onClick={handleSelectedSpecies}
/>
));
barContent = <SpeciesTabsWrapper speciesTabs={speciesItems} />;
}
......
......@@ -14,4 +14,5 @@
* limitations under the License.
*/
export { default as SelectedSpecies } from './SelectedSpecies';
export { default as SimpleSelectedSpecies } from './SimpleSelectedSpecies';
export { default as FocusableSelectedSpecies } from './FocusableSelectedSpecies';
......@@ -14,5 +14,4 @@
* limitations under the License.
*/
export { default as SimpleSelectedSpecies } from './SimpleSelectedSpecies';
export { default as FocusableSelectedSpecies } from './FocusableSelectedSpecies';
export { default as SelectedSpecies } from './SelectedSpecies';
......@@ -20,11 +20,11 @@ import { nonBreakingSpace } from 'src/shared/constants/strings';
import styles from './MultiLineSpeciesWrapper.scss';
import { Props as SimpleSelectedSpeciesProps } from 'src/shared/components/selected-species/SimpleSelectedSpecies';
import { Props as SelectedSpeciesProps } from 'src/shared/components/selected-species/SelectedSpecies';
import { Props as SpeciesSelectorSelectedSpeciesProps } from 'src/content/app/species-selector/components/selected-species/SelectedSpecies';
type MultiLineSelectedSpeciesProps =
| SimpleSelectedSpeciesProps
| SelectedSpeciesProps
| SpeciesSelectorSelectedSpeciesProps;
export type Props = {
......
......@@ -22,11 +22,11 @@ import { getSpeciesItemWidths } from './speciesTabsWrapperHelpers';
import styles from './SingleLineSpeciesWrapper.scss';
import { Props as FocusableSelectedSpeciesProps } from 'src/shared/components/selected-species/FocusableSelectedSpecies';
import { Props as SelectedSpeciesProps } from 'src/shared/components/selected-species/SelectedSpecies';
export type Props = {
isWrappable: false;
speciesTabs: ReactElement<FocusableSelectedSpeciesProps>[];
speciesTabs: ReactElement<SelectedSpeciesProps>[];
link?: React.ReactNode | null;
};
......@@ -36,7 +36,7 @@ const animationCalculator = ({
containerRef,
containerWidth
}: {
items: FocusableSelectedSpeciesProps[];
items: SelectedSpeciesProps[];
hoveredItemIndex: number | null;
containerRef: React.RefObject<HTMLElement>;
containerWidth: number;
......
......@@ -16,7 +16,7 @@
import { getFullSpeciesItemWidth } from 'src/shared/components/selected-species/selectedSpeciesHelpers';
import { Props as FocusableSelectedSpeciesProps } from 'src/shared/components/selected-species/FocusableSelectedSpecies';
import { Props as SelectedSpeciesProps } from 'src/shared/components/selected-species/SelectedSpecies';
const SPACE_BETWEEN_SPECIES = 7;
......@@ -24,7 +24,7 @@ export const getSpeciesItemWidths = ({
items,
containerWidth
}: {
items: Array<FocusableSelectedSpeciesProps & { isHovered: boolean }>;
items: Array<SelectedSpeciesProps & { isHovered: boolean }>;
containerWidth: number;
}) => {
const naturalItemWidths = items.map((item) =>
......
......@@ -16,7 +16,7 @@
import React from 'react';
import SelectedSpecies from 'src/shared/components/new-selected-species/SelectedSpecies';
import SelectedSpecies from 'src/shared/components/selected-species/SelectedSpecies';
import speciesData from '../species-tabs-wrapper/speciesData';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment