This repository has been archived by the owner on Dec 30, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 391
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
test(Index): re-enable and make work fix(Index): allow context to be empty initially fix(Index): onSearchParameters with correct context fix(connector): onSearchParameters with correct context chore(Index): remove else chore(Index): consistent integration test chore: clarify test chore: fix life cycle fix(ts): index context can be undefined feedback from review fix(index): correct life cycles fix TS on Index connectorWrapper chore: update snapshots
- Loading branch information
Showing
11 changed files
with
300 additions
and
184 deletions.
There are no files selected for viewing
111 changes: 0 additions & 111 deletions
111
packages/react-instantsearch-core/src/components/Index.js
This file was deleted.
Oops, something went wrong.
145 changes: 145 additions & 0 deletions
145
packages/react-instantsearch-core/src/components/Index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,145 @@ | ||
import React, { Component, Children, ReactType } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { | ||
InstantSearchConsumer, | ||
InstantSearchContext, | ||
IndexProvider, | ||
IndexContext, | ||
} from '../core/context'; | ||
|
||
type Props = { | ||
indexName: string; | ||
indexId: string; | ||
root: { | ||
Root: ReactType; | ||
props: {}; | ||
}; | ||
}; | ||
|
||
type InnerProps = Props & { contextValue: InstantSearchContext }; | ||
|
||
type State = { | ||
indexContext: IndexContext; | ||
}; | ||
|
||
/** | ||
* @description | ||
* `<Index>` is the component that allows you to apply widgets to a dedicated index. It's | ||
* useful if you want to build an interface that targets multiple indices. | ||
* @kind widget | ||
* @name <Index> | ||
* @propType {string} indexName - index in which to search. | ||
* @propType {{ Root: string|function, props: object }} [root] - Use this to customize the root element. Default value: `{ Root: 'div' }` | ||
* @example | ||
* import React from 'react'; | ||
* import { InstantSearch, Index, SearchBox, Hits, Configure } from 'react-instantsearch-dom'; | ||
* | ||
* const App = () => ( | ||
* <InstantSearch | ||
* appId="latency" | ||
* apiKey="6be0576ff61c053d5f9a3225e2a90f76" | ||
* indexName="instant_search" | ||
* > | ||
* <Configure hitsPerPage={5} /> | ||
* <SearchBox /> | ||
* <Index indexName="instant_search"> | ||
* <Hits /> | ||
* </Index> | ||
* <Index indexName="bestbuy"> | ||
* <Hits /> | ||
* </Index> | ||
* </InstantSearch> | ||
* ); | ||
*/ | ||
class Index extends Component<InnerProps, State> { | ||
static propTypes = { | ||
// @TODO: These props are currently constant. | ||
indexName: PropTypes.string.isRequired, | ||
indexId: PropTypes.string.isRequired, | ||
children: PropTypes.node, | ||
root: PropTypes.shape({ | ||
Root: PropTypes.oneOfType([ | ||
PropTypes.string, | ||
PropTypes.func, | ||
PropTypes.object, | ||
]), | ||
props: PropTypes.object, | ||
}).isRequired, | ||
}; | ||
|
||
unregisterWidget?: () => void; | ||
|
||
state = { | ||
indexContext: { | ||
targetedIndex: this.props.indexId, | ||
}, | ||
}; | ||
|
||
constructor(props: InnerProps) { | ||
super(props); | ||
|
||
this.props.contextValue.onSearchParameters( | ||
this.getSearchParameters.bind(this), | ||
{ | ||
ais: this.props.contextValue, | ||
multiIndexContext: this.state.indexContext, | ||
}, | ||
this.props | ||
); | ||
} | ||
|
||
componentDidMount() { | ||
this.unregisterWidget = this.props.contextValue.widgetsManager.registerWidget( | ||
this | ||
); | ||
} | ||
|
||
componentWillReceiveProps(nextProps: InnerProps) { | ||
if (this.props.indexName !== nextProps.indexName) { | ||
this.props.contextValue.widgetsManager.update(); | ||
} | ||
if (this.props.indexId !== nextProps.indexId) { | ||
this.setState({ | ||
indexContext: { | ||
targetedIndex: nextProps.indexId, | ||
}, | ||
}); | ||
} | ||
} | ||
|
||
componentWillUnmount() { | ||
if (typeof this.unregisterWidget === 'function') { | ||
this.unregisterWidget(); | ||
} | ||
} | ||
|
||
getSearchParameters(searchParameters, props) { | ||
return searchParameters.setIndex( | ||
this.props ? this.props.indexName : props.indexName | ||
); | ||
} | ||
|
||
render() { | ||
const childrenCount = Children.count(this.props.children); | ||
const { Root, props } = this.props.root; | ||
if (childrenCount === 0) { | ||
return null; | ||
} | ||
return ( | ||
<Root {...props}> | ||
<IndexProvider value={this.state.indexContext}> | ||
{this.props.children} | ||
</IndexProvider> | ||
</Root> | ||
); | ||
} | ||
} | ||
|
||
const IndexWrapper: React.FC<Props> = props => ( | ||
<InstantSearchConsumer> | ||
{contextValue => <Index contextValue={contextValue} {...props} />} | ||
</InstantSearchConsumer> | ||
); | ||
|
||
export const IndexComponentWithoutContext = Index; | ||
export default IndexWrapper; |
Oops, something went wrong.