This commit is contained in:
Wisani Shilumani 2018-07-13 12:43:51 +02:00
parent 20f54315e6
commit 3001dcc1a6
2 changed files with 14 additions and 6 deletions

View File

@ -16,6 +16,7 @@ class BrowseArchives extends React.Component {
this.state = { this.state = {
term: '', term: '',
debounceTerm: '',
searchResults: [], searchResults: [],
isSingleInterviewModalOpen: false, isSingleInterviewModalOpen: false,
isInterviewsListModalOpen: false, isInterviewsListModalOpen: false,
@ -38,6 +39,7 @@ class BrowseArchives extends React.Component {
this.setState({ this.setState({
term: event.target.value, term: event.target.value,
isSearchActive: true, isSearchActive: true,
searchResults: [],
}); });
if (event.target.value.length === 0) { if (event.target.value.length === 0) {
@ -76,8 +78,8 @@ class BrowseArchives extends React.Component {
} }
getSelectedInterview = () => { getSelectedInterview = () => {
const { activeSingleInterviewId } = this.state; const { activeSingleInterviewId, interviewData } = this.state;
const selectedInterview = this.transformInterviews(InterviewsData) const selectedInterview = interviewData
.find(item => item.id === activeSingleInterviewId); .find(item => item.id === activeSingleInterviewId);
return selectedInterview; return selectedInterview;
} }
@ -94,6 +96,9 @@ class BrowseArchives extends React.Component {
getSearchResultsDebounce = _.debounce(() => { getSearchResultsDebounce = _.debounce(() => {
const { term } = this.state; const { term } = this.state;
this.getSearchResults(term); this.getSearchResults(term);
this.setState({
debounceTerm: term,
});
}, 700); }, 700);
clearSearchInput = () => { clearSearchInput = () => {
@ -222,6 +227,8 @@ class BrowseArchives extends React.Component {
activeSingleInterviewId, activeSingleInterviewId,
term, term,
searchResults, searchResults,
interviewData,
debounceTerm,
} = this.state; } = this.state;
return ( return (
@ -236,7 +243,7 @@ class BrowseArchives extends React.Component {
<div className="browse-content-left"> <div className="browse-content-left">
{isSearchActive && {isSearchActive &&
(<RelatedInterviewsList (<RelatedInterviewsList
data={this.transformInterviews(InterviewsData)} data={interviewData}
toggleSingleInterview={this.toggleSingleInterview} toggleSingleInterview={this.toggleSingleInterview}
/>) />)
} }
@ -246,13 +253,13 @@ class BrowseArchives extends React.Component {
<SearchResults <SearchResults
data={searchResults} data={searchResults}
questions={Questions} questions={Questions}
term={term} term={debounceTerm}
toggleSingleInterview={this.toggleSingleInterview} toggleSingleInterview={this.toggleSingleInterview}
/>) : />) :
( (
<React.Fragment> <React.Fragment>
<InterviewsList <InterviewsList
data={this.transformInterviews(InterviewsData)} data={interviewData}
isInterviewsListModalOpen={isInterviewsListModalOpen} isInterviewsListModalOpen={isInterviewsListModalOpen}
toggleSingleInterview={this.toggleSingleInterview} toggleSingleInterview={this.toggleSingleInterview}
toggleInterviewsListModal={this.toggleInterviewsListModal} toggleInterviewsListModal={this.toggleInterviewsListModal}

View File

@ -4,12 +4,13 @@ import './style.scss';
import Parser from 'html-react-parser'; import Parser from 'html-react-parser';
const SearchResults = (props) => { const SearchResults = (props) => {
if (!props.data) { if (!props.data || props.data.length < 1) {
return <div>Loading...</div>; return <div>Loading...</div>;
} }
// sort array alphabetically // sort array alphabetically
const sortedInterviews = props.data.sort((a, b) => a.name.localeCompare(b.name)); const sortedInterviews = props.data.sort((a, b) => a.name.localeCompare(b.name));
const trimText = (text, length) => { const trimText = (text, length) => {
if (text === null) { if (text === null) {
return ''; return '';