Aforina

[vague canopy]

Seguimos aquí, para no saturar el canal

Si estás usando estado, si necesitas llamar al setter para que el estado tome el nuevo valor

[umbral flower]

vale jajajja

vale pregunto

[vague canopy]

Lo que debes hacer es un filter y luego un map

[umbral flower]

en esta otra funcion se actualizaba solo, cual seria la diferencia?

un filter del segmento o de los filtros?

[vague canopy]

Cómo sabes que se actualizan solos?

[umbral flower]

porque se me actualiza segmentsInfo y se me actualizan en el layout todo lo que tiene que ver, se ve como se añaden las cateogrias que deben o se van

y guarda la info para cada una, cuando abro el filtro esta todo ok

[vague canopy]

Pero estás segura que se modifican por este filter?

[umbral flower]

no se jajaja se que se modifican por esa funcion

cuando no estaba no me actualizaba la info ni nada

por eso he seguido la misma linea de pensamiento, pero no se por que se filtra por segmentos, o sea mi logica seria: encuentro el segmento, encuentro los filtros y en los filtros hago un filter para que me filtre por los que no coinciden con la categoria

pero me pierdo en lo de filtrar por segmento ya

[vague canopy]

@umbral flower puedes compartir una captura de como sería la información que se guarda en segments

[umbral flower]

en segmentsInfo? sii

mira esta es una, solo tengo dos segmentos

aqui esta abierto el segundo pero son iguales con otra data

tiene descripcion, emoji, filters, id, title y users

y yo lo que quiero con mi funcion es pasarle una category (de un filtro) y el segmento, y que coja el segmento que es y borrarle esa categoria en filtros. O sea quedaria exactamente igual pero con un filtro menos, por ejemplo quitamos el filtro numero 4

[vague canopy]

Y el valor resultante tiene que ser un arreglo de 2 posiciones (ya que son 2 segmentos), dónde la única modificación es que el 4° filtro se eliminó ya que coincide con la categoría, verdad?

[umbral flower]

exacto!

yo aqui le quiero pasar la categoria y el segmento y que de ese segmento me elimine esa categoria, pero el resto del segmento queda intacto

[vague canopy]

Vale, yo lo haría así

• uso findIndex para buscar cuál es el segmento
• con el valor resultante del punto anterior, hago otro findIndex sobre la propiedad filters del índice del segmento del punto anterior
• con eso hago un filter, sobre todas las categorías distintas a la que le pasa en la función
• se modifica la propiedad filters con el resultado anterior

Al final de estos pasos debería hacer lo que comentas

[vague canopy]

Jaja creo que ni me entendí

Ahorita estoy desde el móvil, pero si deseas luego que esté en el pc, te mando el código como yo lo plantearía

[umbral flower]

ajjajajajaja no tranqui

medio entiendo pero voy poquito a poquito porque no conocia la funcion findIndex

voy haciendo console logs jajajajja

[vague canopy]

