| 106 | } |
| 107 | |
| 108 | renderList() { |
| 109 | const { query, facetSize, field, isOpen, result } = this.props; |
| 110 | const { facet, isExpanding } = this.state; |
| 111 | const isMultiSelect = field !== 'schema'; |
| 112 | const hasMoreValues = facetSize < facet.total; |
| 113 | const isUpdating = result.total === undefined; |
| 114 | |
| 115 | const values = |
| 116 | field === 'schema' |
| 117 | ? facet?.values?.map(({ id, label, ...rest }) => ({ |
| 118 | label: <Schema.Label schema={id} icon />, |
| 119 | id, |
| 120 | ...rest, |
| 121 | })) |
| 122 | : facet?.values; |
| 123 | |
| 124 | return ( |
| 125 | <> |
| 126 | {values !== undefined && ( |
| 127 | <CheckboxList |
| 128 | items={values} |
| 129 | selectedItems={query.getFilter(field)} |
| 130 | onItemClick={this.onSelect} |
| 131 | isMultiSelect={isMultiSelect} |
| 132 | > |
| 133 | {!isUpdating && hasMoreValues && ( |
| 134 | <a className="ShowMore" onClick={this.showMore} href="/"> |
| 135 | <FormattedMessage |
| 136 | id="search.facets.showMore" |
| 137 | defaultMessage="Show more…" |
| 138 | style={{ paddingTop: 10 }} |
| 139 | /> |
| 140 | </a> |
| 141 | )} |
| 142 | </CheckboxList> |
| 143 | )} |
| 144 | {isExpanding && isOpen && ( |
| 145 | <Spinner className={c('spinner', Classes.SMALL)} /> |
| 146 | )} |
| 147 | </> |
| 148 | ); |
| 149 | } |
| 150 | |
| 151 | render() { |
| 152 | const { query, isOpen, result, field, label, intl, isCollapsible } = |