- 
        Couldn't load subscription status. 
- Fork 311
Project React Native App, Tiina #310
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: master
Are you sure you want to change the base?
Conversation
…llect data with expo sensors, added styling
| let [fontsLoaded] = useFonts({ | ||
| WorkSans_300Light, | ||
| WorkSans_400Regular, | ||
| }) | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Super nice to see that you're using custom font here
| setLoading(true) | ||
| fetch("https://www.boredapi.com/api/activity") | ||
| .then(res => res.json()) | ||
| .then(data => setTimeout(() => setFetchedData(data), 600)) | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Perhaps, you can add .catch error here, in case the API is not successfully fetched
|  | ||
| const changeImage = () => { | ||
| switch (fetchedData.type) { | ||
| case "social": | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice to see you apply switch-case here
| return <Image source={require("../assets/social.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "cooking": | ||
| return <Image source={require("../assets/cooking.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "busywork": | ||
| return <Image source={require("../assets/busywork.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "education": | ||
| return <Image source={require("../assets/education.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "diy": | ||
| return <Image source={require("../assets/diy.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "recreational": | ||
| return <Image source={require("../assets/recreational.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "charity": | ||
| return <Image source={require("../assets/charity.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| case "music": | ||
| return <Image source={require("../assets/music.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| break | ||
| default: | ||
| return <Image source={require("../assets/relaxing.png")} | ||
| style={{ resizeMode: "contain", height: 280, width: 280 }} /> | ||
| } | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Another way to avoid repeating the code. You can return only the image source here:
return  ".required(./assets/relaxing.png)"
, instead of rewriting them like this
<Image source={require("../assets/relaxing.png")} 
                         style={{ resizeMode: "contain", height: 280, width: 280 }} />
Next, In the function in the line 164, we can replace it with :
<Image source={changeImage()} 
                         style={{ resizeMode: "contain", height: 280, width: 280 }} />
                         
Hope you find it helpful
| import React from "react" | ||
|  | ||
| import LottieView from "lottie-react-native" | ||
|  | ||
| const Loader = () => { | ||
| return ( | ||
| <> | ||
| <LottieView | ||
| source={require("../assets/bouncy-balls-loader.json")} | ||
| autoPlay | ||
| loop | ||
| /> | ||
| </> | ||
| ) | ||
| } | 
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was not able to apply the animation, it's nice to see how you did it
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hi Tiina,
Great job! I love the illustration and the idea. In general, the code is clean and well-written. I learned a few things when going through your code. Super nice! I added some humble ideas, hopefully you find them helpful :)
No description provided.