diff --git a/apps/comments-ui/src/actions.js b/apps/comments-ui/src/actions.js index 5b79547417..8cb8e0bf44 100644 --- a/apps/comments-ui/src/actions.js +++ b/apps/comments-ui/src/actions.js @@ -102,28 +102,26 @@ async function hideComment({state, adminApi, data: comment}) { }; } -async function showComment({state, adminApi, data: comment}) { +async function showComment({state, api, adminApi, data: comment}) { await adminApi.showComment(comment.id); + // We need to refetch the comment, to make sure we have an up to date HTML content + // + all relations are loaded as the current member (not the admin) + const data = await api.comments.read(comment.id); + const updatedComment = data.comments[0]; + return { comments: state.comments.map((c) => { const replies = c.replies.map((r) => { if (r.id === comment.id) { - return { - ...r, - status: 'published' - }; + return updatedComment; } return r; }); if (c.id === comment.id) { - return { - ...c, - status: 'published', - replies - }; + return updatedComment; } return { diff --git a/apps/comments-ui/src/utils/api.js b/apps/comments-ui/src/utils/api.js index 17b3188be8..8763c3b286 100644 --- a/apps/comments-ui/src/utils/api.js +++ b/apps/comments-ui/src/utils/api.js @@ -199,6 +199,20 @@ function setupGhostApi({siteUrl = window.location.origin, apiUrl, apiKey}) { } }); }, + read(commentId) { + const url = endpointFor({type: 'members', resource: `comments/${commentId}`}); + return makeRequest({ + url, + method: 'GET', + credentials: 'same-origin' + }).then(function (res) { + if (res.ok) { + return res.json(); + } else { + throw new Error('Failed to read comment'); + } + }); + }, like({comment}) { const url = endpointFor({type: 'members', resource: `comments/${comment.id}/like`}); return makeRequest({