codey.lol/src/components/RandomMsg.jsx

import { API_URL } from "../config";
import { default as $ } from "jquery";
import ReplayIcon from '@mui/icons-material/Replay';


var randomMsg;

const getRandomMsg = () => {
        $.ajax({
            url: API_URL+'/randmsg',
            method: "POST",
            contentType: "application/json; charset=utf-8"
        }).done(function (data) {
            if (! data.msg) {
                return;
            } else {
                randomMsg = data.msg.replace("<br>", "\n");
                $('.random-msg').html(`<small><i>${randomMsg}</i></small>`);
            }
        });
}

export default function RandomMsg() {
    getRandomMsg();
        return (
            <div className="random-msg-container">
                <div className="random-msg">
                </div>
                <button id="new-msg"
                aria-label="New footer message"
                type="button"
                className="flex items-center justify-center px-2 py-1 rounded-md hover:bg-neutral-200 dark:hover:bg-neutral-800 transition-opacity new-msg-button"
                onClick={() => getRandomMsg()}>
                    <ReplayIcon size="sm" />
                </button>                
            </div>
        ); 
}