fix(front): fix discussion comment changed subscription done before having slug value
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
a9b977540b
commit
067029705d
|
@ -179,6 +179,7 @@ import { MemberRole } from "@/types/enums";
|
|||
import { PERSON_MEMBERSHIPS } from "@/graphql/actor";
|
||||
import { Dialog } from "@/plugins/dialog";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { watch } from "vue";
|
||||
|
||||
const props = defineProps<{ slug: string }>();
|
||||
|
||||
|
@ -187,6 +188,8 @@ const COMMENTS_PER_PAGE = 10;
|
|||
|
||||
const { currentActor } = useCurrentActorClient();
|
||||
|
||||
const slug = computed(() => props.slug);
|
||||
|
||||
const {
|
||||
result: discussionResult,
|
||||
onError: onDiscussionError,
|
||||
|
@ -196,52 +199,55 @@ const {
|
|||
} = useQuery<{ discussion: IDiscussion }>(
|
||||
GET_DISCUSSION,
|
||||
() => ({
|
||||
slug: props.slug,
|
||||
slug: slug.value,
|
||||
page: page.value,
|
||||
limit: COMMENTS_PER_PAGE,
|
||||
}),
|
||||
() => ({
|
||||
enabled: props.slug !== undefined,
|
||||
enabled: slug.value !== undefined,
|
||||
})
|
||||
);
|
||||
|
||||
subscribeToMore({
|
||||
document: DISCUSSION_COMMENT_CHANGED,
|
||||
variables: () => ({
|
||||
slug: props.slug,
|
||||
page: page.value,
|
||||
limit: COMMENTS_PER_PAGE,
|
||||
}),
|
||||
updateQuery(
|
||||
previousResult: any,
|
||||
{ subscriptionData }: { subscriptionData: any }
|
||||
) {
|
||||
const previousDiscussion = previousResult.discussion;
|
||||
const lastComment =
|
||||
subscriptionData.data.discussionCommentChanged.lastComment;
|
||||
hasMoreComments.value = !previousDiscussion.comments.elements.some(
|
||||
(comment: IComment) => comment.id === lastComment.id
|
||||
);
|
||||
if (hasMoreComments.value) {
|
||||
return {
|
||||
discussion: {
|
||||
...previousDiscussion,
|
||||
lastComment: lastComment,
|
||||
comments: {
|
||||
elements: [
|
||||
...previousDiscussion.comments.elements.filter(
|
||||
({ id }: { id: string }) => id !== lastComment.id
|
||||
),
|
||||
lastComment,
|
||||
],
|
||||
total: previousDiscussion.comments.total + 1,
|
||||
watch(slug, (newSlug: string | undefined | null) => {
|
||||
if (!newSlug) return;
|
||||
subscribeToMore({
|
||||
document: DISCUSSION_COMMENT_CHANGED,
|
||||
variables: () => ({
|
||||
slug: slug.value,
|
||||
page: page.value,
|
||||
limit: COMMENTS_PER_PAGE,
|
||||
}),
|
||||
updateQuery(
|
||||
previousResult: any,
|
||||
{ subscriptionData }: { subscriptionData: any }
|
||||
) {
|
||||
const previousDiscussion = previousResult.discussion;
|
||||
const lastComment =
|
||||
subscriptionData.data.discussionCommentChanged.lastComment;
|
||||
hasMoreComments.value = !previousDiscussion.comments.elements.some(
|
||||
(comment: IComment) => comment.id === lastComment.id
|
||||
);
|
||||
if (hasMoreComments.value) {
|
||||
return {
|
||||
discussion: {
|
||||
...previousDiscussion,
|
||||
lastComment: lastComment,
|
||||
comments: {
|
||||
elements: [
|
||||
...previousDiscussion.comments.elements.filter(
|
||||
({ id }: { id: string }) => id !== lastComment.id
|
||||
),
|
||||
lastComment,
|
||||
],
|
||||
total: previousDiscussion.comments.total + 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
return previousDiscussion;
|
||||
},
|
||||
return previousDiscussion;
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
const discussion = computed(() => discussionResult.value?.discussion);
|
||||
|
@ -271,7 +277,7 @@ const { mutate: replyToDiscussionMutation } = useMutation<{
|
|||
}>({
|
||||
query: GET_DISCUSSION,
|
||||
variables: {
|
||||
slug: props.slug,
|
||||
slug: slug.value,
|
||||
page: page.value,
|
||||
},
|
||||
});
|
||||
|
@ -280,7 +286,7 @@ const { mutate: replyToDiscussionMutation } = useMutation<{
|
|||
|
||||
store.writeQuery({
|
||||
query: GET_DISCUSSION,
|
||||
variables: { slug: props.slug, page: page.value },
|
||||
variables: { slug: slug.value, page: page.value },
|
||||
data: {
|
||||
discussion: {
|
||||
...discussionCached,
|
||||
|
@ -323,7 +329,7 @@ const { mutate: updateComment } = useMutation<
|
|||
}>({
|
||||
query: GET_DISCUSSION,
|
||||
variables: {
|
||||
slug: props.slug,
|
||||
slug: slug.value,
|
||||
page: page.value,
|
||||
},
|
||||
});
|
||||
|
@ -338,7 +344,7 @@ const { mutate: updateComment } = useMutation<
|
|||
}
|
||||
store.writeQuery({
|
||||
query: GET_DISCUSSION,
|
||||
variables: { slug: props.slug, page: page.value },
|
||||
variables: { slug: slug.value, page: page.value },
|
||||
data: { discussion: discussionCached },
|
||||
});
|
||||
},
|
||||
|
@ -378,7 +384,7 @@ const loadMoreComments = async (): Promise<void> => {
|
|||
await fetchMore({
|
||||
// New variables
|
||||
variables: {
|
||||
slug: props.slug,
|
||||
slug: slug.value,
|
||||
page: page.value,
|
||||
limit: COMMENTS_PER_PAGE,
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue