diff --git a/src/components/AdminPane/Manage/ProjectPickerModal/ProjectPickerModal.js b/src/components/AdminPane/Manage/ProjectPickerModal/ProjectPickerModal.js index 44500e513..278e9619d 100644 --- a/src/components/AdminPane/Manage/ProjectPickerModal/ProjectPickerModal.js +++ b/src/components/AdminPane/Manage/ProjectPickerModal/ProjectPickerModal.js @@ -10,6 +10,7 @@ import WithSearchResults import WithPagedProjects from '../../../HOCs/WithPagedProjects/WithPagedProjects' import SearchBox from '../../../SearchBox/SearchBox' +import { get as levenshtein } from 'fast-levenshtein'; import Modal from '../../../Modal/Modal' import messages from './Messages' @@ -53,6 +54,7 @@ export class ProjectPickerModal extends Component { projects={this.props.pagedCandidateProjects} currentProjectId={this.props.currentProjectId} onSelectProject={this.props.onSelectProject} + searchQuery={this.props.searchCriteria?.query} /> ) @@ -60,28 +62,46 @@ export class ProjectPickerModal extends Component { } const CandidateProjectList = function(props) { - const projectItems = _compact(_map(props.projects, project => { - if (project.id === props.currentProjectId) { + const { projects, currentProjectId, onSelectProject, searchQuery } = props + + const sortedProjects = _compact(_map(projects, project => { + if (project.id === currentProjectId) { return null } - return ( -
  • - props.onSelectProject(project)} - > - {project.displayName ? project.displayName : project.name} - -
  • - ) - })) + let index = 0 + if (searchQuery) { + const displayNameLower = project.displayName.toLowerCase() + const searchQueryLower = searchQuery.toLowerCase() + if (displayNameLower.startsWith(searchQueryLower)) { + index = 3 + } else if (displayNameLower.includes(searchQueryLower)) { + index = 2 + } + else { + const similarity = levenshtein(searchQueryLower, displayNameLower) + if (similarity > 0 && similarity < 4) { + index = 1 + } + } + } - return _isEmpty(projectItems) ? - : ( -
      - {projectItems} -
    - ) + return { project, index } + })).sort((a, b) => b.index - a.index) + + return _isEmpty(sortedProjects) ? + : + ( +
      + {_map(sortedProjects, ({ project }) => ( +
    1. + onSelectProject(project)}> + {project.displayName ? project.displayName : project.name} + +
    2. + ))} +
    + ) } export default