Skip to content

Commit d0cb34f

Browse files
cyp3riuscyp3rius
authored
fix: admin panel does not display comments #283 (#284)
* fix: admin panel does not display comments #283 * fix: changed tests * chore: version bump
1 parent 500ae48 commit d0cb34f

File tree

11 files changed

+112
-79
lines changed

11 files changed

+112
-79
lines changed

‎admin/src/components/CommentRow/index.tsx

Lines changed: 33 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Flex, IconButton, Link, Td, Tr } from '@strapi/design-system';
1+
import { Flex, IconButton, Link, Td, Tooltip, Tr, Typography } from '@strapi/design-system';
22
import { Eye } from '@strapi/icons';
33
import { isEmpty, isNil } from 'lodash';
44
import { FC, SyntheticEvent, useMemo } from 'react';
@@ -12,6 +12,7 @@ import { ApproveFlow } from '../ApproveFlow';
1212
import { CommentStatusBadge } from '../CommentStatusBadge';
1313
import { IconButtonGroup } from '../IconButtonGroup';
1414
import { ReviewFlow } from '../ReviewFlow';
15+
import { UserAvatar } from '../UserAvatar';
1516

1617
type Props = {
1718
readonly item: Comment;
@@ -42,21 +43,41 @@ export const CommentRow: FC<Props> = ({ item }) => {
4243
const contentTypeLink = useMemo(() => {
4344
const related = item.related;
4445
if (typeof related === 'string') return null;
45-
46+
4647
const localeParam = related.locale ? `?plugins[i18n][locale]=${related.locale}` : '';
47-
48+
4849
return (
4950
<Link href={`/admin/content-manager/collection-types/${related.uid}/${related.documentId}${localeParam}`}>
5051
{related.title}
5152
</Link>
5253
);
5354
}, [item.related]);
5455

56+
const { name, email, avatar } = item.author || {};
57+
5558
return (
5659
<Tr>
57-
<Td>{item.id}</Td>
58-
<Td>{item.author.name}</Td>
59-
<Td>{item.content}</Td>
60+
<Td>
61+
<Typography>{item.id}</Typography>
62+
</Td>
63+
<Td>
64+
<Tooltip
65+
open={item.isAdminComment ? false : undefined}
66+
label={!item.isAdminComment ? email : undefined}
67+
align="start"
68+
side="left">
69+
<Flex gap={2} style={{ cursor: item.isAdminComment ? "default" : "help" }}>
70+
{item.author && (<UserAvatar
71+
name={name}
72+
avatar={avatar}
73+
isAdminComment={item.isAdminComment} />)}
74+
<Typography>{name || getMessage('components.author.unknown')}</Typography>
75+
</Flex>
76+
</Tooltip>
77+
</Td>
78+
<Td>
79+
<Typography ellipsis>{item.content}</Typography>
80+
</Td>
6081
<Td>
6182
{item.threadOf ? (
6283
<Link href={`discover/${item.threadOf.id}`} onClick={onClickDetails(item.threadOf.id)}>
@@ -74,10 +95,12 @@ export const CommentRow: FC<Props> = ({ item }) => {
7495
{contentTypeLink}
7596
</Td>
7697
<Td>
77-
{formatDate(item.updatedAt || item.createdAt, {
78-
dateStyle: 'long',
79-
timeStyle: 'short',
80-
})}
98+
<Typography>
99+
{formatDate(item.updatedAt || item.createdAt, {
100+
dateStyle: 'long',
101+
timeStyle: 'short',
102+
})}
103+
</Typography>
81104
</Td>
82105
<Td>
83106
<CommentStatusBadge

‎admin/src/components/DiscussionThreadItem/DiscussionThreadItemActions.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -197,6 +197,7 @@ export const DiscussionThreadItemActions: FC<DiscussionThreadItemProps> = ({ ite
197197
<IconButton
198198
onClick={onClick}
199199
loading={commentMutation.block.isPending}
200+
label={getMessage('page.details.actions.comment.block')}
200201
>
201202
<Lock />
202203
</IconButton>
@@ -211,6 +212,7 @@ export const DiscussionThreadItemActions: FC<DiscussionThreadItemProps> = ({ ite
211212
<IconButton
212213
onClick={handleUnblockClick}
213214
loading={commentMutation.block.isPending}
215+
label={getMessage('page.details.actions.comment.unblock')}
214216
>
215217
<UnlockIcon />
216218
</IconButton>
@@ -238,6 +240,7 @@ export const DiscussionThreadItemActions: FC<DiscussionThreadItemProps> = ({ ite
238240
<IconButton
239241
onClick={handleDeleteClick}
240242
loading={commentMutation.delete.isPending}
243+
label={getMessage('page.details.actions.comment.delete')}
241244
>
242245
<Trash />
243246
</IconButton>
@@ -251,6 +254,7 @@ export const DiscussionThreadItemActions: FC<DiscussionThreadItemProps> = ({ ite
251254
<IconButtonGroup isSingle withMargin>
252255
<IconButton
253256
onClick={handleDrillDownClick}
257+
label={getMessage('page.details.panel.discussion.nav.drilldown')}
254258
style={
255259
blocked && !blockedThread
256260
? { marginTop: '1px', marginRight: '.5rem' }

‎admin/src/components/DiscussionThreadItem/DiscussionThreadItemFooter.tsx

Lines changed: 14 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Flex, Typography } from '@strapi/design-system';
1+
import { Flex, Tooltip, Typography } from '@strapi/design-system';
22

33
import { FC, PropsWithChildren } from 'react';
44
import { useIntl } from 'react-intl';
@@ -20,15 +20,23 @@ export const DiscussionThreadItemFooter: FC<PropsWithChildren<DiscussionThreadIt
2020
dateStyle: 'medium',
2121
timeStyle: 'short',
2222
});
23-
const { name, avatar } = item.author || {};
23+
const { name, avatar, email } = item.author || {};
2424

2525
return (
2626
<Flex direction="row" paddingTop={2}>
2727
<DiscussionThreadItemFooterMeta>
28-
{item.author && <UserAvatar avatar={avatar} name={name} isAdminComment={item.isAdminComment} />}
29-
<Typography variant="pi" fontWeight="bold" textColor="neutral800">
30-
{name || getMessage('components.author.unknown')}
31-
</Typography>
28+
<Tooltip
29+
open={item.isAdminComment ? false : undefined}
30+
label={!item.isAdminComment ? email : undefined}
31+
align="start"
32+
side="left">
33+
<Flex style={{ cursor: item.isAdminComment ? "default" : "help" }}>
34+
{item.author && <UserAvatar avatar={avatar} name={name} isAdminComment={item.isAdminComment} />}
35+
<Typography variant="pi" fontWeight="bold" textColor="neutral800">
36+
{name || getMessage('components.author.unknown')}
37+
</Typography>
38+
</Flex>
39+
</Tooltip>
3240
<Typography variant="pi" textColor="neutral600">
3341
{dateTime}
3442
</Typography>

‎admin/src/components/IconButtonGroup/index.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,12 @@ import styled from 'styled-components';
33

44
export const IconButtonGroup = styled(IconButtonGroupBase)<{ isSingle?: boolean; withMargin?: boolean }>(({ isSingle, withMargin }) => {
55
const isSingleStyle = {
6-
span: {
7-
'&:first-child button': {
8-
borderRadius: '4px',
6+
button: {
7+
'&:first-child': {
8+
borderRadius: '4px !important',
9+
},
10+
'&:last-child': {
11+
borderRadius: '4px !important',
912
},
1013
},
1114
};

‎admin/src/components/ModeratorResponseModal/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ export const ModeratorResponseModal: FC<ModeratorResponseModalProps> = ({ id, co
7474
return (
7575
<Modal.Root open={isModalVisible} onOpenChange={onToggleModal}>
7676
<Modal.Trigger>
77-
<IconButton>
77+
<IconButton label={getMessage('page.details.actions.thread.modal.start.thread')}>
7878
<Icon />
7979
</IconButton>
8080
</Modal.Trigger>

‎admin/src/components/UserAvatar/AdminAvatar.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,11 @@ export const AdminAvatar: FC<PropsWithChildren> = ({ children }) => (
88
<Box position="relative">
99
{children}
1010
<Flex
11+
padding="2px"
1112
alignItems="middle"
1213
position="absolute"
13-
right="-35%"
14-
top="-35%"
14+
right="-30%"
15+
top="-30%"
1516
borderRadius="50%"
1617
border="2px #ffffff solid"
1718
background="#ffffff"

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "strapi-plugin-comments",
3-
"version": "3.0.1",
3+
"version": "3.0.2",
44
"description": "Strapi - Comments plugin",
55
"strapi": {
66
"name": "comments",

‎server/src/services/__tests__/common.service.test.ts

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ describe('common.service', () => {
3939
getLocalConfig: jest.fn(),
4040
};
4141

42+
const mockFindOne = jest.fn();
4243
const mockFindMany = jest.fn();
4344

4445
beforeEach(() => {
@@ -50,6 +51,7 @@ describe('common.service', () => {
5051
const getStrapi = () => caster<StrapiContext>({
5152
strapi: {
5253
documents: () => ({
54+
findOne: mockFindOne,
5355
findMany: mockFindMany,
5456
}),
5557
}
@@ -561,19 +563,16 @@ describe('common.service', () => {
561563
const service = getService(strapi);
562564
const mockComments = [
563565
{ id: 1, related: 'api::test.test:1', locale: 'en' },
564-
{ id: 2, related: 'api::test.test:2', locale: 'en' },
565-
];
566-
const mockRelatedEntities = [
567-
{ uid: 'api::test.test', documentId: '1', locale: 'en', title: 'Test Title 1' },
568-
{ uid: 'api::test.test', documentId: '2', locale: 'en', title: 'Test Title 2' },
566+
{ id: 1, related: 'api::test.test:1', locale: 'en' }
569567
];
568+
const mockRelatedEntities = { uid: 'api::test.test', documentId: '1', locale: 'en', title: 'Test Title 1' };
570569

571-
mockFindMany.mockResolvedValue(mockRelatedEntities);
570+
mockFindOne.mockResolvedValue(mockRelatedEntities);
572571

573572
const result = await service.findRelatedEntitiesFor(mockComments);
574573

575-
expect(result).toHaveLength(2);
576-
expect(result).toEqual(expect.arrayContaining(mockRelatedEntities));
574+
expect(result).toHaveLength(mockComments.length);
575+
expect(result).toEqual(expect.arrayContaining([mockRelatedEntities]));
577576
});
578577

579578
it('should return an empty array if no related entities are found', async () => {
@@ -583,7 +582,7 @@ describe('common.service', () => {
583582
{ id: 1, related: 'api::test.test:1', locale: 'en' },
584583
];
585584

586-
mockFindMany.mockResolvedValue([]);
585+
mockFindOne.mockResolvedValue(undefined);
587586

588587
const result = await service.findRelatedEntitiesFor(mockComments);
589588

‎server/src/services/admin/admin.service.ts

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export default ({ strapi }: StrapiContext) => {
3939
return {
4040
pagination,
4141
result: results.map((_) => this.getCommonService().sanitizeCommentEntity(_, [], []))
42-
.map(_ => this.getCommonService().mergeRelatedEntityTo(_, relatedEntities)),
42+
.map(_ => this.getCommonService().mergeRelatedEntityTo(_, relatedEntities)),
4343
};
4444
},
4545

@@ -117,19 +117,19 @@ export default ({ strapi }: StrapiContext) => {
117117

118118
const { relatedId, uid } = this.getCommonService().parseRelationString(entity.related);
119119
const relatedEntity = await strapi.documents(uid)
120-
.findOne({ documentId: relatedId })
121-
.then((_) => {
122-
if (!_) {
123-
throw new PluginError(404, 'Relation not found');
124-
}
125-
return { ..._, uid };
126-
});
127-
const levelThreadId = entity.threadOf && typeof entity.threadOf === 'object' ? entity.threadOf.documentId : null;
120+
.findOne({ documentId: relatedId })
121+
.then((_) => {
122+
if (!_) {
123+
throw new PluginError(404, 'Relation not found');
124+
}
125+
return { ..._, uid };
126+
});
127+
const levelThreadId = entity.threadOf && typeof entity.threadOf === 'object' ? entity.threadOf.id : null;
128128

129129
const entitiesOnSameLevel =
130130
await this.getCommonService().findAllInHierarchy(
131131
{
132-
query: {
132+
filters: {
133133
...defaultWhere,
134134
...query,
135135
threadOf: levelThreadId,

‎server/src/services/common.service.ts

Lines changed: 30 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -106,11 +106,11 @@ const commonService = ({ strapi }: StrapiContext) => ({
106106
const entriesWithThreads = await Promise.all(
107107
entries.map(async (_) => {
108108
const { results, pagination: { total } } = await getCommentRepository(strapi)
109-
.findWithCount({
110-
where: {
111-
threadOf: _.id,
112-
},
113-
});
109+
.findWithCount({
110+
where: {
111+
threadOf: _.id,
112+
},
113+
});
114114
return {
115115
id: _.id,
116116
itemsInTread: total,
@@ -203,14 +203,14 @@ const commonService = ({ strapi }: StrapiContext) => ({
203203

204204
// Find all for author
205205
async findAllPerAuthor({
206-
filters = {},
207-
populate = {},
208-
pagination,
209-
sort,
210-
fields,
211-
isAdmin = false,
212-
authorId,
213-
}: clientValidator.FindAllPerAuthorValidatorSchema,
206+
filters = {},
207+
populate = {},
208+
pagination,
209+
sort,
210+
fields,
211+
isAdmin = false,
212+
authorId,
213+
}: clientValidator.FindAllPerAuthorValidatorSchema,
214214
isStrapiAuthor: boolean = false,
215215
) {
216216
{
@@ -252,7 +252,6 @@ const commonService = ({ strapi }: StrapiContext) => ({
252252
const data = entries.reduce(
253253
(acc: { [key: string]: { documentIds: Array<string | number>, locale?: Array<string> } }, curr: Comment) => {
254254
const [relatedUid, relatedStringId] = getRelatedGroups(curr.related);
255-
256255
return {
257256
...acc,
258257
[relatedUid]: {
@@ -267,26 +266,22 @@ const commonService = ({ strapi }: StrapiContext) => ({
267266

268267
return Promise.all(
269268
Object.entries(data).map(
270-
async ([relatedUid, { documentIds, locale }]) =>
271-
strapi.documents(relatedUid as ContentTypesUUIDs)
272-
.findMany({
273-
filters: {
274-
documentId: {
275-
$in: Array.from(new Set(documentIds)),
276-
},
277-
locale: {
278-
$in: Array.from(new Set(locale)),
279-
},
280-
},
281-
// ? TBD: do we want fetch draft entities?
282-
status: 'published',
283-
})
284-
.then((relatedEntities) =>
285-
relatedEntities.map((_) => ({
286-
..._,
287-
uid: relatedUid,
288-
})),
289-
),
269+
async ([relatedUid, { documentIds, locale }]) => {
270+
return Promise.all(
271+
documentIds.map((documentId, index) =>
272+
strapi.documents(relatedUid as ContentTypesUUIDs).findOne({
273+
documentId: documentId.toString(),
274+
locale: !isNil(locale[index]) ? locale[index] : undefined,
275+
status: 'published',
276+
})
277+
)
278+
).then((relatedEntities) => relatedEntities
279+
.filter(_ => _).map((_) => ({
280+
..._,
281+
uid: relatedUid,
282+
}))
283+
)
284+
}
290285
),
291286
).then((result) => result.flat(2));
292287
},
@@ -297,7 +292,7 @@ const commonService = ({ strapi }: StrapiContext) => ({
297292
...entity,
298293
related: relatedEntities.find(
299294
(relatedEntity) => {
300-
if(relatedEntity.locale && entity.locale) {
295+
if (relatedEntity.locale && entity.locale) {
301296
return entity.related === `${relatedEntity.uid}:${relatedEntity.documentId}` && entity.locale === relatedEntity.locale;
302297
}
303298
return entity.related === `${relatedEntity.uid}:${relatedEntity.documentId}`;

0 commit comments

Comments
 (0)