diff options
| author | eperelm2 <emily_perelman@brown.edu> | 2023-07-18 11:40:12 -0400 |
|---|---|---|
| committer | eperelm2 <emily_perelman@brown.edu> | 2023-07-18 11:40:12 -0400 |
| commit | 5100a643fb0d98b6dd738e7024f4fe15f56ba1a8 (patch) | |
| tree | 92fa39d2d5cc8f584e3346c8fe0efaa5b184a9e5 /src/client/views/search/SearchBox.tsx | |
| parent | c9779f31d9ce2363e61c3c9fa7e3446203622dde (diff) | |
| parent | 16a1b7de3ec26187b3a426eb037a5e4f4b9fcc55 (diff) | |
Merge branch 'master' into secondpropertiesmenu-emily
Diffstat (limited to 'src/client/views/search/SearchBox.tsx')
| -rw-r--r-- | src/client/views/search/SearchBox.tsx | 62 |
1 files changed, 56 insertions, 6 deletions
diff --git a/src/client/views/search/SearchBox.tsx b/src/client/views/search/SearchBox.tsx index d13c09443..e911bd283 100644 --- a/src/client/views/search/SearchBox.tsx +++ b/src/client/views/search/SearchBox.tsx @@ -15,6 +15,9 @@ import { CollectionDockingView } from '../collections/CollectionDockingView'; import { ViewBoxBaseComponent } from '../DocComponent'; import { FieldView, FieldViewProps } from '../nodes/FieldView'; import './SearchBox.scss'; +import { fetchRecommendations } from '../newlightbox/utils'; +import { IRecommendation, Recommendation } from '../newlightbox/components'; +import { Colors } from '../global/globalEnums'; const DAMPENING_FACTOR = 0.9; const MAX_ITERATIONS = 25; @@ -43,6 +46,7 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() { @observable _searchString = ''; @observable _docTypeString = 'all'; @observable _results: Map<Doc, string[]> = new Map<Doc, string[]>(); + @observable _recommendations: IRecommendation[] = []; @observable _pageRanks: Map<Doc, number> = new Map<Doc, number>(); @observable _linkedDocsOut: Map<Doc, Set<Doc>> = new Map<Doc, Set<Doc>>(); @observable _linkedDocsIn: Map<Doc, Set<Doc>> = new Map<Doc, Set<Doc>>(); @@ -222,7 +226,7 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() { 'width', 'layout_autoHeight', 'acl-Override', - 'acl-Public', + 'acl-Guest', 'embedContainer', 'zIndex', 'height', @@ -394,6 +398,38 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() { if (query) { this.searchCollection(query); + const response = await fetchRecommendations('', query, [], true) + const recs = response.recommendations + const recommendations:IRecommendation[] = [] + for (const key in recs) { + const title = recs[key].title; + console.log(title); + const url = recs[key].url + const type = recs[key].type + const text = recs[key].text + const transcript = recs[key].transcript + const previewUrl = recs[key].previewUrl + const embedding = recs[key].embedding + const distance = recs[key].distance + const source = recs[key].source + const related_concepts = recs[key].related_concepts + const docId = recs[key].doc_id + recommendations.push({ + title: title, + data: url, + type: type, + text: text, + transcript: transcript, + previewUrl: previewUrl, + embedding: embedding, + distance: Math.round(distance * 100) / 100, + source: source, + related_concepts: related_concepts, + docId: docId + }) + } + const setRecommendations = action(() => this._recommendations = recommendations) + setRecommendations() } }; @@ -488,8 +524,12 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() { } }); + const recommendationsJSX: JSX.Element[] = this._recommendations.map((props) => ( + <Recommendation {...props}/> + )) + return ( - <div style={{ pointerEvents: 'all' }} className="searchBox-container"> + <div className="searchBox-container" style={{pointerEvents: 'all', background: StrCast(Doc.UserDoc().userBackgroundColor)}}> <div className="searchBox-bar"> {isLinkSearch ? null : ( <select name="type" id="searchBox-type" className="searchBox-type" onChange={this.onSelectChange}> @@ -512,10 +552,20 @@ export class SearchBox extends ViewBoxBaseComponent<SearchBoxProps>() { ref={this._inputRef} /> </div> - <div className="searchBox-results-container"> - <div className="searchBox-results-count">{`${validResults}` + ' result' + (validResults === 1 ? '' : 's')}</div> - <div className="searchBox-results-scroll-view">{resultsJSX}</div> - </div> + {resultsJSX.length > 0 && <div className="searchBox-results-container"> + <div className="section-header" style={{background: StrCast(Doc.UserDoc().userVariantColor, Colors.MEDIUM_BLUE)}}> + <div className="section-title">Results</div> + <div className="section-subtitle">{`${validResults}` + ' result' + (validResults === 1 ? '' : 's')}</div> + </div> + <div className="searchBox-results-view">{resultsJSX}</div> + </div>} + {recommendationsJSX.length > 0 && <div className="searchBox-recommendations-container"> + <div className="section-header" style={{background: StrCast(Doc.UserDoc().userVariantColor, Colors.MEDIUM_BLUE)}}> + <div className="section-title">Recommendations</div> + <div className="section-subtitle">{`${validResults}` + ' result' + (validResults === 1 ? '' : 's')}</div> + </div> + <div className="searchBox-recommendations-view">{recommendationsJSX}</div> + </div>} </div> ); } |
