diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 0aaf9bbc03..7d2108bc06 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -346,6 +346,7 @@ "successfullyAssignedToTags": "Successfully Assigned to Tags", "successfullyRemovedFromTags": "Successfully Removed from Tags", "errorOccurredWhileLoadingOrganizationUserTags": "Error occurred while loading organization tags", + "errorOccurredWhileLoadingSubTags": "Error occurred while loading subTags tags", "removeUserTag": "Delete Tag", "removeUserTagMessage": "Do you want to delete this tag? It delete all the sub tags and all the associations.", "tagDetails": "Tag Details", diff --git a/public/locales/fr/translation.json b/public/locales/fr/translation.json index bcaa5e8333..f01c2f8ad7 100644 --- a/public/locales/fr/translation.json +++ b/public/locales/fr/translation.json @@ -346,6 +346,7 @@ "successfullyAssignedToTags": "Attribué aux tags avec succès", "successfullyRemovedFromTags": "Retiré des tags avec succès", "errorOccurredWhileLoadingOrganizationUserTags": "Erreur lors du chargement des tags de l'organisation", + "errorOccurredWhileLoadingSubTags": "Une erreur s'est produite lors du chargement des sous-tags", "removeUserTag": "Supprimer le tag", "removeUserTagMessage": "Voulez-vous supprimer ce tag ? Cela supprimera tous les sous-tags et toutes les associations.", "tagDetails": "Détails du tag", diff --git a/public/locales/hi/translation.json b/public/locales/hi/translation.json index 2d47e00566..4384648ca3 100644 --- a/public/locales/hi/translation.json +++ b/public/locales/hi/translation.json @@ -346,6 +346,7 @@ "successfullyAssignedToTags": "सफलतापूर्वक टैग्स को असाइन किया गया", "successfullyRemovedFromTags": "सफलतापूर्वक टैग्स से हटाया गया", "errorOccurredWhileLoadingOrganizationUserTags": "संगठन टैग्स को लोड करते समय त्रुटि हुई", + "errorOccurredWhileLoadingSubTags": "उप-टैग लोड करते समय त्रुटि हुई", "removeUserTag": "टैग हटाएं", "removeUserTagMessage": "क्या आप इस टैग को हटाना चाहते हैं? यह सभी उप-टैग्स और सभी संबंधों को हटा देगा।", "tagDetails": "टैग विवरण", diff --git a/public/locales/sp/translation.json b/public/locales/sp/translation.json index e47ee49105..24ce0dbdec 100644 --- a/public/locales/sp/translation.json +++ b/public/locales/sp/translation.json @@ -346,6 +346,7 @@ "successfullyAssignedToTags": "Asignado a etiquetas con éxito", "successfullyRemovedFromTags": "Eliminado de etiquetas con éxito", "errorOccurredWhileLoadingOrganizationUserTags": "Error al cargar las etiquetas de la organización", + "errorOccurredWhileLoadingSubTags": "Ocurrió un error al cargar las subetiquetas", "removeUserTag": "Eliminar etiqueta", "removeUserTagMessage": "¿Desea eliminar esta etiqueta? Esto eliminará todas las subetiquetas y todas las asociaciones.", "tagDetails": "Detalles de la etiqueta", diff --git a/public/locales/zh/translation.json b/public/locales/zh/translation.json index c3a69273bb..0c070bcf8b 100644 --- a/public/locales/zh/translation.json +++ b/public/locales/zh/translation.json @@ -346,6 +346,7 @@ "successfullyAssignedToTags": "成功分配到标签", "successfullyRemovedFromTags": "成功从标签中移除", "errorOccurredWhileLoadingOrganizationUserTags": "加载组织标签时出错", + "errorOccurredWhileLoadingSubTags": "加载子标签时发生错误", "removeUserTag": "删除标签", "removeUserTagMessage": "您要删除此标签吗?这将删除所有子标签和所有关联。", "tagDetails": "标签详情", diff --git a/src/components/TagActions/TagActions.test.tsx b/src/components/TagActions/TagActions.test.tsx index 014748a913..39e287395b 100644 --- a/src/components/TagActions/TagActions.test.tsx +++ b/src/components/TagActions/TagActions.test.tsx @@ -22,10 +22,15 @@ import type { ApolloLink } from '@apollo/client'; import type { InterfaceTagActionsProps } from './TagActions'; import TagActions from './TagActions'; import i18n from 'utils/i18nForTest'; -import { MOCKS, MOCKS_ERROR } from './TagActionsMocks'; +import { + MOCKS, + MOCKS_ERROR_ORGANIZATION_TAGS_QUERY, + MOCKS_ERROR_SUBTAGS_QUERY, +} from './TagActionsMocks'; const link = new StaticMockLink(MOCKS, true); -const link2 = new StaticMockLink(MOCKS_ERROR, true); +const link2 = new StaticMockLink(MOCKS_ERROR_ORGANIZATION_TAGS_QUERY, true); +const link3 = new StaticMockLink(MOCKS_ERROR_SUBTAGS_QUERY, true); async function wait(ms = 500): Promise { await act(() => { @@ -132,6 +137,24 @@ describe('Organisation Tags Page', () => { }); }); + test('Renders error component when when subTags query is unsuccessful', async () => { + const { getByText } = renderTagActionsModal(props[0], link3); + + await wait(); + + // expand tag 1 to list its subtags + await waitFor(() => { + expect(screen.getByTestId('expandSubTags1')).toBeInTheDocument(); + }); + userEvent.click(screen.getByTestId('expandSubTags1')); + + await waitFor(() => { + expect( + getByText(translations.errorOccurredWhileLoadingSubTags), + ).toBeInTheDocument(); + }); + }); + test('Renders more members with infinite scroll', async () => { const { getByText } = renderTagActionsModal(props[0], link); diff --git a/src/components/TagActions/TagActionsMocks.ts b/src/components/TagActions/TagActionsMocks.ts index 30fff78e3e..4e3a08f184 100644 --- a/src/components/TagActions/TagActionsMocks.ts +++ b/src/components/TagActions/TagActionsMocks.ts @@ -452,7 +452,7 @@ export const MOCKS = [ }, ]; -export const MOCKS_ERROR = [ +export const MOCKS_ERROR_ORGANIZATION_TAGS_QUERY = [ { request: { query: ORGANIZATION_USER_TAGS_LIST, @@ -461,6 +461,73 @@ export const MOCKS_ERROR = [ first: TAGS_QUERY_LIMIT, }, }, - error: new Error('Mock Graphql Error'), + error: new Error('Mock Graphql Error for organization root tags query'), + }, +]; + +export const MOCKS_ERROR_SUBTAGS_QUERY = [ + { + request: { + query: ORGANIZATION_USER_TAGS_LIST, + variables: { + id: '123', + first: TAGS_QUERY_LIMIT, + }, + }, + result: { + data: { + organizations: [ + { + userTags: { + edges: [ + { + node: { + _id: '1', + name: 'userTag 1', + usersAssignedTo: { + totalCount: 5, + }, + childTags: { + totalCount: 11, + }, + }, + cursor: '1', + }, + { + node: { + _id: '2', + name: 'userTag 2', + usersAssignedTo: { + totalCount: 5, + }, + childTags: { + totalCount: 0, + }, + }, + cursor: '2', + }, + ], + pageInfo: { + startCursor: '1', + endCursor: '2', + hasNextPage: false, + hasPreviousPage: false, + }, + totalCount: 2, + }, + }, + ], + }, + }, + }, + { + request: { + query: USER_TAG_SUB_TAGS, + variables: { + id: '1', + first: TAGS_QUERY_LIMIT, + }, + }, + error: new Error('Mock Graphql Error for subTags query'), }, ]; diff --git a/src/components/TagActions/TagNode.tsx b/src/components/TagActions/TagNode.tsx index 9a97efc62c..db08c3b451 100644 --- a/src/components/TagActions/TagNode.tsx +++ b/src/components/TagActions/TagNode.tsx @@ -9,6 +9,7 @@ import type { import { TAGS_QUERY_LIMIT } from 'utils/organizationTagsUtils'; import styles from './TagActions.module.css'; import InfiniteScroll from 'react-infinite-scroll-component'; +import { WarningAmberRounded } from '@mui/icons-material'; /** * Props for the `TagNode` component. @@ -34,6 +35,7 @@ const TagNode: React.FC = ({ const { data: subTagsData, loading: subTagsLoading, + error: subTagsError, fetchMore: fetchMoreSubTags, }: { data?: { @@ -62,6 +64,19 @@ const TagNode: React.FC = ({ skip: !expanded, }); + if (subTagsError) { + return ( +
+
+ +
+ {t('errorOccurredWhileLoadingSubTags')} +
+
+
+ ); + } + const subTagsList = subTagsData?.getUserTag.childTags.edges.map( (edge) => edge.node, );