diff --git a/src/contributor/index.js b/src/contributor/index.js index 90c5c69..150f576 100644 --- a/src/contributor/index.js +++ b/src/contributor/index.js @@ -1,21 +1,22 @@ -import RandomFoxImage from "./random-fox-image"; -import RandomCatImage from "./random-cat-image"; -import RandomTechImages from "./random-tech-images"; -import RandomPokemonImage from "./random-pokemon-image"; -import RandomUnsplashImage from "./random-unsplash-image"; -import RandomPicsumImage from "./random-picsum-image"; -import RandomGrayscaleImage from "./random-grayscale-image"; -import RandomImageUnsplash from "./random-image-unsplash"; -import RandomLoremPixelImage from "./random-lorem-pixel-image"; -import RandomAnswerImage from "./random-answer-image"; -import RandomDogImage from "./random-dog-image"; -import RandomMemeImage from "./random-meme-image"; -import RandomUserProfile from "./random-user-profile"; -import RandomKanji from "./random-kanji"; -import RandomPixelMonstersImage from "./random-pixel-monsters-image"; -import RandomAiArtImage from "./random-ai-art"; -import RandomQuotesApi from "./random-quote"; -import RandomRobotImage from "./random-robot-image"; +import RandomFoxImage from './random-fox-image'; +import RandomCatImage from './random-cat-image'; +import RandomTechImages from './random-tech-images'; +import RandomPokemonImage from './random-pokemon-image'; +import RandomUnsplashImage from './random-unsplash-image'; +import RandomPicsumImage from './random-picsum-image'; +import RandomGrayscaleImage from './random-grayscale-image'; +import RandomImageUnsplash from './random-image-unsplash'; +import RandomLoremPixelImage from './random-lorem-pixel-image'; +import RandomAnswerImage from './random-answer-image'; +import RandomDogImage from './random-dog-image'; +import RandomMemeImage from './random-meme-image'; +import RandomUserProfile from './random-user-profile'; +import RandomKanji from './random-kanji'; +import RandomPixelMonstersImage from './random-pixel-monsters-image'; +import RandomAiArtImage from './random-ai-art'; +import RandomQuotesApi from './random-quote'; +import RandomRobotImage from './random-robot-image'; +import RandomMonkeyUserComic from './random-monkeyuser'; export const data_contributor = [ RandomFoxImage, @@ -35,5 +36,6 @@ export const data_contributor = [ RandomPixelMonstersImage, RandomAiArtImage, RandomQuotesApi, - RandomRobotImage + RandomRobotImage, + RandomMonkeyUserComic, ]; diff --git a/src/contributor/random-monkeyuser.js b/src/contributor/random-monkeyuser.js new file mode 100644 index 0000000..82dbc72 --- /dev/null +++ b/src/contributor/random-monkeyuser.js @@ -0,0 +1,42 @@ +import axios from 'axios'; +import { useEffect, useState } from 'react'; +import { Card } from '../components'; + +const RandomMonkeyUserComic = () => { + const url = 'https://monkeyuser-api-ridvanaltun.vercel.app/api/comics/random'; + const [image, setImage] = useState([]); + const [isLoading, setLoading] = useState(false); + + useEffect(() => { + setLoading(true); + const fetchData = async () => { + const { data } = await axios.get(url); + + setImage(data.image_url); + setLoading(false); + }; + + fetchData(); + }, []); + + return ( + + {isLoading ? ( +

Loading...

+ ) : ( + techImage + )} +
+ ); +}; + +export default RandomMonkeyUserComic;