Merge pull request #3 from devRabbani/rabbaniBhai

added new fact api
devRabbani · Oct 28, 2022 · f80d858 · f80d858
2 parents c71dbfd + 7a24eee
commit f80d858
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 26 deletions.
diff --git a/src/App.js b/src/App.js
@@ -1,8 +1,7 @@
 import React, { lazy, Suspense, useState } from 'react'
 import './App.css'
-import { Switch, Route, withRouter } from 'react-router-dom'
+import { Route, withRouter } from 'react-router-dom'
 import Buttons from './components/Buttons/buttons.component'
-import SkeletonCard from './skeleton/skeletonCard'
 import SkeletonMain from './skeleton/skeletonMain'
 import SkeletonCardSmall from './skeleton/skeletoncardsmall'
 
@@ -19,28 +18,35 @@ const App = ({ location: { pathname } }) => {
 
   const fetchJokeV1 = async () => {
     setBtnLoading(true)
-    const res = await fetch(`https://v2.jokeapi.dev/joke/${catg}?type=single`)
-    const data = await res.json()
-    setJokes1(data)
-    setBtnLoading(false)
+    try {
+      const res = await fetch(`https://v2.jokeapi.dev/joke/${catg}?type=single`)
+      const data = await res.json()
+      setJokes1(data)
+      setBtnLoading(false)
+    } catch (error) {
+      console.log(error)
+      setBtnLoading(false)
+    }
   }
   const fetchJokeV2 = async () => {
     setBtnLoading(true)
-    const res = await fetch('https://icanhazdadjoke.com/', {
-      method: 'GET',
-      headers: {
-        Accept: 'application/json',
-      },
-    })
-    const data = await res.json()
-    setJokes2(data)
-    setBtnLoading(false)
+    try {
+      const res = await fetch(
+        'https://api.chucknorris.io/jokes/random?name=Rabbani%20Bhai'
+      )
+      const data = await res.json()
+      setJokes2(data)
+      setBtnLoading(false)
+    } catch (error) {
+      console.log(error)
+      setBtnLoading(false)
+    }
   }
 
   return (
-    <div className='App'>
+    <div className="App">
       {pathname === '/achhawala' ? (
-        <h1 className='nowfunny'>
+        <h1 className="nowfunny">
           nowFUNNY!
           {btnLoading ? <span>&#128534;</span> : <span>&#128520;</span>}
         </h1>
@@ -52,7 +58,7 @@ const App = ({ location: { pathname } }) => {
 
       {/* <Switch> */}
       <Suspense fallback={<SkeletonMain />}>
-        <Route exact path='/'>
+        <Route exact path="/">
           <MainJokes
             fetchJoke={fetchJokeV1}
             jokes={jokes1}
@@ -63,7 +69,7 @@ const App = ({ location: { pathname } }) => {
         </Route>
       </Suspense>
       <Suspense fallback={<SkeletonCardSmall />}>
-        <Route exact path='/achhawala'>
+        <Route exact path="/achhawala">
           <SecondJokes
             fetchJoke={fetchJokeV2}
             jokes={jokes2}

diff --git a/src/components/JokeBox/jokeBox.component.jsx b/src/components/JokeBox/jokeBox.component.jsx
@@ -15,12 +15,12 @@ const JokeBox = ({ data, setCatg, marginBool }) => {
 
   return (
     <>
-      {marginBool && <div className='marginTop'></div>}
-      <div className={`jokeBox ${!data.category ? 'shrink' : ''}`}>
-        <p className='joke'>{data.joke}</p>
-        <div className='bottomDiv'>
-          {data.category && (
-            <p className='category'>
+      {marginBool && <div className="marginTop"></div>}
+      <div className={`jokeBox ${!data?.category ? 'shrink' : ''}`}>
+        <p className="joke">{data.joke}</p>
+        <div className="bottomDiv">
+          {data?.category && (
+            <p className="category">
               Category :{' '}
               <span onClick={() => setCatg(data.category)}>
                 {data.category}

diff --git a/src/pages/secondJokes/secondJokes.component.jsx b/src/pages/secondJokes/secondJokes.component.jsx
@@ -10,7 +10,7 @@ const SecondJokes = ({ fetchJoke, jokes, btnLoading }) => {
   return (
     <>
       {!btnLoading ? (
-        <JokeBox data={jokes} marginBool />
+        <JokeBox data={{ joke: jokes?.value }} marginBool />
       ) : (
         <SkeletonCardSmall />
       )}