Movie Catalogue with Zustand

For this project, we will expand the movie catalog using Zustand to manage simple global states: favorites, category filter, and title search.

Prerequisites

• Base app working with React Native CLI + React Navigation.
• movies.ts with local data.
• Zustand already installed and integrated.

📦 Expected Global State (shape)

The store should expose at least:

• favorites: number[]
• selectedCategory: string | null
• search: string
• Actions: toggleFavorite(id), clearFavorites(), setCategory(cat), setSearch(q)

Use selectors (and shallow when applicable) to avoid unnecessary re-renders.

📝 Instructions

1. Create the Favorites functionality

   • In FavoritesScreen: list only movies whose IDs are in favorites.
   • In MovieCard: show a badge/icon when id is a favorite (read from the store with a selector).

2. Category filter

   • In CategoryMoviesScreen: display Category: <cat> and filter movies by the category from the store.

3. Title search

   • Filter the Home list by partial match of title (case-insensitive).

💡 Tips

• Subscribe only to the slice you need: useMoviesStore((s) => s.favorites).
• For chained filters: apply selectedCategory first, then search.
• If you notice re-renders in lists, memoize items (React.memo) and use stable keys.