Redux and Route Issue on “Type ‘{}’ is missing the following properties from type”

I got stuck on routing some code with redux.

// featureSlice.js

const featuresSlice = createSlice({
  name: "features",
  initialState: {
    explore: {
      page: 1,
      features: [],
    },
    favs: [],
  },
  reducers: {
    setExploreFeatures(state, action) {
      const { explore } = state;
      const { payload } = action;
      payload.features.forEach(payloadFeature => {
        const exists = explore.features.find(
          savedFeature => savedFeature.id === payloadFeature.id
        );
        if (!exists) {
          explore.features.push(payloadFeature);
        }
      });
      state.explore.page = payload.page;
    },
    increasePage(state, action) {
      state.explore.page += 1;
    },
    setFavs(state, action) {
      state.favs = action.payload;
    },
  },
});

export const { setExploreFeatures, increasePage, setFavs } =
  featuresSlice.actions;

export const getFeatures = () => async dispatch => {
  try {
    const {
      data: { results },
      // data
    } = await api.features();
    console.log(results);
    dispatch(
      setExploreFeatures({
        rooms: results,
        page: 1,
      })
    );
  } catch (e) {
    console.warn(e);
  }
};

export default featuresSlice.reducer;

// index.js

import { connect } from "react-redux";
import { getFeatures, increasePage } from "../../redux/featuresSlice";
import ExploreContainer from "./ExploreContainer";

function mapDispatchToProps(dispatch) {
  return {
    getFeaturesWith: page => dispatch(getFeatures(page)),
    increasePageWith: () => dispatch(increasePage()),
  };
}

function mapStateToProps(state) {
  return state.featuresReducer.explore;
}

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

and

\ ExploreContainer.js 

export const ExploreContainer = ({
  getFeaturesWith,
  features,
  increasePageWith,
}) => {
  useEffect(() => {
    getFeaturesWith();
  }, []);
  return (
    <div className="h-screen flex items-center justify-center bg-gray-800">
      <div className="bg-white w-full max-w-lg pt-10 pb-7 rounded-lg text-center">
        <h3 className="text-2xl text-gray-800">Log In</h3>
      </div>
    </div>
  );

and i am trying to route this code with router below

// router.tsx 

const ClientRoutes = [
  <Route key={6} path="/happy" element={<ExploreContainer />
];

export const LoggedInRouter = () => {
  return (
    <div>
      <BrowserRouter>
        <Header />
        <Routes>
          {ClientRoutes}
          {/* <Route>
                        <NotFound />
                    </Route> */}
        </Routes>
      </BrowserRouter>
    </div>
  );
};

But it comes out with an error saying ‘ Type ‘{}’ is missing the following properties from type ‘{ getFeaturesWith: any; features: any; increasePageWith: any; }’: getFeaturesWith, features, increasePageWith‘

Is there any way I can figure this out?
Plz help me thx…