Vale, algo que me visto que haces es lo de llamar Object.entries para acceder a filters, no es necesario tu solo accede cómo si fuera una propiedad de un objeto segment.filters.map(

[umbral flower]

hmmm vale

a ver

console.log(segmentsInfo.findIndex(id)) esto me da error, me dice que -1 no es una funcion

puedo hacer un array function ahi como si fuera un map pero como accedo al valor que apunta?

console.log(segmentsInfo.findIndex(id => console.log(segmentsInfo.id)))

esto me da undefined, a saber a que estoy apuntando

[vague canopy]

findIndex espera una función
console.log(segmentsInfo.findIndex(segment => segment.id == id))

[umbral flower]

eso me devuelve 1

[vague canopy]

1 vendría siendo la posición de segmentsInfo dónde se encuentra el segmento que necesitas modificar (o sea el segundo)

Ahora harías algo igual de filters

[umbral flower]

lo que no se es como acceder a mi segmento

valle ya lo tengo

segmentsInfo.findIndex(segment => { if (segment.id == id) { console.log(segment) } })

vale asi que en ese if hago otro findIndex

[vague canopy]

segmentsInfo[index].filters = segmentsInfo[Index].filters.filter(filter => filter.category != category)

Index viene siendo el valor del findIndex del paso anterior

[umbral flower]

espera que estoy flipando con esa linea jaja

[vague canopy]

No, dentro no, tiene que ser afuera

[umbral flower]

let index = segmentsInfo.findIndex(segment => { segment.id == id }) console.log( (segmentsInfo[index].filters = segmentsInfo[index].filters.filter( filter => filter.category != category )) )

o sea te refieres a hacer eso?

[vague canopy]

Jaja te la explico, la parte de la derecha, accede a filters del índice donde se encuentra el segmento, se hace un filter sobre los filtros donde la categoría sea distinta a la que se le pasa (esto como resultado será un arreglo de todos los filtros distintos al argumento pasado) y este resultado se guarda (sobreescribe) en los filtros del segmento

[umbral flower]

console.log(segmentsInfo[index]) pero hago esto y me dice que es undefined

[vague canopy]

Si, pero quitalo dentro del consolé.log

[vague canopy]

Imprime también la variable index

[umbral flower]

me da -1, deberia darme 1 como antes

a ver

[umbral flower]

aqui daba 1

que ha cambiado?

[vague canopy]

Si da -1 es por qué no encontró el segmento

[umbral flower]

vale ya perdon

unas claves

vale ya esta

madre mia espera estoy leyendo la linea bien, que nivel de optimizacion

yo ponia un if por cada elemento

[umbral flower]

vale

asi que sobreescribe los filtros, correcto de hecho si imprimes segmensInfo esta actualizado

al no guardarlo en otra variable entonces lo sobreescribe?

lo que si es verdad es que la variable global se ha actualizado, pero ese estado no se me ha renderizado, supongo que habra que forzarlo con useeffect

[vague canopy]

Si y no, puedes guardarlo en otra variable y no habría problema, lo importante es segmentInfo[index].filters = para modificar la variable general segmentsInfo

[umbral flower]

claro porque estas accediendo directamente a los filtros de ese segmento

[vague canopy]

Porfa manda captura de dónde estás llamando a esta función

[umbral flower]

esta linea de codigo merece un premio novel

en un onclick de un editor, ahora te mando

es en el borrar

<p onClick={() => emptyMultiselect(filterClicked, lastSegmentClicked, segmentsInfo) } id='delete-action' className='text-[12px] text-color5 flex justify-end underline cursor-pointer hover:text-color3' > borrar </p>

y la funcion la importo de la carpeta utils

import { emptyMultiselect } from '../../utils/filters/emptyMultiselect'

[vague canopy]

Vale, porfa manda una captura de todo el componente donde se renderiza este botón de borrar

[umbral flower]

voy

es MultiSelectt.jsx

y luego el otro es su hijo por si da alguna info

[vague canopy]

@umbral flower que hace setFilterResponse, es el setter del estado?

[umbral flower]

me actualiza los filtros en la pantalla

donde aparecen todos juntitos

si borro el useEffect, no se me actualizan

realmente setFilterResponse no se usa nunca

pero de alguna forma cuando hago ese useEffect se me actualizan selectedOptions

[vague canopy]

Y que tiene response? Porfa pon un console de response

[umbral flower]

al principio nada []

un array vacio

y luego va teniendo las opciones del multiselect

realmente solo sirve para que selectedOptions se actualice bien que no se por que sin ese useEffect en la pantalla no se actualiza

ah perdona, response

habia entendido filterResponse, espera

realmente solo tiene la ultima a la que le has hecho click, debe estar mal

en plan si tienes 3 seleccionadas solo pone ['España'] o la que haya sido la ultima

solo la llamo a esa funcion y ni se para que sirve esa funcion, porque ni cambia nada ni se llama en otros lados wtf

[vague canopy]

Una pregunta, lo que retorna la función que hiciste de emptyMultiselect dónde lo necesitás?

[umbral flower]

realmente quiero que se me actualice la variable, que la vacie

para que automaticamente se borre el filtro

por eso supongo habra que hacer un useEffect donde lo imprimo

[vague canopy]

No entendí, lo que hace emptyMultiselect es eliminar en filtro de acuerdo a los parámetros que le pases, pero es lo mismo que está seleccionado en el Multiselect (España, Francia,etc)?

[umbral flower]

o sea lo que quiero hacer es que si le das a borrar

en segmentsInfo que esta toda la info

elimine el filtro directamente

que aparezca como que no tiene filtro

y asi si pinchas, esta como reiniciado y no te selecciona el filtro que tenias activo

y como segmentsInfo es un estado

[vague canopy]

Vale, porfa me dejas ver el context

[umbral flower]

que lo actualice

sii, que context?

[vague canopy]

SegmentContext

[umbral flower]

no tiene nada en index lo creas y lo pasas todo

const [segmentsInfo, setSegmentsInfo] = useState(segmentsData)

[vague canopy]

En qué parte usas setSegmentsInfo?

[umbral flower]

cuando añado o elimino un segmento entero

[vague canopy]

Pero lo estás pasando al contexto de segments?

[umbral flower]

si dos segmentos

de ejemplo

ahora cuando vuelva te.mando captura

pero básicamente tiene los datos de la consola, solo es para inicializar y tener de ejemplo

pero luego se cambian correctamente con editores como el multiselect

lo que pasa que al eliminar, se eliminan ahora pero no se actualiza

[vague canopy]

Saca setSegmentsInfo del contexto y pásale lo que retorna emptyMultiselect

[umbral flower]

voy 1 sec

[umbral flower]

estoy en ello, es que me esta dando algunos errores

emptymultiselect no retorna nada realmetne no?

@vague canopy

incluso si le hago retornar segmentsInfo, no actualiza

[vague canopy]

Si emptyMultiselect debe retornar segmentsInfo

[umbral flower]

`export const emptyMultiselect = (category, id, segmentsInfo) => {
let index = segmentsInfo.findIndex(segment => segment.id == id)
segmentsInfo[index].filters = segmentsInfo[index].filters.filter(
filter => filter.category != category
)

return segmentsInfo
}
`

vale esto esta listo

<p onClick={() => setSegmentsInfo( emptyMultiselect(filterClicked, lastSegmentClicked, segmentsInfo) ) }

pero esto no lo actualiza si hago un console.log

pero si hago el console log al final de la funcion si esta actualizado, que raro

vale es que se ha estropeado lo de añadir, voy a revisar

vale no, si esta ok

la info esta ok lo que no se actualiza es la vista

[vague canopy]

Que vista no actualiza?

[umbral flower]

vale ya esta

es que no habia actualizado el state de selected options

vale hace bugs raros pero la logica esa parece que va todo bien

@vague canopy mil gracias por la ayuda mil mil gracias !!!!

https://tenor.com/view/rav-rav-despawned-rav-cry-cry-confused-gif-22445793

[vague canopy]

De nada

Lo que faltaría añadir es, condicionar que index sea mayor que cero para que no de errores en el filtrado

[umbral flower]

true! listo !