Skip to content
This repository has been archived by the owner on Dec 16, 2022. It is now read-only.

feat(react instantsearch widget): add connector and widget metadata #570

Merged
merged 7 commits into from
May 19, 2022

Conversation

dhayab
Copy link
Member

@dhayab dhayab commented May 19, 2022

This PR adds support for $$type and $$widgetType in the React InstantSearch Widget template. It also addresses some build issues.

Ticket: FX-993

Result

  • The widget template now sets $$type and $$widgetType (to {{ organization }}.{{ widgetName }} by default)
  • The build script doesn't fail anymore due to TypeScript issues
  • The README correctly shows how to import InstantSearch from react-instantsearch-dom

Comment on lines 8 to 13
type Connector<TProvided = {}, TExposed = {}> = ((
stateless: React.FunctionComponent<ConnectorProvided<TProvided>>
) => React.ComponentClass<TExposed>) &
(<TProps extends Partial<ConnectorProvided<TProvided>>>(
Composed: React.ComponentType<TProps>
) => ConnectedComponentClass<TProps, ConnectorProvided<TProvided>, TExposed>);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The only way I could find to fix a TypeScript error during build:types is to explicitly set the type (by copying it from @types/react-instantsearch-core) and assign it to the connector.

Here's the issue for reference:

$ tsc -p tsconfig.declaration.json
src/lib/connector.ts:19:14 - error TS2742: The inferred type of 'connectWidget' cannot be named without a reference to 'react-instantsearch-core/node_modules/@types/react'. This is likely not portable. A type annotation is necessary.

19 export const connectWidget = createConnector<ProvidedProps>({
                ~~~~~~~~~~~~~

type WidgetParams = {
/**
* Placeholder text for input element.
*/
placeholder?: string;
};

export const {{ pascalCaseName }}: ElementType<WidgetParams> =
connect{{ pascalCaseName }}({{ pascalCaseName }}Component);
export const {{ pascalCaseName }}: React.ElementType<WidgetParams> = connect{{ pascalCaseName }}(
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The change from ElementType to React.ElementType fixes a TypeScript error during build:types. I don't know why though.

@dhayab dhayab marked this pull request as ready for review May 19, 2022 08:36
@dhayab dhayab requested review from a team, FabienMotte, sarahdayan and Haroenv and removed request for a team May 19, 2022 08:36
e2e/__snapshots__/templates.test.js.snap Outdated Show resolved Hide resolved
e2e/__snapshots__/templates.test.js.snap Outdated Show resolved Hide resolved
@dhayab dhayab requested a review from Haroenv May 19, 2022 13:18
Copy link
Contributor

@Haroenv Haroenv left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it's odd that connector needs to be retyped, but no big deal

@dhayab dhayab merged commit b22a9e6 into master May 19, 2022
@dhayab dhayab deleted the feat/react-instantsearch-widget-metadata branch May 19, 2022 14:49
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants