52 lines
1.3 KiB
JavaScript
52 lines
1.3 KiB
JavaScript
import { useState, useEffect } from "react";
|
|
import { API_URL } from "../config";
|
|
import ReplayIcon from "@mui/icons-material/Replay";
|
|
|
|
export default function RandomMsg() {
|
|
const [randomMsg, setRandomMsg] = useState("");
|
|
|
|
const getRandomMsg = async () => {
|
|
try {
|
|
const response = await fetch(`${API_URL}/randmsg`, {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json; charset=utf-8",
|
|
},
|
|
});
|
|
|
|
const data = await response.json();
|
|
if (data?.msg) {
|
|
const formattedMsg = data.msg.replace(/<br\s*\/?>/gi, "\n");
|
|
setRandomMsg(formattedMsg);
|
|
}
|
|
} catch (err) {
|
|
console.error("Failed to fetch random message:", err);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
getRandomMsg();
|
|
}, []);
|
|
|
|
return (
|
|
<div className="random-msg-container">
|
|
<div className="random-msg">
|
|
{randomMsg && (
|
|
<small>
|
|
<i>{randomMsg}</i>
|
|
</small>
|
|
)}
|
|
</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 fontSize="small" />
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|