[#0306] Listar comentários de uma parceria

[gioliveirass]

Descrição da atividade

• Criar interface para listagem de comentários de atualizações em parcerias de acordo com protótipo;
• Consumir rota criada pelo back para listagem de comentários de parcerias.
• Deve listar todos os comentário do mais recente para o mais antigo.
• Todo os usuário podem ver essa lista.

DoR

• [x] Prototipado
• [x] Cabe em uma sprint (de preferência não maior que 8 story points)
• [x] Validado com o cliente

DoD

• [x] Testado e integrado
• [x] Sem bugs observados / review
• [x] Code review
• [x] Atende aos critérios de aceite
• [x] Documentado
• [x] Aceito pelo PO

[MariaGabrielaReis]

Documentação

Foi criado uma classe para agrupar as requisições que envolvem as anotações de parceria (AnnotationsController), onde existe uma função para listagem das anotações. Essa listagem foi feita consumindo a rota do backend através dessa função e gerando os cards referentes a cada comentário,

Tecnologias: React Native, Expo, Axios, Styled Components

https://user-images.githubusercontent.com/69374340/229375518-671c4510-9034-4f37-83c0-b7765003ab73.mp4

Requisição

 async getAnnotations(id: string) {
    try {
      const { data } = await api.get(ANNOTATION_ENDPOINTS.LIST + id);
      return data as IComment[];
    } catch (error) {
      console.error(error);
    }
  }

Carregamento dos dados (na tela da parceria específica)

 async function getData() {
    const comments = await AnnotationController.getAnnotations(
      "baadc558-2791-4f9a-8d1e-e01a0a92b432", // id fixo para entrega da tarefa
    );
    setAnnotations(comments);
    setIsLoading(false);
  }

  useEffect(() => {
    getData();
  }, []);

Listagem

 {isLoading ? (
        <LoadingContainer>
          <Loading />
        </LoadingContainer>
      ) : (
        data?.map(card => {
          return (
            <Card
              key={card.id}
              id={card.id}
              type={card.title ? "annotation" : "update"}
              date={formatDate(card.createdAt)}
              time={formatTime(card.createdAt)}
              description={card.comment}
              author={`${card.User.name} ${card.User.lastName}`}
              title={card.title}
            />
          );
        })
      )}