feat(Context): integrate Product and Category context providers into App

- 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.

src/components/ProductDetailWithSocket.js

@@ -1,15 +1,22 @@
 import React from 'react';
 import { useParams, useNavigate, useLocation } from 'react-router-dom';
 import ProductDetailPage from './ProductDetailPage.js';
+import { useProduct } from '../context/ProductContext.js';
 
 const ProductDetailWithSocket = () => {
   const { seoName } = useParams();
   const navigate = useNavigate();
   const location = useLocation();
+  const { setCurrentProduct } = useProduct();
 
   return (
-    <ProductDetailPage seoName={seoName} navigate={navigate} location={location} />
+    <ProductDetailPage 
+      seoName={seoName} 
+      navigate={navigate} 
+      location={location} 
+      setCurrentProduct={setCurrentProduct}
+    />
   );
 };
 
-export default ProductDetailWithSocket; 
+export default ProductDetailWithSocket;