diff --git a/src/apps/concepts/components/ViewConceptsHeader.tsx b/src/apps/concepts/components/ViewConceptsHeader.tsx index 178d596d8..3a0dd0381 100644 --- a/src/apps/concepts/components/ViewConceptsHeader.tsx +++ b/src/apps/concepts/components/ViewConceptsHeader.tsx @@ -10,6 +10,10 @@ import { getContainerIdFromUrl } from "../utils"; import { Button, createStyles, + Grid, + IconButton, + Input, + InputAdornment, makeStyles, Menu, MenuItem, @@ -20,7 +24,7 @@ import { useAnchor } from "../../../utils"; import { APISource } from "../../sources"; -import { AccountTreeOutlined, FolderOpen } from "@material-ui/icons"; +import { AccountTreeOutlined, FolderOpen, Search as SearchIcon } from "@material-ui/icons"; import { APIDictionary } from '../../dictionaries/types'; interface Props { @@ -59,6 +63,10 @@ const useStyles = makeStyles((theme: Theme) => marginRight: "0.2rem", fill: "#8080809c" }, + searchInput: { + textAlign: "center", + fontSize: "larger" + }, }) ); @@ -70,8 +78,11 @@ const ViewConceptsHeader: React.FC = ({ children, sources, dictionaries + // showOnlyVerified, + // toggleShowVerified }) => { const [showSources, setShowSources] = useState(false); + const [search, setSearch] = useState(""); const [preferredSources, setPreferredSources] = useState< { name: string; url: string }[] >(); useEffect(() => { const defaultSources = Object.entries( PREFERRED_SOURCES_VIEW_ONLY).map(([key, value]) => ({ name: key, url: value })); @@ -82,6 +93,9 @@ const ViewConceptsHeader: React.FC = ({ setPreferredSources(allSources); } else setPreferredSources(defaultSources); }, [showSources, sources, dictionaries]); + // const handleSearch = (event) => { + // setSearch(event.target.value) + // } const classes = useStyles(); const isSourceContainer = containerType === SOURCE_CONTAINER; @@ -91,7 +105,6 @@ const ViewConceptsHeader: React.FC = ({ handleSwitchSourceClick, handleSwitchSourceClose ] = useAnchor(); - const getTitleBasedOnContainerType = () => { return isAddToDictionary ? `Import existing concept from ${getContainerIdFromUrl(containerUrl)}` @@ -124,14 +137,55 @@ const ViewConceptsHeader: React.FC = ({ keepMounted open={Boolean(switchSourceAnchor)} onClose={handleSwitchSourceClose} - > - + Select a recommended source + {/* {showSources ? "Select a recommended source" : "Select an alternative source"} */} + + } + + {/* } + checked={showOnlyVerified} + onChange={toggleShowVerified} + color="primary" + name="displayVerified" + /> + } + label={ + showOnlyVerified ? `Showing verified {"Select a recommended source"} only` : `Show verified {"Select an alternative source"} only` + } + /> */} + {preferredSources?.map(({ name, url }) => (