nice grabbing quote nice simple

This commit is contained in:
talksik
2022-05-09 06:50:36 -05:00
parent 113e5b514f
commit 6e5cdb0388
+16 -11
View File
@@ -96,21 +96,24 @@ export default function NirvanaRouter() {
); );
} }
type Quote = { q: string; a: string; h?: string }; type Quote = {
content: string;
author: string;
length: number;
dateAdded: Date;
_id: string;
tags: string[];
};
function FlowState() { function FlowState() {
const [quote, setQuote] = useState<Quote>(null); const [quote, setQuote] = useState<Quote>(null);
useEffect(() => { useEffect(() => {
fetch("https://zenquotes.io/api/random") fetch("https://api.quotable.io/random")
.then((res) => { .then((res) => res.json())
console.log(res); .then((data: Quote) => {
return res.json();
})
.then((data: any) => {
console.warn(data); console.warn(data);
// setQuote(res[0]); setQuote(data);
}) })
.catch((error) => { .catch((error) => {
// do nothing, don't bother user, just don't show the quote // do nothing, don't bother user, just don't show the quote
@@ -122,8 +125,10 @@ function FlowState() {
<div className="flex flex-row flex-1 justify-center items-center"> <div className="flex flex-row flex-1 justify-center items-center">
{quote && ( {quote && (
<span className="flex flex-col justify-center items-center"> <span className="flex flex-col justify-center items-center">
<span className="text-xl text-gray-800 font-semibold">{quote.q}</span> <span className="text-xl text-gray-800 font-semibold">
<span className="tex-md italic text-gray-400">{quote.a}</span> "{quote.content}"
</span>
<span className="tex-md italic text-gray-400">{quote.author}</span>
</span> </span>
)} )}
</div> </div>