yude.jp/pages/components/DiscordStatus.js

37 lines
1.1 KiB
JavaScript

import React, { useState, useEffect } from 'react';
import axios from 'axios';
const App = () => {
const [data, setData] = useState({ hits: [] });
useEffect(() => {
const fetchData = async () => {
const result = await axios(
'https://discord.com/api/guilds/723409709306216498/widget.json',
);
setData(result.data);
};
fetchData();
}, []);
const status = data.members && data.members[0].status;
return (
<>
<div className="z-50 w-6 transform translate-y-3/4 -translate-x-full">
{
(() => {
if (status == "online"){
return <div className="text-green-700 rounded-full bg-green-500 flex w-6 h-6"></div>
} else if (status == "idle"){
return <div className="text-yellow-700 rounded-full bg-green-500 flex w-6 h-6"></div>
} else if (status == "dnd"){
return <div className="text-yellow-700 rounded-full bg-red-500 flex w-6 h-6"></div>
} else {
return <div className="text-gray-700 rounded-full bg-red-500 flex w-6 h-6"></div>
}
})()
}
</div>
</>
)
}
export default App;