seb/reactShop
1
0
Fork 0
Code Issues Pull Requests Activity

refactor: remove socket context dependencies and streamline socket handling in components for improved performance and readability

Browse Source
This commit is contained in:
sebseb7
2025-07-23 07:57:13 +02:00
parent bde001c39b
commit 9982527f35
8 changed files with 99 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/SharedCarousel.js
View File

@@ -1,11 +1,10 @@
import React, { useContext, useEffect, useState } from "react";
import React, { useEffect, useState } from "react";
import Box from "@mui/material/Box";
import Typography from "@mui/material/Typography";
import IconButton from "@mui/material/IconButton";
import ChevronLeft from "@mui/icons-material/ChevronLeft";
import ChevronRight from "@mui/icons-material/ChevronRight";
import CategoryBox from "./CategoryBox.js";
import SocketContext from "../contexts/SocketContext.js";
import { useCarousel } from "../contexts/CarouselContext.js";
import { useTranslation } from 'react-i18next';
@@ -62,7 +61,6 @@ const initializeCategories = (language = 'en') => {
const SharedCarousel = () => {
const { carouselRef, filteredCategories, setFilteredCategories, moveCarousel } = useCarousel();
const context = useContext(SocketContext);
const { t, i18n } = useTranslation();
const [rootCategories, setRootCategories] = useState([]);
const [currentLanguage, setCurrentLanguage] = useState(i18n.language || 'de');
@@ -94,13 +92,11 @@ const SharedCarousel = () => {
}, [i18n]);
useEffect(() => {
// Only fetch from socket if we don't already have categories
if (
rootCategories.length === 0 &&
context && context.socket && context.socket.connected &&
typeof window !== "undefined"
) {
context.socket.emit("categoryList", { categoryId: 209, language: currentLanguage, requestTranslation: true }, (response) => {
window.socketManager.emit("categoryList", { categoryId: 209, language: currentLanguage, requestTranslation: true }, (response) => {
if (response && response.success) {
// Use translated data if available, otherwise fall back to original
const categoryTreeToUse = response.translation || response.categoryTree;
@@ -136,7 +132,7 @@ const SharedCarousel = () => {
}
});
}
}, [context, context?.socket?.connected, rootCategories.length, currentLanguage]);
}, [rootCategories.length, currentLanguage]);
useEffect(() => {
const filtered = rootCategories.filter(