77 lines
2.1 KiB
TypeScript
77 lines
2.1 KiB
TypeScript
import { ApolloQueryResult, gql, OperationVariables } from "@apollo/client";
|
|
import {
|
|
CheckCircleIcon,
|
|
DocumentRemoveIcon
|
|
} from '@heroicons/react/outline';
|
|
import React, { FC } from "react";
|
|
import { Card } from "../../../../components";
|
|
import { Query, Question, ReviewMessage, ReviewMessageFeedbackType } from "../../../../__generated__/graphql-schema";
|
|
import { ReviewMessageForm, ReviewMessageFormFragments } from "./ReviewMessagesForm";
|
|
|
|
|
|
const feedbackIcon = {
|
|
[ReviewMessageFeedbackType.Answer]: null,
|
|
[ReviewMessageFeedbackType.Approve]: <CheckCircleIcon className="w-5 text-green-800" />,
|
|
[ReviewMessageFeedbackType.RequestChanges]: <DocumentRemoveIcon className="w-5 text-red-800" />,
|
|
};
|
|
|
|
const ReviewMessageTitle: FC<{
|
|
feedback: ReviewMessage
|
|
}> = ({ feedback }) => (
|
|
<p className="flex">
|
|
{feedback.user.name}{' '} - {' '}
|
|
<span className="text-gray-700 pr-2">
|
|
{new Date(feedback.createdAt).toLocaleString()}
|
|
</span>
|
|
{feedbackIcon[feedback.feedbackType]}
|
|
</p>
|
|
)
|
|
|
|
export const ReviewMessagesFragments = gql`
|
|
${ReviewMessageFormFragments}
|
|
fragment ReviewMessages_question on Question {
|
|
id
|
|
...ReviewMessageForm_question
|
|
user {
|
|
id
|
|
}
|
|
reviewMessages {
|
|
nodes {
|
|
id
|
|
feedbackType
|
|
text
|
|
user {
|
|
name
|
|
}
|
|
createdAt
|
|
}
|
|
}
|
|
}
|
|
`
|
|
|
|
export const ReviewMessages: FC<{
|
|
question: Question
|
|
refetch: (variables?: Partial<OperationVariables> | undefined) => Promise<ApolloQueryResult<Query>>
|
|
}> = ({ question, refetch }) => {
|
|
const reviewMessages = question.reviewMessages.nodes
|
|
const hasFeebacks = !!reviewMessages.length
|
|
|
|
return (
|
|
<div>
|
|
<Card className="mb-3" title="Histórico de Pareceres">
|
|
{hasFeebacks
|
|
? reviewMessages.map((item) => (
|
|
<div key={item.id}>
|
|
<ReviewMessageTitle feedback={item} />
|
|
<p className="p-2">
|
|
{item.text}
|
|
</p>
|
|
</div>
|
|
))
|
|
: 'Essa questão não tem nenhum parecer ainda.'}
|
|
</Card>
|
|
<ReviewMessageForm question={question} refetch={refetch} />
|
|
</div>
|
|
)
|
|
};
|