Skip to content
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

Happy Thoughts App - Jenny A #103

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

Happy Thoughts App - Jenny A #103

wants to merge 6 commits into from

Conversation

jempa182
Copy link

Copy link
Contributor

@HIPPIEKICK HIPPIEKICK left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good job with your happy thoughts app Jenny, and kudos for following the design so closely 💃

Comment on lines +2 to +5
import './index.css';
import { ListThoughts } from "./components/ListThoughts";
import { SubmitThought } from './components/SubmitThought';
import { useState, useEffect } from 'react';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Imports are usually grouped in this order:

// React and core libraries

// Third-party libraries

// Custom hooks and utilities

// Components

// Assets (icons, images, and styles)

Comment on lines +17 to +23
useEffect(() => {
fetch('https://happy-thoughts-ux7hkzgmwa-uc.a.run.app/thoughts')
.then((res) => res.json())
.then((json) => {
setThoughts(json);
});
}, []);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some error handling would be nice 👀

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.


export const LikeButton = ({ thoughtId, initialHearts }) => {
// State to track if like action is in progress
const [isLiking, setIsLiking] = useState(false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What's the purpose of this? 👀

Comment on lines +42 to +53
.then(newThought => {
// Check if the API returned an error
if (newThought.error) {
setError(newThought.error);
return;
}
setMessage(''); // Clears the input
onSubmit(newThought); // Updates the list
})
.catch(() => {
setError('Something went wrong. Please try again.');
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice error handling ⭐

return (
<form onSubmit={handleSubmit} className="submit-form">
<h2>What's making you happy right now?</h2>
<textarea
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Don't forget labels! And be mindful when working with textareas, it's good to remove the resize option so that the user don't break the styling

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants