Gráficos no react - resolvido

Front-end
#1

Tenho este código

<AppGridContainer>
            <Grid item xs={12} md={6}>
              <PierEncaminamentoLista data={[]} titulo={'IDADE'} />
            </Grid>
            {filterData.graficos.map((entidade: any) => {
              if ('IDADE' === entidade) {
                <Grid item xs={12} md={6}>
                  <PierEncaminamentoLista data={[]} titulo={'IDADE'} />
                </Grid>;
              }
              if ('ESPECIALIDADE' === entidade) {
                <Grid item xs={12} md={6}>
                  <LinhaEncaminamentoListaGrafico
                    data={[]}
                    titulo={'TIPO ESPECIALIDADE'}
                  />
                </Grid>;
              }
              if ('CID 10' === entidade) {
                <Grid item xs={12} md={6}>
                  <LinhaEncaminamentoListaGrafico data={[]} titulo={''} />
                </Grid>;
              }
              if ('IDADE' === entidade) {
                <Grid item xs={12} md={6}>
                  <RoscaEncaminamentoLista data={[]} titulo={'RAÇA'} />
                </Grid>;
              }
            })}
          </AppGridContainer>

A ideia aqui é usuário clica em qual tipo de gráfico e ele vai para esta lista.
filterData.graficos, e mostra o gráfico. Só que não acontece.

O que será que pode estar faltando ?

#2

seus gráficos não estão com data, tá tudo com array vazio.

1 curtida
#3

Obrigado.
Esqueci de informar
Os dados ainda estão fixos dentre de cada componente

#4

mostra o codigo de um desses componentes
e se possível um print do json q ta preenchendo o grafico

1 curtida
#5

Obrigado @rodriguesabner
Estava faltando o return.

Ficando assim:

<AppGridContainer>
            {filterData.graficos.map((entidade: any) => {
              if ('IDADE' === entidade) {
                return (
                  <Grid item xs={12} md={6} key={entidade}>
                    <PierEncaminamentoLista data={[]} titulo={entidade} />
                  </Grid>
                );
              }
              if ('TIPO ESPECIALIDADE' === entidade) {
                return (
                  <Grid item xs={12} md={6} key={entidade}>
                    <BarraEncaminamentoListaGrafico
                      data={[]}
                      titulo={entidade}
                    />
                  </Grid>
                );
              }
              if ('CID 10' === entidade) {
                return (
                  <Grid item xs={12} md={6} key={entidade}>
                    <LinhaEncaminamentoListaGrafico
                      data={[]}
                      titulo={entidade}
                    />
                  </Grid>
                );
              }
              if ('UNIDADE REGULADORA' === entidade) {
                return (
                  <Grid item xs={12} md={6} key={entidade}>
                    <RoscaEncaminamentoLista data={[]} titulo={entidade} />
                  </Grid>
                );
              }
            })}
          </AppGridContainer>

image
image1765×975 81.1 KB