- Wrapped AppContent with ProductContextProvider and CategoryContextProvider to manage product and category states. - Added TitleUpdater component for dynamic title management. - Enhanced Content and ProductDetailPage components to utilize the new context for setting and clearing current product and category states. - Updated ProductDetailWithSocket to pass setCurrentProduct function from context.
32 lines
890 B
JavaScript
32 lines
890 B
JavaScript
import React, { createContext, useState, useContext } from 'react';
|
|
|
|
const CategoryContext = createContext({
|
|
currentCategory: null,
|
|
setCurrentCategory: () => {}
|
|
});
|
|
|
|
export const useCategory = () => useContext(CategoryContext);
|
|
|
|
export const withCategory = (Component) => {
|
|
return (props) => {
|
|
const categoryContext = useCategory();
|
|
return <Component {...props} categoryContext={categoryContext} />;
|
|
};
|
|
};
|
|
|
|
export const CategoryContextProvider = ({ children }) => {
|
|
const [currentCategory, setCurrentCategory] = useState(null);
|
|
|
|
const setCurrentCategoryWithLog = (category) => {
|
|
console.log('CategoryContext: Setting current category to:', category);
|
|
setCurrentCategory(category);
|
|
};
|
|
|
|
return (
|
|
<CategoryContext.Provider value={{ currentCategory, setCurrentCategory: setCurrentCategoryWithLog }}>
|
|
{children}
|
|
</CategoryContext.Provider>
|
|
);
|
|
};
|
|
|