0xD34F

values: Array(height).fill(Array(width).fill(null))

values: Array.from({ length: height }, () => Array(width).fill(null))

const initialState = {
  player: 'X',
  cells: Array.from({ length: 3 }, () => Array(3).fill(null)),
};

const store = createStore((state = initialState, action) => {
  switch (action.type) {
    case 'MOVE':
      return {
        ...state,
        player: state.player === 'X' ? 'O' : 'X',
        cells: state.cells.map((row, iRow) => iRow === action.location[0]
          ? row.map((cell, iCol) => iCol === action.location[1] ? state.player : cell)
          : row
        ),
      };

    case 'RESET':
      return initialState;

    default:
      return state;
  }
});

const Board = connect(({ cells }) => ({ cells }))(({ cells }) => (
  <div class="board">
    {cells.map((row, iRow) =>
      <div className="row">
        {row.map((cell, iCol) =>
          <Cell location={[ iRow, iCol ]} value={cell} />
        )}
      </div>
    )}
  </div>
));

const Cell = connect(null, (dispatch, { location }) => ({
  onClick: () => dispatch({ type: 'MOVE', location }),
}))(({ value, onClick }) => (
  <div className="cell">
    <button onClick={onClick} disabled={value !== null}>
      {value}
    </button>
  </div>
));

const Reset = connect(null, dispatch => ({
  reset: () => dispatch({ type: 'RESET' }),
}))(({ reset }) => (
  <button onClick={reset}>RESET</button>
));

const App = () => (
  <Provider store={store}>
    <Reset />
    <Board />
  </Provider>
);

хочу, чтобы в переменной theme лежало значение state.theme, но по факту получается так: theme.theme

export const theme = (state = 'light', action) => {
  switch (action.type) {
    case constants.CHANGE_THEME:
      return action.payload;

    default:
      return state;
  }
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(App);

case 'TURN_DONE_POST':
  return {
    ...state,
    data: state.data.map(n => n.id === action.payload
      ? { ...n, done: !n.done }
      : n
    ),
  };

const filterByProps = Object.entries(this.state.filters).filter(n => n[1]).map(n => n[0]);
const filteredItems = this.state.items.filter(n => filterByProps.every(m => n[m]));

filterItems = ({ target: { name, checked } }) => {
  this.setState({
    [name]: checked,
  });
}

<Route path="/:id" component={SinglePhoto} />
<Route path="/history" component={SearchHistory} />

const onPlacemarkClick = e => {
  const placemarkData = e.get('target').properties.get('placemarkData');
  ...
};

<Placemark
  onClick={onPlacemarkClick}
  properties={{
    placemarkData: {
      city: point.City,
      address: point.Address,
      ...
    },
    ...
  }}
  ...
/>

Как в данном случае правильно сделать...

Структуру данных менять нельзя

get searchtest() {
  const search = this.state.search.toLowerCase().trim();
  return search
    ? searchtest.filter(n => Object.values(n).some(m => m.toLowerCase().includes(search)))
    : searchtest;
}

{this.searchtest.map((kef, i, a) => (
  <div style={style}>
    <div key={kef.name} data-id={kef.name}>
      name: {kef.name}
    </div>
    <div key={kef.id} data-id={kef.id}>
      id: {kef.id}
    </div>
  </div>
))}

{this.searchtest.map(n => (
  <div key={n.id}>
    <div>name: {n.name}</div>
    <div>id: {n.id}</div>
  </div>
))}

const Menu = ({ items }) =>
  items instanceof Array && items.length
    ? <ul>
        {items.map(n => (
          <li key={n.id}>
            <a>{n.title}</a>
            <Menu items={n.children} />
          </li>
        ))}
      </ul>
    : null;

const Gradient = ({ data, areaGenerator, height }) => {
  const ref = useRef(null);

  useEffect(() => {
    if (ref.current) {
      d3.select(ref.current)
        .append('linearGradient')
        .attr('id', 'area-gradient')
        .attr('gradientUnits', 'userSpaceOnUse')
        .attr('x1', 0)
        .attr('y1', 0)
        .attr('x2', 0)
        .attr('y2', height)
        .selectAll('stop')
        .data([
          { offset: '0%', color: 'rgba(101, 60, 173, 0)' },
          { offset: '100%', color: 'rgba(101, 60, 173, 0.2)' }
        ])
        .enter()
        .append('stop')
        .attr('offset', d => d.offset)
        .attr('stop-color', d => d.color);

      d3.select(ref.current).append('path').attr('class', 'area');
    }
  }, [ ref.current ]);

  useEffect(() => {
    if (ref.current) {
      d3.select(ref.current)
        .select('.area')
        .datum(data)
        .transition()
        .duration(1000)
        .attr('d', areaGenerator);
    }
  }, [ ref.current, data ]);

  return <g className="gradient-generator" ref={ref} />;
};