[Bug] injectComponents Destroy Map State & KeplerReducer
- Dominant language
- TypeScript
- Stars
- 12k
- Forks
- 2k
- Avg merge
- 1d 5h
- Merged PRs (30d)
- 66
Description
**Describe the bug**
Hi everyone.
I use ^3.0.0-alpha.0 version
The Imported KepleGl component in playing ok and i can render all the data.
However im trying to use injectComponents in order to update the map points tooltip so i can add a custom button in there and use this instance to load the map. Whem im trying to do that im getting errors.
My code ->
```typescript
const KeplerGl = injectComponents([hoverLayers as never]);
```
```typescript
state.keplerGl}
width={windowDimension.width}
height={windowDimension.height}
/>
```
And the Hover layers component is
```typescript
import React from "react";
import { LayerHoverInfoFactory } from "@kepler.gl/components";
const CustomLayerHoverInfoFactory = () => {
const LayerHoverInfo = (props: any) => {
const { data, layer, fieldsToShow } = props;
if (!data || !layer) {
return null;
}
return
};
return LayerHoverInfo;
};
const hoverLayers = [LayerHoverInfoFactory, CustomLayerHoverInfoFactory];
export default hoverLayers;
```
State & Reducers
```typescript
const customizedKeplerGlReducer = keplerGlReducer.initialState({ ...state });
export default combineReducers({
keplerGl: customizedKeplerGlReducer,
app: appReducer,
polling: pollingReducer,
realTime: realTimeReducer,
simulations: simualtionsReducer,
});
```
and i get the next Error:
`
Cannot read properties of undefined (reading 'visState')
`
This is the redux actions history when starting the applicaiton with the original KeplerGL instance

And This is the redux actions history when starting the applicaiton with the injectComponents isntance.

What i find wierd is the register & delete entry actions.
Contributor guide
No contributing guide indexed for this repository
Research direction
Reproduce the failure with the injectComponents setup and compare the Redux action histories for the original and injected KeplerGl instances. Start at injectComponents, LayerHoverInfoFactory, and keplerGlReducer initialization, then trace the register and delete actions around the undefined visState error. Done means the injected hover component initializes without destroying map state and the custom tooltip can render.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100