public render()

in fronts-client/src/components/feed/SearchInput.tsx [105:177]


	public render() {
		const { displaySearchFilters, rightHandContainer } = this.props;

		const {
			query,
			tags,
			sections,
			desks,
			ratings,
			fromDate: from,
			toDate: to,
		} = this.state;

		return (
			<React.Fragment>
				<InputContainer>
					<TextInputContainer>
						<TextInput
							placeholder="Search content"
							value={query || ''}
							onClick={this.showSearchFilters}
							onChange={this.handleSearchInput}
							onClear={this.clearInput}
							onSearch={this.hideSearchFilters}
							searchTermsExist={this.searchTermsExist}
							displaySearchIcon={!!this.handleDisplaySearchFilters}
							onKeyUp={(e) => {
								if (e.keyCode === 13) {
									this.hideSearchFilters();
								}
							}}
						/>
					</TextInputContainer>
					{rightHandContainer}
				</InputContainer>
				{tags.map((tag) => (
					<FilterItem
						key={tag}
						onClear={() => this.removeStringFromStateKey('tags', tag)}
					>
						<span>{tag}</span>
					</FilterItem>
				))}
				{sections.map((section) => (
					<FilterItem
						key={section}
						onClear={() => this.removeStringFromStateKey('sections', section)}
					>
						<span>{section}</span>
					</FilterItem>
				))}
				{desks.map((desk) => (
					<FilterItem
						key={desk}
						onClear={() => this.removeStringFromStateKey('desks', desk)}
					>
						<span>{desk}</span>
					</FilterItem>
				))}
				{ratings.map((rating) => (
					<FilterItem
						key={rating}
						onClear={() => this.removeStringFromStateKey('ratings', rating)}
					>
						<span>{rating}</span>
					</FilterItem>
				))}
				{this.shouldShowDate && (
					<FilterItem onClear={() => this.clearSelectedDates()}>
						<span>From: {renderDateAsString(from)} </span>
						<span>To: {renderDateAsString(to)} </span>
					</FilterItem>
				)}