Estoy tratando de actualizar los datos del host local. Tengo 2 interfaces "loggedInUsers" y "user", una con un valor predeterminado y la otra con un valor individual. En este caso es el color. ¿Qué estoy haciendo mal aquí? Me gustaría cambiar el color actual "blanco" a "azul".
useEffect(() => { const usersIdColor = loggedInUsers.map((e) => user?.find((u) => u.id === e.id && u.color !== e.color)); if (usersIdColor) { localStorage.setItem( 'logged_in_users', JSON.stringify([...loggedInUsers, { id: user.id, username: user.username, tenantId: user.tenantId, color: 'blue' }]) ); } }, []);Para evitar agregar nuevas entradas, debe filtrar la entrada de usuarios registrados y usar ese valor en reemplazo.
useEffect(() => { const WHITE = 'white'; const RED = 'red'; const loggedInUserFiltered = loggedInUsers.filter(({color, ...loggedInUser}) => color === WHITE ? {...loggedInUser, color: RED} : {...loggedInUser, color}); if (usersIdColor) { localStorage.setItem( 'logged_in_users', JSON.stringify(loggedInUsers) ); } }, []);También debe agregar su lógica para recuperar solo el usuario buscado usando buscar y así sucesivamente, como lo hizo, o incluso puede agregar condiciones al método de filtro, de esa manera podría hacerlo todo en una sola declaración.
Algo como:
const FIRST_USER = 1; const loggedInUserFiltered = loggedInUsers.filter(({color, id, ...loggedInUser}) => color === WHITE && id === FIRST_USER ? {...loggedInUser, color: RED, id} : {...loggedInUser, color, id});Por cierto: es almacenamiento local .
Con este código, siempre agregará un nuevo usuario a la matriz de usuarios registrados con el color azul. Si desea actualizar los usuarios registrados, debe actualizar el valor en la matriz. Algo como esto (No estoy seguro de cómo exactamente estás haciendo coincidir al usuario:
useEffect(() => { const userIndex = loggedInUsers.findIndex((e) => user?.find((u) => u.id === e.id && u.color !== e.color)); if (userIndex) { loggedInUsers[userIndex]={ id: user.id, username: user.username, tenantId: user.tenantId, color: 'blue' }; localStorage.setItem( 'logged_in_users', JSON.stringify(loggedInUsers) ); } }, []);