export default function App()

in examples/experimental/h3-grid/src/app.js [34:94]
55 lines of code
1 McCabe index (conditional complexity)

export default function App() {
  const [initialViewState, setInitialViewState] = useState(INITIAL_VIEW_STATE);
  const [resolution, setResolution] = useState(1);
  const [currentViewState] = useState({...INITIAL_VIEW_STATE});

  const onViewStateChange = ({viewState}) => {
    // Just save a copy of the viewState, no need to trigger rerender
    Object.assign(currentViewState, viewState);
  };

  const onResolutionChange = evt => {
    const newResolution = Number(evt.target.value);
    const minZoom = getMinZoom(newResolution, MAX_HEX_COUNT);

    setResolution(newResolution);
    setInitialViewState({
      ...currentViewState,
      zoom: Math.max(currentViewState.zoom, minZoom),
      minZoom
    });
  };

  const layer = new H3GridLayer({
    resolution,
    maxHexCount: MAX_HEX_COUNT,
    filled: true,
    extruded: false,
    stroked: true,
    lineWidthUnits: 'pixels',
    getLineWidth: 2,
    getFillColor: [0, 0, 0, 1],
    pickable: true,
    autoHighlight: true
  });

  return (
    <>
      <DeckGL
        initialViewState={initialViewState}
        controller={true}
        views={MAP_VIEW}
        layers={[layer]}
        onViewStateChange={onViewStateChange}
        getTooltip={info => info.object}
      >
        <StaticMap mapStyle="mapbox://styles/mapbox/light-v9" mapboxApiAccessToken={MAPBOX_TOKEN} />
      </DeckGL>
      <div style={CONTROL_PANEL_STYLE}>
        <div>Resolution: {resolution}</div>
        <input
          type="range"
          min="0"
          max="15"
          step="1"
          value={resolution}
          onInput={onResolutionChange}
        />
      </div>
    </>
  );
}