Improve the message when loading comments below event

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
honeypot-register-form
Thomas Citharel 2 years ago
parent 10826650e7
commit d9cc9f5842
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
  1. 11
      js/src/components/Comment/CommentTree.vue
  2. 2
      js/tests/unit/specs/components/Comment/CommentTree.spec.ts
  3. 10
      js/tests/unit/specs/components/Comment/__snapshots__/CommentTree.spec.ts.snap

@ -39,10 +39,13 @@
<b-notification v-else :closable="false">{{
$t("The organiser has chosen to close comments.")
}}</b-notification>
<transition name="comment-empty-list" mode="out-in">
<p v-if="$apollo.queries.comments.loading" class="loading">
{{ $t("Loading…") }}
</p>
<p
v-if="$apollo.queries.comments.loading"
class="loading has-text-centered"
>
{{ $t("Loading comments…") }}
</p>
<transition name="comment-empty-list" mode="out-in" v-else>
<transition-group
name="comment-list"
v-if="comments.length"

@ -91,7 +91,7 @@ describe("CommentTree", () => {
expect(wrapper.findComponent({ name: "b-notification" }).text()).toBe(
"The organiser has chosen to close comments."
);
expect(wrapper.find(".loading").text()).toBe("Loading…");
expect(wrapper.find(".loading").text()).toBe("Loading comments…");
expect(wrapper.html()).toMatchSnapshot();
});

@ -3,12 +3,9 @@
exports[`CommentTree renders a comment tree 1`] = `
<div>
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
<transition-stub name="comment-empty-list" mode="out-in">
<p class="loading">
Loading…
</p>
<!---->
</transition-stub>
<p class="loading has-text-centered">
Loading comments…
</p>
</div>
`;
@ -16,7 +13,6 @@ exports[`CommentTree renders a comment tree 2`] = `
<div>
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
<transition-stub name="comment-empty-list" mode="out-in">
<!---->
<transition-group-stub tag="ul" name="comment-list" class="comment-list">
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>

Loading…
Cancel
Save