Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
function App() {
const getUsers = React.useCallback(async (): Promise => {
const response = await axios.get('https://jsonplaceholder.typicode.com/users');
return response.data;
}, []);
const getUsersRecord = useLoads('users', getUsers);
const users = (getUsersRecord.response || []);
return (
Users
{getUsersRecord.isPending && }
{getUsersRecord.isResolved && (
{users.map(user => (
{user.name}
))}
)}
{getUsersRecord.isRejected && Error! {getUsersRecord.error.message}}
export default function MovieList(props) {
const { onSelectMovie } = props;
const getMoviesRecord = Loads.useLoads('movies', api.getMovies);
const movies = getMoviesRecord.response || [];
return (
Jake's Top Movies
{getMoviesRecord.isPending && }
{getMoviesRecord.isResolved && (
{movies.map(movie => (
onSelectMovie(movie)} />
))}
)}
);
}
export default function MovieList(props) {
const { loadingMovieId, onSelectMovie } = props;
const moviesRecord = Loads.useLoads('movies', api.getMovies);
const movies = moviesRecord.response || [];
return (
Jake's Top Movies
{movies.map(movie => (
onSelectMovie(movie)}
/>
))}
function App() {
const getUsers = React.useCallback(async () => {
const response = await axios.get('https://jsonplaceholder.typicode.com/users');
return response.data;
}, []);
const usersRecord = useLoads('users', getUsers);
const users = usersRecord.response || [];
return (
Users
{usersRecord.isPending && }
{usersRecord.isResolved && (
{users.map(user => (
{user.name}
))}
)}
{usersRecord.isRejected && Error! {usersRecord.error.message}}
export default function MovieDetails(props) {
const { movieId, onClickBack } = props;
const getMovieRecord = Loads.useLoads('movie', api.getMovie, { variables: [movieId] });
const movie = getMovieRecord.response || {};
const getReviewsRecord = Loads.useLoads('movieReviews', api.getReviewsByMovieId, { variables: [movieId] });
const reviews = getReviewsRecord.response || [];
return (
<button>Back</button>
<button>
Reload
</button>
{getMovieRecord.isPending && }
{getMovieRecord.isResolved && (
export default function MovieDetails(props) {
const { movieId, onClickBack } = props;
const getMovieRecord = Loads.useLoads('movie', api.getMovie, { variables: [movieId] });
const movie = getMovieRecord.response || {};
const getReviewsRecord = Loads.useLoads('movieReviews', api.getReviewsByMovieId, { variables: [movieId] });
const reviews = getReviewsRecord.response || [];
return (
<button>Back</button>
<button>
Reload
</button>
{getMovieRecord.isPending && }
{getMovieRecord.isResolved && (
{movie.title}