public render()

in fronts-client/src/components/FrontsEdit/FrontsMenu.tsx [134:194]


	public render() {
		return (
			<>
				{this.state.isOpen && (
					<FadeIn>
						<Overlay />
					</FadeIn>
				)}
				<FrontsMenuContainer isOpen={this.state.isOpen}>
					<ButtonOverlayContainer>
						<ButtonOverlay
							data-testid="fronts-menu-button"
							onClick={this.toggleFrontsMenu}
							active={this.state.isOpen}
						>
							<MoreIcon size={'xxl'} />
						</ButtonOverlay>
					</ButtonOverlayContainer>
					<ScrollContainer
						fixed={<FrontsMenuHeading>Add Front</FrontsMenuHeading>}
					>
						<FrontsMenuContent>
							<FrontsMenuSubHeading>
								<Row>
									<Col>Favourites</Col>
								</Row>
							</FrontsMenuSubHeading>
							<FrontsList
								renderOnlyStarred
								onSelect={this.onSelectFront}
								onStar={this.onFavouriteFront}
								onUnfavourite={this.onUnfavouriteFront}
							/>

							<FrontsMenuSubHeading>
								<Row>
									<Col>All</Col>
									<FrontsMenuSearchInputContainer>
										<FrontsMenuSearchInput
											value={this.state.searchString}
											onChange={this.onInput}
											ref={this.inputRef}
										/>
										<FrontsMenuSearchImage>
											<SearchIcon size={'xl'} title={'Search fronts'} />
										</FrontsMenuSearchImage>
									</FrontsMenuSearchInputContainer>
								</Row>
							</FrontsMenuSubHeading>
							<FrontsList
								onSelect={this.onSelectFront}
								onStar={this.onFavouriteFront}
								onUnfavourite={this.onUnfavouriteFront}
								searchString={this.state.searchString}
							/>
						</FrontsMenuContent>
					</ScrollContainer>
				</FrontsMenuContainer>
			</>
		);
	}