How to change icon while also doing a changeTheme with onClick in react js?

I have succeded in creating a icon click to change the colorscheme of my website (line 21 and changeTheme), but when I click the icon I would also like it to change from FaRegMoon to FaRegSun and vice versa (i.e when I click it once it should change to FaRegSun and when I click it another time it should change to FaRegMoon

current code:

import React, {useState} from 'react'
import { FaRegMoon, FaRegSun } from "react-icons/fa"
import "./index.sass"

const changeTheme = () => {
    const item = localStorage.getItem("theme")
    let theme;
    if (item === "light") {
        theme = "";
        localStorage.setItem('theme', "")
    } else {
        theme = "light"
        localStorage.setItem('theme', 'light')
    }
    localStorage.setItem('theme', theme)
    document.body.className = localStorage.getItem("theme");
}

const ThemeToggle = () => {
    return (
        <div className='theme-toggle-button'>
            <FaRegMoon size={20} onClick={() => changeTheme() }/>
        </div>
    )
}

export default ThemeToggle;