react-table with localstorage column toggle

{
    Header: "Interactions",
    Cell: ({ row }) => {
        if (store.getState().table.portfolio.includes(row.original)) {
            return (
                <div>
                    <button
                        className="column-interactions"
                        onClick={() => removeTicker(row.original)}
                    >
                        <AiFillHeart />
                    </button>
                </div>
            );
        } else
            return (
                <div>
                    <button
                        className="column-interactions"
                        onClick={() => chooseTicker(row.original)}
                    >
                        <AiOutlineHeart />
                    </button>
                </div>
            );
    },
},

At start the column return the else part, as portfolio inside reducer 'table' is empty, it even works fine when i click on the button to store it in redux. Basically it toggles and the data comes and goes from the redux state.

const chooseTicker = (data) => {
    if (store.getState().table.portfolio.length <= 5) {
        store.dispatch({
            type: ADD_PORTFOLIO,
            payload: data,
        });

        let existingPortfolio = JSON.parse(localStorage.getItem("portfolioToken"));
        if (existingPortfolio == null) existingPortfolio = [];
        existingPortfolio = [...existingPortfolio, data];
        localStorage.setItem("portfolioToken", JSON.stringify(existingPortfolio));
    }
};

const removeTicker = (data) => {
    store.dispatch({
        type: REMOVE_PORTFOLIO,
        payload: data,
    });

    let existingPortfolio = JSON.parse(localStorage.getItem("portfolioToken"));

    const index = existingPortfolio.findIndex(function (stock) {
        return stock.sec_ticker === data.sec_ticker;
    });
    existingPortfolio.splice(index, 1);
    localStorage.setItem("portfolioToken", JSON.stringify(existingPortfolio));
};

But as soon as i refresh the page, the toggle goes back to its default state, which is the else part. But my redux persists the data.

This is how im taking the data from localstorage to redux initial state

const portfolioToken = JSON.parse(localStorage.getItem("portfolioToken"));

let initialState = {};

if (portfolioToken) {
    initialState = {
        hasPortfolio: !empty(portfolioToken),
        portfolio: portfolioToken,
        portfolio_like: [],
        selected: "all",
        rows: [],
        weeks: [],
        weekSelected: "",
        scoreStyle: "scores",
        data: {},
        isLoading: true,
    };
} else {
    initialState = {
        hasPortfolio: false,
        portfolio: [],
        portfolio_like: [],
        selected: "all",
        rows: [],
        weeks: [],
        weekSelected: "",
        scoreStyle: "scores",
        data: {},
        isLoading: true,
    };
}