From 35b8c2367110825a03f758a4cda4f4ad31f44197 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Fri, 30 Dec 2022 23:57:48 +0530 Subject: [PATCH 01/21] use newer useQuery in place of useEndpoinData --- .../admin/users/UsersTable/UsersTable.tsx | 29 ++++++++++--------- 1 file changed, 16 insertions(+), 13 deletions(-) diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx index 6dce41f93d84..9c71d5b2b0df 100644 --- a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx +++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx @@ -1,6 +1,7 @@ import { States, StatesIcon, StatesTitle, Pagination } from '@rocket.chat/fuselage'; import { useMediaQuery, useDebouncedValue, useMutableCallback } from '@rocket.chat/fuselage-hooks'; -import { useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useMemo, useState, useEffect } from 'react'; @@ -14,8 +15,6 @@ import { } from '../../../../components/GenericTable'; import { usePagination } from '../../../../components/GenericTable/hooks/usePagination'; import { useSort } from '../../../../components/GenericTable/hooks/useSort'; -import { useEndpointData } from '../../../../hooks/useEndpointData'; -import { AsyncStatePhase } from '../../../../lib/asyncState'; import UsersTableRow from './UsersTableRow'; type UsersTableProps = { @@ -58,11 +57,15 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { 500, ); - const { value, phase, reload: reloadList } = useEndpointData('/v1/users.list', { params: query }); + const getUsers = useEndpoint('GET', '/v1/users.list') + const { data, isLoading, error, isSuccess, refetch } = useQuery(['users.list', query], async () => { + const users = await getUsers(query) + return users + }) useEffect(() => { - reload.current = reloadList; - }, [reload, reloadList]); + reload.current = refetch; + }, [reload, refetch]); const handleClick = useMutableCallback((id): void => usersRoute.push({ @@ -110,25 +113,25 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { [mediaQuery, setSort, sortBy, sortDirection, t], ); - if (phase === AsyncStatePhase.REJECTED) { + if (error) { return null; } return ( <> setText(text)} /> - {phase === AsyncStatePhase.LOADING && ( + {isLoading && ( {headers} - {phase === AsyncStatePhase.LOADING && } + {isLoading && } )} - {value?.users && value.users.length > 0 && phase === AsyncStatePhase.RESOLVED && ( + {data?.users && data.count > 0 && isSuccess && ( <> {headers} - {value?.users.map((user) => ( + {data?.users.map((user) => ( ))} @@ -137,14 +140,14 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { divider current={current} itemsPerPage={itemsPerPage} - count={value?.total || 0} + count={data?.total || 0} onSetItemsPerPage={onSetItemsPerPage} onSetCurrent={onSetCurrent} {...paginationProps} /> )} - {phase === AsyncStatePhase.RESOLVED && value?.users.length === 0 && ( + {isSuccess && data?.count === 0 && ( {t('No_results_found')} From 162739ba227fcb27e42fb80f6a5d423adaaca322 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Sat, 31 Dec 2022 00:49:52 +0530 Subject: [PATCH 02/21] prettify --- .../client/views/admin/users/UsersTable/UsersTable.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx index 9c71d5b2b0df..065e0a74e879 100644 --- a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx +++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx @@ -57,11 +57,11 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { 500, ); - const getUsers = useEndpoint('GET', '/v1/users.list') + const getUsers = useEndpoint('GET', '/v1/users.list'); const { data, isLoading, error, isSuccess, refetch } = useQuery(['users.list', query], async () => { - const users = await getUsers(query) - return users - }) + const users = await getUsers(query); + return users; + }); useEffect(() => { reload.current = refetch; From cc1fa22741b44153497f63adb41ab7a681ff902e Mon Sep 17 00:00:00 2001 From: Dnouv Date: Sat, 31 Dec 2022 17:29:01 +0530 Subject: [PATCH 03/21] useQuery for EditCustomEmojiWithData --- .../customEmoji/EditCustomEmojiWithData.tsx | 25 ++++++++----------- 1 file changed, 10 insertions(+), 15 deletions(-) diff --git a/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx b/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx index 9baf94f4eae1..bbf935ca9874 100644 --- a/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx +++ b/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx @@ -1,10 +1,9 @@ import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox, Callout } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { FC } from 'react'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import EditCustomEmoji from './EditCustomEmoji'; type EditCustomEmojiWithDataProps = { @@ -17,18 +16,14 @@ const EditCustomEmojiWithData: FC = ({ _id, onChan const t = useTranslation(); const query = useMemo(() => ({ query: JSON.stringify({ _id }) }), [_id]); - const { - value: data = { - emojis: { - update: [], - }, - }, - phase: state, - error, - reload, - } = useEndpointData('/v1/emoji-custom.list', { params: query }); + const getEmojis = useEndpoint('GET', '/v1/emoji-custom.list'); - if (state === AsyncStatePhase.LOADING) { + const { data, isLoading, error, refetch } = useQuery(['emojis.list', query], async () => { + const emoji = await getEmojis(query); + return emoji; + }); + + if (isLoading) { return ( @@ -58,7 +53,7 @@ const EditCustomEmojiWithData: FC = ({ _id, onChan const handleChange = (): void => { onChange?.(); - reload?.(); + refetch?.(); }; return ; From 0a230da3806d6302111457fadc0c593d902409e4 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Sat, 31 Dec 2022 19:55:49 +0530 Subject: [PATCH 04/21] useQuery for AdminSoundsRoute and EditCustomSound --- .../admin/customSounds/CustomSoundsRoute.tsx | 8 ++++++-- .../views/admin/customSounds/EditCustomSound.tsx | 15 ++++++++++----- 2 files changed, 16 insertions(+), 7 deletions(-) diff --git a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx index 7ea3ca8bb7f3..1603dc527ce4 100644 --- a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx +++ b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx @@ -45,8 +45,12 @@ const CustomSoundsRoute = (): ReactElement => { 500, ); - const getCustomSoundsList = useEndpoint('GET', '/v1/custom-sounds.list'); - const { data, isSuccess, isLoading, isError, refetch } = useQuery(['custom-sounds', query], () => getCustomSoundsList(query)); + const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); + + const { data, refetch, isLoading, isError, isSuccess } = useQuery(['custom-sounds.list', query], async () => { + const sound = await getSounds(query); + return sound; + }); const handleItemClick = useCallback( (_id) => (): void => { diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index 30e34b7ecd25..5f854f6dd996 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -1,9 +1,9 @@ import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox } from '@rocket.chat/fuselage'; +import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import EditSound from './EditSound'; type EditCustomSoundProps = { @@ -15,9 +15,14 @@ type EditCustomSoundProps = { function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): ReactElement { const query = useMemo(() => ({ query: JSON.stringify({ _id }) }), [_id]); - const { value: data, phase: state, error, reload } = useEndpointData('/v1/custom-sounds.list', { params: query }); + const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); - if (state === AsyncStatePhase.LOADING) { + const { data, isLoading, error, refetch } = useQuery(['custom-sounds.list', query], async () => { + const sound = await getSounds(query); + return sound; + }); + + if (isLoading) { return ( @@ -51,7 +56,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea const handleChange: () => void = () => { onChange?.(); - reload?.(); + refetch?.(); }; return ; From 8f392a4ea45aa1aecedf5d3bbf2ff92483d11c3d Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 13:41:56 +0530 Subject: [PATCH 05/21] fix error From 70ea3f46f7d53ebfc766344336b28afda6e19c9c Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 14:33:19 +0530 Subject: [PATCH 06/21] useEndpoint -> useQuery for custom user status --- .../CustomUserStatusFormWithData.tsx | 18 ++++++----- .../CustomUserStatusTable.tsx | 30 +++++++++++-------- 2 files changed, 28 insertions(+), 20 deletions(-) diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx index 64950fb8674c..0f8c4b332701 100644 --- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx +++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx @@ -1,11 +1,10 @@ import type { IUserStatus } from '@rocket.chat/core-typings'; import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox, Callout } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import CustomUserStatusForm from './CustomUserStatusForm'; type CustomUserStatusFormWithDataProps = { @@ -18,18 +17,23 @@ const CustomUserStatusFormWithData = ({ _id, onReload, onClose }: CustomUserStat const t = useTranslation(); const query = useMemo(() => ({ query: JSON.stringify({ _id }) }), [_id]); - const { value: data, phase: state, error, reload } = useEndpointData('/v1/custom-user-status.list', { params: query }); + const getCustomUserStatus = useEndpoint('GET', '/v1/custom-user-status.list'); + + const { data, isLoading, error, refetch } = useQuery(['custom-user-status.list', query], async () => { + const customUserStatus = await getCustomUserStatus(query); + return customUserStatus; + }); const handleReload = (): void => { onReload?.(); - reload?.(); + refetch?.(); }; if (!_id) { return ; } - if (state === AsyncStatePhase.LOADING) { + if (isLoading) { return ( @@ -53,7 +57,7 @@ const CustomUserStatusFormWithData = ({ _id, onReload, onClose }: CustomUserStat ); } - if (error || !data || data.statuses.length < 1) { + if (error || !data || data.count < 1) { return ( {t('Custom_User_Status_Error_Invalid_User_Status')} diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx index f9e9a98bf08c..0f89a5300749 100644 --- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx +++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx @@ -1,6 +1,7 @@ import { States, StatesIcon, StatesTitle, Pagination } from '@rocket.chat/fuselage'; import { useDebouncedValue } from '@rocket.chat/fuselage-hooks'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useState, useMemo, useEffect } from 'react'; @@ -14,8 +15,6 @@ import { } from '../../../../components/GenericTable'; import { usePagination } from '../../../../components/GenericTable/hooks/usePagination'; import { useSort } from '../../../../components/GenericTable/hooks/useSort'; -import { useEndpointData } from '../../../../hooks/useEndpointData'; -import { AsyncStatePhase } from '../../../../lib/asyncState'; import CustomUserStatusRow from './CustomUserStatusRow'; type CustomUserStatusProps = { @@ -42,26 +41,31 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem 500, ); - const { value, reload: reloadEndpoint, phase } = useEndpointData('/v1/custom-user-status.list', { params: query }); + const getCustomUserStatus = useEndpoint('GET', '/v1/custom-user-status.list'); + + const { data, isLoading, error, refetch, isFetched } = useQuery(['custom-user-status', query], async () => { + const userStatus = await getCustomUserStatus(query); + return userStatus; + }); useEffect(() => { - reload.current = reloadEndpoint; - }, [reload, reloadEndpoint]); + reload.current = refetch; + }, [reload, refetch]); - if (phase === AsyncStatePhase.REJECTED) { + if (error) { return null; } return ( <> setText(text)} /> - {value?.statuses.length === 0 && ( + {data?.statuses.length === 0 && ( {t('No_results_found')} )} - {value?.statuses && value.statuses.length > 0 && ( + {data?.statuses && data.statuses.length > 0 && ( <> @@ -79,17 +83,17 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem - {phase === AsyncStatePhase.LOADING && } - {value?.statuses.map((status) => ( + {isLoading && } + {data?.statuses.map((status) => ( ))} - {phase === AsyncStatePhase.RESOLVED && ( + {isFetched && ( Date: Mon, 9 Jan 2023 16:13:31 +0530 Subject: [PATCH 07/21] useQuery -> useEndpoindata for integrations --- .../admin/integrations/IntegrationsTable.js | 15 ++++++++++----- .../edit/EditIncomingWebhookWithData.js | 16 +++++++++++----- .../edit/EditOutgoingWebhookWithData.js | 17 +++++++++++------ 3 files changed, 32 insertions(+), 16 deletions(-) diff --git a/apps/meteor/client/views/admin/integrations/IntegrationsTable.js b/apps/meteor/client/views/admin/integrations/IntegrationsTable.js index aa0632047357..43047cb4916d 100644 --- a/apps/meteor/client/views/admin/integrations/IntegrationsTable.js +++ b/apps/meteor/client/views/admin/integrations/IntegrationsTable.js @@ -1,13 +1,13 @@ import { useDebouncedValue, useResizeObserver } from '@rocket.chat/fuselage-hooks'; -import { useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import React, { useMemo, useCallback, useState } from 'react'; import GenericTable from '../../../components/GenericTable'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import FilterByTypeAndText from './FilterByTypeAndText'; import IntegrationRow from './IntegrationRow'; -const useQuery = ({ text, type, itemsPerPage, current }, [column, direction]) => +const useQueryLoc = ({ text, type, itemsPerPage, current }, [column, direction]) => useMemo( () => ({ query: JSON.stringify({ name: { $regex: text || '', $options: 'i' }, type }), @@ -34,9 +34,14 @@ function IntegrationsTable({ type }) { const debouncedText = useDebouncedValue(params.text, 500); const debouncedSort = useDebouncedValue(sort, 500); - const query = useQuery({ ...params, text: debouncedText, type }, debouncedSort); + const query = useQueryLoc({ ...params, text: debouncedText, type }, debouncedSort); - const { value: data } = useEndpointData('/v1/integrations.list', { params: query }); + const getIntegrations = useEndpoint('GET', '/v1/integrations.list'); + + const { data } = useQuery(['integrations.list', query], async () => { + const integrations = await getIntegrations(query); + return integrations; + }); const router = useRoute('admin-integrations'); diff --git a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js index 4d0996ef58a9..d2b4f20bcfc8 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js @@ -1,22 +1,28 @@ import { Box, Skeleton } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import React, { useMemo } from 'react'; import { AsyncStatePhase } from '../../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../../hooks/useEndpointData'; import EditIncomingWebhook from './EditIncomingWebhook'; function EditIncomingWebhookWithData({ integrationId, ...props }) { const t = useTranslation(); const params = useMemo(() => ({ integrationId }), [integrationId]); - const { value: data, phase: state, error, reload } = useEndpointData('/v1/integrations.get', { params }); + + const getIntegrations = useEndpoint('GET', '/v1/integrations.get'); + + const { data, isLoading, error, refetch } = useQuery(['integrations.get', params], async () => { + const integrations = await getIntegrations(params); + return integrations; + }); const onChange = () => { - reload(); + refetch(); }; - if (state === AsyncStatePhase.LOADING) { + if (isLoading) { return ( diff --git a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js index 09e5f28cf189..456adb650740 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js @@ -1,22 +1,27 @@ import { Box, Skeleton } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../../hooks/useEndpointData'; import EditOutgoingWebhook from './EditOutgoingWebhook'; function EditOutgoingWebhookWithData({ integrationId, ...props }) { const t = useTranslation(); const params = useMemo(() => ({ integrationId }), [integrationId]); - const { value: data, phase: state, error, reload } = useEndpointData('/v1/integrations.get', { params }); + + const getIntegrations = useEndpoint('GET', '/v1/integrations.get'); + + const { data, isLoading, error, refetch } = useQuery(['integrations.get', params], async () => { + const integrations = await getIntegrations(params); + return integrations; + }); const onChange = () => { - reload(); + refetch(); }; - if (state === AsyncStatePhase.LOADING) { + if (isLoading) { return ( From 4fe708ca590bae4956046c968b6e6a5260d11565 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 16:31:33 +0530 Subject: [PATCH 08/21] useQuery -> useEndpoindata for invites --- apps/meteor/client/views/admin/invites/InvitesPage.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/apps/meteor/client/views/admin/invites/InvitesPage.tsx b/apps/meteor/client/views/admin/invites/InvitesPage.tsx index 3be37392d745..7ef4fbd2994e 100644 --- a/apps/meteor/client/views/admin/invites/InvitesPage.tsx +++ b/apps/meteor/client/views/admin/invites/InvitesPage.tsx @@ -21,8 +21,12 @@ const InvitesPage = (): ReactElement => { const dispatchToastMessage = useToastMessageDispatch(); const setModal = useSetModal(); - const getInvitesList = useEndpoint('GET', '/v1/listInvites'); - const { data, isLoading, isSuccess, isError, refetch } = useQuery(['invites'], () => getInvitesList()); + const getInvites = useEndpoint('GET', '/v1/listInvites'); + + const { data, isLoading, refetch, isSuccess, isError } = useQuery(['listInvites'], async () => { + const invites = await getInvites(); + return invites; + }); const onRemove = (removeInvite: () => Promise): void => { const confirmRemove = async (): Promise => { From bd2364782f83e9e6981b8b4e024b41f837ae6a2d Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 16:39:10 +0530 Subject: [PATCH 09/21] useQuery -> useEndpoindata for app releases --- .../tabs/AppReleases/AppReleases.tsx | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx index d36de080d8b7..694339c05feb 100644 --- a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx +++ b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx @@ -1,24 +1,29 @@ import type { App } from '@rocket.chat/core-typings'; import { Accordion } from '@rocket.chat/fuselage'; +import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React from 'react'; -import { useEndpointData } from '../../../../../../hooks/useEndpointData'; -import { AsyncStatePhase } from '../../../../../../lib/asyncState/AsyncStatePhase'; import AccordionLoading from '../../../AccordionLoading'; import AppReleasesItem from './AppReleasesItem'; // TODO: replace useEndpointData const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { - const result = useEndpointData('/apps/:id/versions', { keys: { id } }); + const getVersions = useEndpoint('GET', `/apps/${id}/versions`); + + const { data, isLoading, isFetched } = useQuery(['versions'], async () => { + const versions = await getVersions(); + return versions; + }); return ( <> - {result.phase === AsyncStatePhase.LOADING && } - {result.phase === AsyncStatePhase.RESOLVED && ( + {isLoading && } + {isFetched && ( <> - {result.value.apps.map((release) => ( + {data?.apps.map((release) => ( ))} From 8eda2002b626df2149a4ca4afe3d8489f7c28a2c Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 17:52:43 +0530 Subject: [PATCH 10/21] useQuery -> useEndpoindata for app OAUthApps --- .../tabs/AppReleases/AppReleases.tsx | 1 - .../admin/oauthApps/EditOauthAppWithData.tsx | 18 +++++++++++------- .../views/admin/oauthApps/OAuthAppsTable.tsx | 13 ++++++++++--- 3 files changed, 21 insertions(+), 11 deletions(-) diff --git a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx index 694339c05feb..a3782a06b7bf 100644 --- a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx +++ b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx @@ -8,7 +8,6 @@ import React from 'react'; import AccordionLoading from '../../../AccordionLoading'; import AppReleasesItem from './AppReleasesItem'; -// TODO: replace useEndpointData const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { const getVersions = useEndpoint('GET', `/apps/${id}/versions`); diff --git a/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx b/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx index ddaa955c5fbf..ee0027e8b2ba 100644 --- a/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx +++ b/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx @@ -1,10 +1,9 @@ import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useCallback, useMemo } from 'react'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import EditOauthApp from './EditOauthApp'; const EditOauthAppWithData = ({ _id, ...props }: { _id: string }): ReactElement => { @@ -12,13 +11,18 @@ const EditOauthAppWithData = ({ _id, ...props }: { _id: string }): ReactElement const params = useMemo(() => ({ appId: _id }), [_id]); - const { value: data, phase: state, error, reload } = useEndpointData('/v1/oauth-apps.get', { params }); + const getOauthApps = useEndpoint('GET', '/v1/oauth-apps.get'); + + const { data, isLoading, error, refetch } = useQuery(['oauth-apps', params], async () => { + const oauthApps = await getOauthApps(params); + return oauthApps; + }); const onChange = useCallback(() => { - reload(); - }, [reload]); + refetch(); + }, [refetch]); - if (state === AsyncStatePhase.LOADING) { + if (isLoading) { return ( diff --git a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx index ea42b855fc34..d22c33349552 100644 --- a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx +++ b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx @@ -1,17 +1,24 @@ import { Table } from '@rocket.chat/fuselage'; -import { useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useUserId } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo, useCallback } from 'react'; import GenericTable from '../../../components/GenericTable'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import { useFormatDateAndTime } from '../../../hooks/useFormatDateAndTime'; const OAuthAppsTable = (): ReactElement => { const t = useTranslation(); const formatDateAndTime = useFormatDateAndTime(); - const { value: data } = useEndpointData('/v1/oauth-apps.list'); + const uid = useUserId() || ''; + + const getOauthApps = useEndpoint('GET', '/v1/oauth-apps.list'); + const { data } = useQuery(['oauth-apps'], async () => { + const oauthApps = await getOauthApps({ uid: uid }); + return oauthApps; + }); const router = useRoute('admin-oauth-apps'); From 8ed00f25d551bb1298192bdc6092fb5861a012ab Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 18:35:19 +0530 Subject: [PATCH 11/21] useQuery -> useEndpoindata for app UsersinTableWithData --- .../UsersInRoleTableWithData.tsx | 23 +++++++++++-------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx index 31f20bb645ac..9909d31152f5 100644 --- a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx +++ b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx @@ -1,10 +1,10 @@ import type { IRole, IRoom, IUserInRole } from '@rocket.chat/core-typings'; +import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useEffect, useMemo } from 'react'; import { usePagination } from '../../../../../components/GenericTable/hooks/usePagination'; -import { useEndpointData } from '../../../../../hooks/useEndpointData'; -import { AsyncStatePhase } from '../../../../../lib/asyncState'; import UsersInRoleTable from './UsersInRoleTable'; type UsersInRoleTableWithDataProps = { @@ -34,17 +34,22 @@ const UsersInRoleTableWithData = ({ [itemsPerPage, current, rid, roleId], ); - const { reload, ...result } = useEndpointData('/v1/roles.getUsersInRole', { params: query }); + const getUsersInRole = useEndpoint('GET', '/v1/roles.getUsersInRole'); + + const { refetch, ...result } = useQuery(['usersInRole', query], async () => { + const users = await getUsersInRole(query); + return users; + }); useEffect(() => { - reloadRef.current = reload; - }, [reload, reloadRef]); + reloadRef.current = refetch; + }, [refetch, reloadRef]); - if (result.phase === AsyncStatePhase.LOADING || result.phase === AsyncStatePhase.REJECTED) { + if (result.isLoading || result.error) { return null; } - const users: IUserInRole[] = result.value?.users.map((user) => ({ + const users: IUserInRole[] = result.data!.users.map((user) => ({ ...user, createdAt: new Date(user.createdAt), _updatedAt: new Date(user._updatedAt), @@ -53,8 +58,8 @@ const UsersInRoleTableWithData = ({ return ( Date: Mon, 9 Jan 2023 19:30:07 +0530 Subject: [PATCH 12/21] useQuery -> useEndpoindata for EditRoomWithData --- .../views/admin/rooms/EditRoomWithData.tsx | 26 +++++++++---------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx b/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx index 1e826b3d3ca3..c0b92f89af4f 100644 --- a/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx +++ b/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx @@ -1,20 +1,20 @@ import { Box, Skeleton } from '@rocket.chat/fuselage'; +import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { FC } from 'react'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import EditRoom from './EditRoom'; const EditRoomWithData: FC<{ rid?: string; onReload: () => void }> = ({ rid, onReload }) => { - const { - value: data, - phase: state, - error, - reload, - } = useEndpointData('/v1/rooms.adminRooms.getRoom', { params: useMemo(() => ({ rid }), [rid]) }); - - if (state === AsyncStatePhase.LOADING) { + const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms.getRoom'); + + const { data, isLoading, error, refetch, isError } = useQuery(['rooms', useMemo(() => ({ rid }), [rid])], async () => { + const rooms = await getAdminRooms({ rid }); + return rooms; + }); + + if (isLoading) { return ( @@ -27,12 +27,12 @@ const EditRoomWithData: FC<{ rid?: string; onReload: () => void }> = ({ rid, onR ); } - if (state === AsyncStatePhase.REJECTED) { - return <>{error?.message}; + if (isError) { + return <>{(error as Error).message}; } const handleChange = (): void => { - reload(); + refetch(); onReload(); }; From 5962f32771cd31b81ce8ea100bdbae7ba1fb68ea Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 9 Jan 2023 23:14:08 +0530 Subject: [PATCH 13/21] useQuery -> useEndpoindata for RoomsTable --- .../client/views/admin/rooms/RoomsTable.tsx | 32 +++++++++++-------- 1 file changed, 18 insertions(+), 14 deletions(-) diff --git a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx index e5aedc965f97..60b56b346c27 100644 --- a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx +++ b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx @@ -1,14 +1,13 @@ import type { IRoom } from '@rocket.chat/core-typings'; import { Box, Table, Icon } from '@rocket.chat/fuselage'; import { useMediaQuery, useDebouncedValue } from '@rocket.chat/fuselage-hooks'; -import { useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { CSSProperties, ReactElement, MutableRefObject } from 'react'; import React, { useState, useEffect, useMemo, useCallback } from 'react'; import GenericTable from '../../../components/GenericTable'; import RoomAvatar from '../../../components/avatar/RoomAvatar'; -import { useEndpointData } from '../../../hooks/useEndpointData'; -import { AsyncStatePhase } from '../../../lib/asyncState'; import { roomCoordinator } from '../../../lib/rooms/roomCoordinator'; import FilterByTypeAndText from './FilterByTypeAndText'; @@ -23,7 +22,7 @@ const style: CSSProperties = { whiteSpace: 'nowrap', textOverflow: 'ellipsis', o export const DEFAULT_TYPES = ['d', 'p', 'c', 'teams']; -const useQuery = ( +const useQueryLc = ( { text, types, @@ -74,14 +73,14 @@ const getRoomDisplayName = (room: IRoom): string | undefined => const useDisplayData = (asyncState: any, sort: [string, 'asc' | 'desc']): IRoom[] => useMemo(() => { - const { value = {}, phase } = asyncState; + const { data = {}, isLoading } = asyncState; - if (phase === AsyncStatePhase.LOADING) { + if (isLoading) { return null; } - if (sort[0] === 'name' && value.rooms) { - return value.rooms.sort((a: IRoom, b: IRoom) => { + if (sort[0] === 'name' && data.rooms) { + return data.rooms.sort((a: IRoom, b: IRoom) => { const aName = getRoomDisplayName(a) || ''; const bName = getRoomDisplayName(b) || ''; if (aName === bName) { @@ -91,7 +90,7 @@ const useDisplayData = (asyncState: any, sort: [string, 'asc' | 'desc']): IRoom[ return sort[1] === 'asc' ? result : result * -1; }); } - return value.rooms; + return data.rooms; }, [asyncState, sort]); const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): ReactElement => { @@ -111,15 +110,20 @@ const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): React const debouncedParams = useDebouncedValue(params, 500); const debouncedSort = useDebouncedValue(sort, 500); - const query = useQuery(debouncedParams, debouncedSort); + const query = useQueryLc(debouncedParams, debouncedSort); - const endpointData = useEndpointData('/v1/rooms.adminRooms', { params: query }); + const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms'); - const { value: data, reload: reloadEndPoint } = endpointData; + const endpointData = useQuery(['adminRooms', query], async () => { + const adminRooms = await getAdminRooms(params); + return adminRooms; + }); + + const { data, refetch } = endpointData; useEffect(() => { - reload.current = reloadEndPoint; - }, [reload, reloadEndPoint]); + reload.current = refetch; + }, [reload, refetch]); const router = useRoute(routeName); From afcfc0831eaf01432f548edb162e50ac58f92446 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Tue, 10 Jan 2023 15:19:10 +0530 Subject: [PATCH 14/21] useEndpointData -> useEndpoint for admin/users/* --- .../client/views/admin/users/AddUser.js | 13 +++++--- .../admin/users/AdminUserInfoWithData.tsx | 23 ++++++------- .../views/admin/users/EditUserWithData.tsx | 33 +++++++++++++++---- 3 files changed, 48 insertions(+), 21 deletions(-) diff --git a/apps/meteor/client/views/admin/users/AddUser.js b/apps/meteor/client/views/admin/users/AddUser.js index b95647cef13e..3d00799ae6d4 100644 --- a/apps/meteor/client/views/admin/users/AddUser.js +++ b/apps/meteor/client/views/admin/users/AddUser.js @@ -1,10 +1,10 @@ import { Field, Box, Button } from '@rocket.chat/fuselage'; import { useMutableCallback } from '@rocket.chat/fuselage-hooks'; -import { useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import React, { useMemo, useCallback, useState } from 'react'; import { useEndpointAction } from '../../../hooks/useEndpointAction'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import { useForm } from '../../../hooks/useForm'; import UserForm from './UserForm'; @@ -13,7 +13,12 @@ const AddUser = ({ onReload, ...props }) => { const router = useRoute('admin-users'); - const { value: roleData } = useEndpointData('/v1/roles.list'); + const getRoleData = useEndpoint('GET', '/v1/roles.list'); + + const { data } = useQuery(['roles.list', ''], async () => { + const roles = await getRoleData(); + return roles; + }); const [errors, setErrors] = useState({}); const validationKeys = { @@ -103,7 +108,7 @@ const AddUser = ({ onReload, ...props }) => { } }); - const availableRoles = useMemo(() => roleData?.roles?.map(({ _id, description, name }) => [_id, description || name]) ?? [], [roleData]); + const availableRoles = useMemo(() => data?.roles?.map(({ _id, description, name }) => [_id, description || name]) ?? [], [data]); const append = useMemo( () => ( diff --git a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx index f8bb19b45e42..2c6f50266a88 100644 --- a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx +++ b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx @@ -1,7 +1,8 @@ import type { IUser } from '@rocket.chat/core-typings'; import { Callout } from '@rocket.chat/fuselage'; import { useMutableCallback } from '@rocket.chat/fuselage-hooks'; -import { useSetting, useRolesDescription, useTranslation } from '@rocket.chat/ui-contexts'; +import { useSetting, useRolesDescription, useTranslation, useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; @@ -11,8 +12,6 @@ import UserCard from '../../../components/UserCard'; import UserInfo from '../../../components/UserInfo'; import { UserStatus } from '../../../components/UserStatus'; import VerticalBar from '../../../components/VerticalBar'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import { getUserEmailVerified } from '../../../lib/utils/getUserEmailVerified'; import AdminUserInfoActions from './AdminUserInfoActions'; @@ -26,16 +25,18 @@ const AdminUserInfoWithData = ({ uid, onReload }: AdminUserInfoWithDataProps): R const getRoles = useRolesDescription(); const approveManuallyUsers = useSetting('Accounts_ManuallyApproveNewUsers'); - const { - value: data, - phase: state, - error, - reload: reloadUserInfo, - } = useEndpointData('/v1/users.info', { params: useMemo(() => ({ userId: uid }), [uid]) }); + const getUsersInfo = useEndpoint('GET', '/v1/users.info'); + + const query = useMemo(() => ({ userId: uid }), [uid]); + + const { data, isLoading, error, refetch } = useQuery(['users.info', query], async () => { + const usersInfo = await getUsersInfo(query); + return usersInfo; + }); const onChange = useMutableCallback(() => { onReload(); - reloadUserInfo(); + refetch(); }); const user = useMemo(() => { @@ -82,7 +83,7 @@ const AdminUserInfoWithData = ({ uid, onReload }: AdminUserInfoWithDataProps): R }; }, [approveManuallyUsers, data, getRoles]); - if (state === AsyncStatePhase.LOADING) { + if (isLoading) { return ( diff --git a/apps/meteor/client/views/admin/users/EditUserWithData.tsx b/apps/meteor/client/views/admin/users/EditUserWithData.tsx index d3a308e8f0e5..c1254cfeaad5 100644 --- a/apps/meteor/client/views/admin/users/EditUserWithData.tsx +++ b/apps/meteor/client/views/admin/users/EditUserWithData.tsx @@ -1,13 +1,12 @@ import type { IUser } from '@rocket.chat/core-typings'; import { isUserFederated } from '@rocket.chat/core-typings'; import { Box, Callout } from '@rocket.chat/fuselage'; -import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; import { FormSkeleton } from '../../../components/Skeleton'; -import { AsyncStatePhase } from '../../../hooks/useAsyncState'; -import { useEndpointData } from '../../../hooks/useEndpointData'; import EditUser from './EditUser'; type EditUserWithDataProps = { @@ -17,10 +16,32 @@ type EditUserWithDataProps = { const EditUserWithData = ({ uid, onReload, ...props }: EditUserWithDataProps): ReactElement => { const t = useTranslation(); - const { value: roleData, phase: roleState, error: roleError } = useEndpointData('/v1/roles.list'); - const { value: data, phase: state, error } = useEndpointData('/v1/users.info', { params: useMemo(() => ({ userId: uid }), [uid]) }); - if ([state, roleState].includes(AsyncStatePhase.LOADING)) { + const getRoles = useEndpoint('GET', '/v1/roles.list'); + + const query = useMemo(() => ({ userId: uid }), [uid]); + + const { + data: roleData, + isLoading: roleState, + error: roleError, + } = useQuery(['roles.list'], async () => { + const roles = await getRoles(); + return roles; + }); + + const getUsersInfo = useEndpoint('GET', '/v1/users.info'); + + const { + data, + isLoading: state, + error, + } = useQuery(['users.info', query], async () => { + const usersInfo = await getUsersInfo(query); + return usersInfo; + }); + + if (state || roleState) { return ( From df8365ea2f882bf9aaae0ed3ccb896e3a56f194b Mon Sep 17 00:00:00 2001 From: Dnouv Date: Tue, 10 Jan 2023 18:13:03 +0530 Subject: [PATCH 15/21] fix lint error --- .../admin/integrations/edit/EditIncomingWebhookWithData.js | 1 - .../meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx | 7 +++---- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js index d2b4f20bcfc8..7f46d8c6e075 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js @@ -3,7 +3,6 @@ import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import React, { useMemo } from 'react'; -import { AsyncStatePhase } from '../../../../hooks/useAsyncState'; import EditIncomingWebhook from './EditIncomingWebhook'; function EditIncomingWebhookWithData({ integrationId, ...props }) { diff --git a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx index d22c33349552..55a8a2abbe01 100644 --- a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx +++ b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx @@ -1,6 +1,5 @@ import { Table } from '@rocket.chat/fuselage'; -import { useUserId } from '@rocket.chat/ui-contexts'; -import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useTranslation, useUserId } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo, useCallback } from 'react'; @@ -12,11 +11,11 @@ const OAuthAppsTable = (): ReactElement => { const t = useTranslation(); const formatDateAndTime = useFormatDateAndTime(); - const uid = useUserId() || ''; + const uid = { uid: useUserId() || '' }; const getOauthApps = useEndpoint('GET', '/v1/oauth-apps.list'); const { data } = useQuery(['oauth-apps'], async () => { - const oauthApps = await getOauthApps({ uid: uid }); + const oauthApps = await getOauthApps(uid); return oauthApps; }); From 8cd942234ef1e4f22b315f3bcd39ec9fca6f3a82 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Wed, 11 Jan 2023 14:28:46 +0530 Subject: [PATCH 16/21] change querykeys --- .../apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx | 5 +++-- .../views/admin/customEmoji/EditCustomEmojiWithData.tsx | 2 +- .../client/views/admin/customSounds/CustomSoundsRoute.tsx | 2 +- .../client/views/admin/customSounds/EditCustomSound.tsx | 2 +- .../admin/customUserStatus/CustomUserStatusFormWithData.tsx | 2 +- .../CustomUserStatusTable/CustomUserStatusTable.tsx | 2 +- .../client/views/admin/integrations/IntegrationsTable.js | 2 +- .../admin/integrations/edit/EditIncomingWebhookWithData.js | 2 +- .../admin/integrations/edit/EditOutgoingWebhookWithData.js | 2 +- apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx | 2 +- .../UsersInRoleTable/UsersInRoleTableWithData.tsx | 2 +- apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx | 4 ++-- apps/meteor/client/views/admin/rooms/RoomsTable.tsx | 2 +- apps/meteor/client/views/admin/users/AddUser.js | 2 +- .../client/views/admin/users/AdminUserInfoWithData.tsx | 2 +- apps/meteor/client/views/admin/users/EditUserWithData.tsx | 4 ++-- .../client/views/admin/users/UsersTable/UsersTable.tsx | 2 +- 17 files changed, 21 insertions(+), 20 deletions(-) diff --git a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx index a3782a06b7bf..668626b5cc30 100644 --- a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx +++ b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx @@ -8,10 +8,11 @@ import React from 'react'; import AccordionLoading from '../../../AccordionLoading'; import AppReleasesItem from './AppReleasesItem'; +// TODO: replace useEndpointData const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { - const getVersions = useEndpoint('GET', `/apps/${id}/versions`); + const getVersions = useEndpoint('GET', '/apps/:id/versions', { id }); - const { data, isLoading, isFetched } = useQuery(['versions'], async () => { + const { data, isLoading, isFetched } = useQuery(['apps', id, 'versions'], async () => { const versions = await getVersions(); return versions; }); diff --git a/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx b/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx index bbf935ca9874..3028f24e998f 100644 --- a/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx +++ b/apps/meteor/client/views/admin/customEmoji/EditCustomEmojiWithData.tsx @@ -18,7 +18,7 @@ const EditCustomEmojiWithData: FC = ({ _id, onChan const getEmojis = useEndpoint('GET', '/v1/emoji-custom.list'); - const { data, isLoading, error, refetch } = useQuery(['emojis.list', query], async () => { + const { data, isLoading, error, refetch } = useQuery(['custom-emojis', query], async () => { const emoji = await getEmojis(query); return emoji; }); diff --git a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx index 1603dc527ce4..71e4e6b1b80f 100644 --- a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx +++ b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx @@ -47,7 +47,7 @@ const CustomSoundsRoute = (): ReactElement => { const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); - const { data, refetch, isLoading, isError, isSuccess } = useQuery(['custom-sounds.list', query], async () => { + const { data, refetch, isLoading, isError, isSuccess } = useQuery(['custom-sounds', query], async () => { const sound = await getSounds(query); return sound; }); diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index 5f854f6dd996..c79614c6aeb4 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -17,7 +17,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); - const { data, isLoading, error, refetch } = useQuery(['custom-sounds.list', query], async () => { + const { data, isLoading, error, refetch } = useQuery(['custom-sounds', query], async () => { const sound = await getSounds(query); return sound; }); diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx index 0f8c4b332701..427d37dbacda 100644 --- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx +++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusFormWithData.tsx @@ -19,7 +19,7 @@ const CustomUserStatusFormWithData = ({ _id, onReload, onClose }: CustomUserStat const getCustomUserStatus = useEndpoint('GET', '/v1/custom-user-status.list'); - const { data, isLoading, error, refetch } = useQuery(['custom-user-status.list', query], async () => { + const { data, isLoading, error, refetch } = useQuery(['custom-user-statuses', query], async () => { const customUserStatus = await getCustomUserStatus(query); return customUserStatus; }); diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx index 0f89a5300749..f2754a65bde0 100644 --- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx +++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx @@ -43,7 +43,7 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem const getCustomUserStatus = useEndpoint('GET', '/v1/custom-user-status.list'); - const { data, isLoading, error, refetch, isFetched } = useQuery(['custom-user-status', query], async () => { + const { data, isLoading, error, refetch, isFetched } = useQuery(['custom-user-statuses', query], async () => { const userStatus = await getCustomUserStatus(query); return userStatus; }); diff --git a/apps/meteor/client/views/admin/integrations/IntegrationsTable.js b/apps/meteor/client/views/admin/integrations/IntegrationsTable.js index 43047cb4916d..9d7d8c584313 100644 --- a/apps/meteor/client/views/admin/integrations/IntegrationsTable.js +++ b/apps/meteor/client/views/admin/integrations/IntegrationsTable.js @@ -38,7 +38,7 @@ function IntegrationsTable({ type }) { const getIntegrations = useEndpoint('GET', '/v1/integrations.list'); - const { data } = useQuery(['integrations.list', query], async () => { + const { data } = useQuery(['integrations', query], async () => { const integrations = await getIntegrations(query); return integrations; }); diff --git a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js index 7f46d8c6e075..61ffde4325ca 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditIncomingWebhookWithData.js @@ -12,7 +12,7 @@ function EditIncomingWebhookWithData({ integrationId, ...props }) { const getIntegrations = useEndpoint('GET', '/v1/integrations.get'); - const { data, isLoading, error, refetch } = useQuery(['integrations.get', params], async () => { + const { data, isLoading, error, refetch } = useQuery(['integrations', params], async () => { const integrations = await getIntegrations(params); return integrations; }); diff --git a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js index 456adb650740..2da5fefe3917 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js @@ -12,7 +12,7 @@ function EditOutgoingWebhookWithData({ integrationId, ...props }) { const getIntegrations = useEndpoint('GET', '/v1/integrations.get'); - const { data, isLoading, error, refetch } = useQuery(['integrations.get', params], async () => { + const { data, isLoading, error, refetch } = useQuery(['integrations', params], async () => { const integrations = await getIntegrations(params); return integrations; }); diff --git a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx index 55a8a2abbe01..a2317a263f9e 100644 --- a/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx +++ b/apps/meteor/client/views/admin/oauthApps/OAuthAppsTable.tsx @@ -14,7 +14,7 @@ const OAuthAppsTable = (): ReactElement => { const uid = { uid: useUserId() || '' }; const getOauthApps = useEndpoint('GET', '/v1/oauth-apps.list'); - const { data } = useQuery(['oauth-apps'], async () => { + const { data } = useQuery(['oauth-apps', { uid }], async () => { const oauthApps = await getOauthApps(uid); return oauthApps; }); diff --git a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx index 9909d31152f5..ae636a51e3fb 100644 --- a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx +++ b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx @@ -36,7 +36,7 @@ const UsersInRoleTableWithData = ({ const getUsersInRole = useEndpoint('GET', '/v1/roles.getUsersInRole'); - const { refetch, ...result } = useQuery(['usersInRole', query], async () => { + const { refetch, ...result } = useQuery(['roles', roleId, 'users', query], async () => { const users = await getUsersInRole(query); return users; }); diff --git a/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx b/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx index c0b92f89af4f..d4461ace496a 100644 --- a/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx +++ b/apps/meteor/client/views/admin/rooms/EditRoomWithData.tsx @@ -2,14 +2,14 @@ import { Box, Skeleton } from '@rocket.chat/fuselage'; import { useEndpoint } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { FC } from 'react'; -import React, { useMemo } from 'react'; +import React from 'react'; import EditRoom from './EditRoom'; const EditRoomWithData: FC<{ rid?: string; onReload: () => void }> = ({ rid, onReload }) => { const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms.getRoom'); - const { data, isLoading, error, refetch, isError } = useQuery(['rooms', useMemo(() => ({ rid }), [rid])], async () => { + const { data, isLoading, error, refetch, isError } = useQuery(['rooms', rid, 'admin'], async () => { const rooms = await getAdminRooms({ rid }); return rooms; }); diff --git a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx index 60b56b346c27..e6669df94dd9 100644 --- a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx +++ b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx @@ -114,7 +114,7 @@ const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): React const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms'); - const endpointData = useQuery(['adminRooms', query], async () => { + const endpointData = useQuery(['rooms', query, 'admin'], async () => { const adminRooms = await getAdminRooms(params); return adminRooms; }); diff --git a/apps/meteor/client/views/admin/users/AddUser.js b/apps/meteor/client/views/admin/users/AddUser.js index 3d00799ae6d4..379e47e5ea95 100644 --- a/apps/meteor/client/views/admin/users/AddUser.js +++ b/apps/meteor/client/views/admin/users/AddUser.js @@ -15,7 +15,7 @@ const AddUser = ({ onReload, ...props }) => { const getRoleData = useEndpoint('GET', '/v1/roles.list'); - const { data } = useQuery(['roles.list', ''], async () => { + const { data } = useQuery(['roles'], async () => { const roles = await getRoleData(); return roles; }); diff --git a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx index 2c6f50266a88..67c131bf255e 100644 --- a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx +++ b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx @@ -29,7 +29,7 @@ const AdminUserInfoWithData = ({ uid, onReload }: AdminUserInfoWithDataProps): R const query = useMemo(() => ({ userId: uid }), [uid]); - const { data, isLoading, error, refetch } = useQuery(['users.info', query], async () => { + const { data, isLoading, error, refetch } = useQuery(['users', query, 'admin'], async () => { const usersInfo = await getUsersInfo(query); return usersInfo; }); diff --git a/apps/meteor/client/views/admin/users/EditUserWithData.tsx b/apps/meteor/client/views/admin/users/EditUserWithData.tsx index c1254cfeaad5..ae586f549dc6 100644 --- a/apps/meteor/client/views/admin/users/EditUserWithData.tsx +++ b/apps/meteor/client/views/admin/users/EditUserWithData.tsx @@ -25,7 +25,7 @@ const EditUserWithData = ({ uid, onReload, ...props }: EditUserWithDataProps): R data: roleData, isLoading: roleState, error: roleError, - } = useQuery(['roles.list'], async () => { + } = useQuery(['roles'], async () => { const roles = await getRoles(); return roles; }); @@ -36,7 +36,7 @@ const EditUserWithData = ({ uid, onReload, ...props }: EditUserWithDataProps): R data, isLoading: state, error, - } = useQuery(['users.info', query], async () => { + } = useQuery(['users', query, 'admin'], async () => { const usersInfo = await getUsersInfo(query); return usersInfo; }); diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx index 065e0a74e879..44b11ed19478 100644 --- a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx +++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx @@ -58,7 +58,7 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { ); const getUsers = useEndpoint('GET', '/v1/users.list'); - const { data, isLoading, error, isSuccess, refetch } = useQuery(['users.list', query], async () => { + const { data, isLoading, error, isSuccess, refetch } = useQuery(['users', query], async () => { const users = await getUsers(query); return users; }); From d958de433d5db237d5f3eeaea97d49f440a0985d Mon Sep 17 00:00:00 2001 From: Dnouv Date: Wed, 11 Jan 2023 19:12:25 +0530 Subject: [PATCH 17/21] fix build error --- apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index c79614c6aeb4..91ab1a011bd5 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -49,7 +49,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea if (error || !data || data.sounds.length < 1) { return ( - {error} + {(error as Error).message} ); } From b43cf00496cb3c031609c59d17476e7531e4e0f4 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Thu, 12 Jan 2023 20:19:54 +0530 Subject: [PATCH 18/21] Extend the queries to handle error better --- .../tabs/AppReleases/AppReleases.tsx | 26 ++++++++++--- .../admin/customSounds/CustomSoundsRoute.tsx | 31 ++++++++++----- .../admin/customSounds/EditCustomSound.tsx | 39 ++++++++++++------- .../CustomUserStatusTable.tsx | 29 +++++++++----- .../edit/EditIncomingWebhookWithData.js | 20 +++++++--- .../edit/EditOutgoingWebhookWithData.js | 20 +++++++--- .../views/admin/invites/InvitesPage.tsx | 16 ++++++-- .../admin/oauthApps/EditOauthAppWithData.tsx | 18 ++++++--- .../UsersInRoleTableWithData.tsx | 32 +++++++++++---- .../views/admin/rooms/EditRoomWithData.tsx | 24 +++++++----- .../client/views/admin/rooms/RoomsTable.tsx | 28 +++++++++---- .../admin/users/AdminUserInfoWithData.tsx | 20 +++++++--- .../views/admin/users/EditUserWithData.tsx | 20 +++++++--- .../admin/users/UsersTable/UsersTable.tsx | 21 +++++++--- 14 files changed, 246 insertions(+), 98 deletions(-) diff --git a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx index 668626b5cc30..3747086bae2e 100644 --- a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx +++ b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx @@ -1,6 +1,6 @@ import type { App } from '@rocket.chat/core-typings'; import { Accordion } from '@rocket.chat/fuselage'; -import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React from 'react'; @@ -11,11 +11,25 @@ import AppReleasesItem from './AppReleasesItem'; // TODO: replace useEndpointData const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { const getVersions = useEndpoint('GET', '/apps/:id/versions', { id }); + const dispatchToastMessage = useToastMessageDispatch(); + const t = useTranslation(); - const { data, isLoading, isFetched } = useQuery(['apps', id, 'versions'], async () => { - const versions = await getVersions(); - return versions; - }); + const { data, isLoading, isFetched } = useQuery( + ['apps', id, 'versions'], + async () => { + const { apps } = await getVersions(); + + if (apps.length === 0) { + dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + } + return apps; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); return ( <> @@ -23,7 +37,7 @@ const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { {isLoading && } {isFetched && ( <> - {data?.apps.map((release) => ( + {data?.map((release) => ( ))} diff --git a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx index 71e4e6b1b80f..54a8aa25776a 100644 --- a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx +++ b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx @@ -1,6 +1,6 @@ import { Button, Icon, Pagination, States, StatesIcon, StatesActions, StatesAction, StatesTitle } from '@rocket.chat/fuselage'; import { useDebouncedValue } from '@rocket.chat/fuselage-hooks'; -import { useRoute, useRouteParameter, usePermission, useTranslation, useEndpoint } from '@rocket.chat/ui-contexts'; +import { useRoute, useRouteParameter, usePermission, useTranslation, useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo, useState, useCallback } from 'react'; @@ -46,11 +46,24 @@ const CustomSoundsRoute = (): ReactElement => { ); const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); + const dispatchToastMessage = useToastMessageDispatch(); - const { data, refetch, isLoading, isError, isSuccess } = useQuery(['custom-sounds', query], async () => { - const sound = await getSounds(query); - return sound; - }); + const { data, refetch, isLoading, isError, isSuccess } = useQuery( + ['custom-sounds', query], + async () => { + const { sounds } = await getSounds(query); + + if (sounds.length === 0) { + dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + } + return sounds; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const handleItemClick = useCallback( (_id) => (): void => { @@ -106,13 +119,13 @@ const CustomSoundsRoute = (): ReactElement => { )} - {isSuccess && data && data.sounds.length > 0 && ( + {isSuccess && data && data.length > 0 && ( <> setParams(text)} /> {headers} - {data?.sounds.map((sound) => ( + {data?.map((sound) => ( ))} @@ -121,14 +134,14 @@ const CustomSoundsRoute = (): ReactElement => { divider current={current} itemsPerPage={itemsPerPage} - count={data.total || 0} + count={data.length || 0} onSetItemsPerPage={onSetItemsPerPage} onSetCurrent={onSetCurrent} {...paginationProps} /> )} - {isSuccess && data?.sounds.length === 0 && ( + {isSuccess && data?.length === 0 && ( {t('No_results_found')} diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index 91ab1a011bd5..716d324fd474 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -1,8 +1,8 @@ import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox } from '@rocket.chat/fuselage'; -import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; -import React, { useMemo } from 'react'; +import React from 'react'; import EditSound from './EditSound'; @@ -13,14 +13,27 @@ type EditCustomSoundProps = { }; function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): ReactElement { - const query = useMemo(() => ({ query: JSON.stringify({ _id }) }), [_id]); - + const t = useTranslation(); const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); - const { data, isLoading, error, refetch } = useQuery(['custom-sounds', query], async () => { - const sound = await getSounds(query); - return sound; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, refetch } = useQuery( + ['custom-sounds', _id], + async () => { + const { sounds } = await getSounds({ query: JSON.stringify({ _id }) }); + + if (sounds.length === 0) { + dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + } + return sounds[0]; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); if (isLoading) { return ( @@ -46,12 +59,8 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea ); } - if (error || !data || data.sounds.length < 1) { - return ( - - {(error as Error).message} - - ); + if (!data) { + return <>; } const handleChange: () => void = () => { @@ -59,7 +68,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea refetch?.(); }; - return ; + return ; } export default EditCustomSound; diff --git a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx index f2754a65bde0..33eff848848b 100644 --- a/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx +++ b/apps/meteor/client/views/admin/customUserStatus/CustomUserStatusTable/CustomUserStatusTable.tsx @@ -1,6 +1,6 @@ import { States, StatesIcon, StatesTitle, Pagination } from '@rocket.chat/fuselage'; import { useDebouncedValue } from '@rocket.chat/fuselage-hooks'; -import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useState, useMemo, useEffect } from 'react'; @@ -42,30 +42,39 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem ); const getCustomUserStatus = useEndpoint('GET', '/v1/custom-user-status.list'); + const dispatchToastMessage = useToastMessageDispatch(); - const { data, isLoading, error, refetch, isFetched } = useQuery(['custom-user-statuses', query], async () => { - const userStatus = await getCustomUserStatus(query); - return userStatus; - }); + const { data, isLoading, refetch, isFetched } = useQuery( + ['custom-user-statuses', query], + async () => { + const { statuses } = await getCustomUserStatus(query); + return statuses; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); useEffect(() => { reload.current = refetch; }, [reload, refetch]); - if (error) { + if (!data) { return null; } return ( <> setText(text)} /> - {data?.statuses.length === 0 && ( + {data.length === 0 && ( {t('No_results_found')} )} - {data?.statuses && data.statuses.length > 0 && ( + {data && data.length > 0 && ( <> @@ -84,7 +93,7 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem {isLoading && } - {data?.statuses.map((status) => ( + {data?.map((status) => ( ))} @@ -93,7 +102,7 @@ const CustomUserStatus = ({ reload, onClick }: CustomUserStatusProps): ReactElem { - const integrations = await getIntegrations(params); - return integrations; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, error, refetch } = useQuery( + ['integrations', params], + async () => { + const integrations = await getIntegrations(params); + return integrations; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const onChange = () => { refetch(); diff --git a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js index 2da5fefe3917..8aa0ed79b803 100644 --- a/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js +++ b/apps/meteor/client/views/admin/integrations/edit/EditOutgoingWebhookWithData.js @@ -1,5 +1,5 @@ import { Box, Skeleton } from '@rocket.chat/fuselage'; -import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import React, { useMemo } from 'react'; @@ -12,10 +12,20 @@ function EditOutgoingWebhookWithData({ integrationId, ...props }) { const getIntegrations = useEndpoint('GET', '/v1/integrations.get'); - const { data, isLoading, error, refetch } = useQuery(['integrations', params], async () => { - const integrations = await getIntegrations(params); - return integrations; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, error, refetch } = useQuery( + ['integrations', params], + async () => { + const integrations = await getIntegrations(params); + return integrations; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const onChange = () => { refetch(); diff --git a/apps/meteor/client/views/admin/invites/InvitesPage.tsx b/apps/meteor/client/views/admin/invites/InvitesPage.tsx index 7ef4fbd2994e..1610eeb47bb4 100644 --- a/apps/meteor/client/views/admin/invites/InvitesPage.tsx +++ b/apps/meteor/client/views/admin/invites/InvitesPage.tsx @@ -23,10 +23,18 @@ const InvitesPage = (): ReactElement => { const getInvites = useEndpoint('GET', '/v1/listInvites'); - const { data, isLoading, refetch, isSuccess, isError } = useQuery(['listInvites'], async () => { - const invites = await getInvites(); - return invites; - }); + const { data, isLoading, refetch, isSuccess, isError } = useQuery( + ['invites'], + async () => { + const invites = await getInvites(); + return invites; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const onRemove = (removeInvite: () => Promise): void => { const confirmRemove = async (): Promise => { diff --git a/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx b/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx index ee0027e8b2ba..073261594b69 100644 --- a/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx +++ b/apps/meteor/client/views/admin/oauthApps/EditOauthAppWithData.tsx @@ -1,5 +1,5 @@ import { Box, Button, ButtonGroup, Skeleton, Throbber, InputBox } from '@rocket.chat/fuselage'; -import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useCallback, useMemo } from 'react'; @@ -13,10 +13,18 @@ const EditOauthAppWithData = ({ _id, ...props }: { _id: string }): ReactElement const getOauthApps = useEndpoint('GET', '/v1/oauth-apps.get'); - const { data, isLoading, error, refetch } = useQuery(['oauth-apps', params], async () => { - const oauthApps = await getOauthApps(params); - return oauthApps; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, error, refetch } = useQuery( + ['oauth-apps', params], + async () => { + const oauthApps = await getOauthApps(params); + return oauthApps; + }, + { + onError: (error) => dispatchToastMessage({ type: 'error', message: error }), + }, + ); const onChange = useCallback(() => { refetch(); diff --git a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx index ae636a51e3fb..4c2de37eac07 100644 --- a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx +++ b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx @@ -1,5 +1,6 @@ import type { IRole, IRoom, IUserInRole } from '@rocket.chat/core-typings'; -import { useEndpoint } from '@rocket.chat/ui-contexts'; +import { useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useEffect, useMemo } from 'react'; @@ -23,6 +24,7 @@ const UsersInRoleTableWithData = ({ reloadRef, }: UsersInRoleTableWithDataProps): ReactElement | null => { const { itemsPerPage, current, ...paginationData } = usePagination(); + const t = useTranslation(); const query = useMemo( () => ({ @@ -36,20 +38,34 @@ const UsersInRoleTableWithData = ({ const getUsersInRole = useEndpoint('GET', '/v1/roles.getUsersInRole'); - const { refetch, ...result } = useQuery(['roles', roleId, 'users', query], async () => { - const users = await getUsersInRole(query); - return users; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { refetch, ...result } = useQuery( + ['roles', roleId, 'users', query], + async () => { + const { users } = await getUsersInRole(query); + + if (users.length === 0) { + dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + } + return users; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); useEffect(() => { reloadRef.current = refetch; }, [refetch, reloadRef]); - if (result.isLoading || result.error) { + if (result.isLoading || result.error || !result.data) { return null; } - const users: IUserInRole[] = result.data!.users.map((user) => ({ + const users: IUserInRole[] = result.data.map((user) => ({ ...user, createdAt: new Date(user.createdAt), _updatedAt: new Date(user._updatedAt), @@ -58,7 +74,7 @@ const UsersInRoleTableWithData = ({ return ( void }> = ({ rid, onReload }) => { const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms.getRoom'); - const { data, isLoading, error, refetch, isError } = useQuery(['rooms', rid, 'admin'], async () => { - const rooms = await getAdminRooms({ rid }); - return rooms; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, refetch } = useQuery( + ['rooms', rid, 'admin'], + async () => { + const rooms = await getAdminRooms({ rid }); + return rooms; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); if (isLoading) { return ( @@ -27,10 +37,6 @@ const EditRoomWithData: FC<{ rid?: string; onReload: () => void }> = ({ rid, onR ); } - if (isError) { - return <>{(error as Error).message}; - } - const handleChange = (): void => { refetch(); onReload(); diff --git a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx index e6669df94dd9..f14207e38b1c 100644 --- a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx +++ b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx @@ -1,7 +1,7 @@ import type { IRoom } from '@rocket.chat/core-typings'; import { Box, Table, Icon } from '@rocket.chat/fuselage'; import { useMediaQuery, useDebouncedValue } from '@rocket.chat/fuselage-hooks'; -import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { CSSProperties, ReactElement, MutableRefObject } from 'react'; import React, { useState, useEffect, useMemo, useCallback } from 'react'; @@ -90,7 +90,7 @@ const useDisplayData = (asyncState: any, sort: [string, 'asc' | 'desc']): IRoom[ return sort[1] === 'asc' ? result : result * -1; }); } - return data.rooms; + return data; }, [asyncState, sort]); const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): ReactElement => { @@ -114,10 +114,24 @@ const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): React const getAdminRooms = useEndpoint('GET', '/v1/rooms.adminRooms'); - const endpointData = useQuery(['rooms', query, 'admin'], async () => { - const adminRooms = await getAdminRooms(params); - return adminRooms; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const endpointData = useQuery( + ['rooms', query, 'admin'], + async () => { + const { rooms } = await getAdminRooms(params); + + if (rooms.length === 0) { + dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + } + return rooms; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const { data, refetch } = endpointData; @@ -252,7 +266,7 @@ const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): React header={header} renderRow={renderRow} results={displayData} - total={data?.total} + total={data?.length} params={params} setParams={setParams} renderFilter={({ onChange, ...props }): ReactElement => } diff --git a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx index 67c131bf255e..ae38bf911a34 100644 --- a/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx +++ b/apps/meteor/client/views/admin/users/AdminUserInfoWithData.tsx @@ -1,7 +1,7 @@ import type { IUser } from '@rocket.chat/core-typings'; import { Callout } from '@rocket.chat/fuselage'; import { useMutableCallback } from '@rocket.chat/fuselage-hooks'; -import { useSetting, useRolesDescription, useTranslation, useEndpoint } from '@rocket.chat/ui-contexts'; +import { useSetting, useRolesDescription, useTranslation, useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; @@ -29,10 +29,20 @@ const AdminUserInfoWithData = ({ uid, onReload }: AdminUserInfoWithDataProps): R const query = useMemo(() => ({ userId: uid }), [uid]); - const { data, isLoading, error, refetch } = useQuery(['users', query, 'admin'], async () => { - const usersInfo = await getUsersInfo(query); - return usersInfo; - }); + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, error, refetch } = useQuery( + ['users', query, 'admin'], + async () => { + const usersInfo = await getUsersInfo(query); + return usersInfo; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const onChange = useMutableCallback(() => { onReload(); diff --git a/apps/meteor/client/views/admin/users/EditUserWithData.tsx b/apps/meteor/client/views/admin/users/EditUserWithData.tsx index ae586f549dc6..377e11694e8b 100644 --- a/apps/meteor/client/views/admin/users/EditUserWithData.tsx +++ b/apps/meteor/client/views/admin/users/EditUserWithData.tsx @@ -1,7 +1,7 @@ import type { IUser } from '@rocket.chat/core-typings'; import { isUserFederated } from '@rocket.chat/core-typings'; import { Box, Callout } from '@rocket.chat/fuselage'; -import { useEndpoint, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement } from 'react'; import React, { useMemo } from 'react'; @@ -19,16 +19,26 @@ const EditUserWithData = ({ uid, onReload, ...props }: EditUserWithDataProps): R const getRoles = useEndpoint('GET', '/v1/roles.list'); + const dispatchToastMessage = useToastMessageDispatch(); + const query = useMemo(() => ({ userId: uid }), [uid]); const { data: roleData, isLoading: roleState, error: roleError, - } = useQuery(['roles'], async () => { - const roles = await getRoles(); - return roles; - }); + } = useQuery( + ['roles'], + async () => { + const roles = await getRoles(); + return roles; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); const getUsersInfo = useEndpoint('GET', '/v1/users.info'); diff --git a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx index 44b11ed19478..9a9ffe3b5596 100644 --- a/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx +++ b/apps/meteor/client/views/admin/users/UsersTable/UsersTable.tsx @@ -1,6 +1,6 @@ import { States, StatesIcon, StatesTitle, Pagination } from '@rocket.chat/fuselage'; import { useMediaQuery, useDebouncedValue, useMutableCallback } from '@rocket.chat/fuselage-hooks'; -import { useEndpoint, useRoute, useTranslation } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useRoute, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useMemo, useState, useEffect } from 'react'; @@ -58,10 +58,21 @@ const UsersTable = ({ reload }: UsersTableProps): ReactElement | null => { ); const getUsers = useEndpoint('GET', '/v1/users.list'); - const { data, isLoading, error, isSuccess, refetch } = useQuery(['users', query], async () => { - const users = await getUsers(query); - return users; - }); + + const dispatchToastMessage = useToastMessageDispatch(); + + const { data, isLoading, error, isSuccess, refetch } = useQuery( + ['users', query], + async () => { + const users = await getUsers(query); + return users; + }, + { + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + }, + ); useEffect(() => { reload.current = refetch; From 58599e52b6305169c0879b0358519f135c440782 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Thu, 12 Jan 2023 20:51:07 +0530 Subject: [PATCH 19/21] fix lint error --- .../UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx index 4c2de37eac07..c3d51617daf7 100644 --- a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx +++ b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx @@ -1,6 +1,5 @@ import type { IRole, IRoom, IUserInRole } from '@rocket.chat/core-typings'; -import { useTranslation } from '@rocket.chat/ui-contexts'; -import { useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts'; +import { useEndpoint, useToastMessageDispatch, useTranslation } from '@rocket.chat/ui-contexts'; import { useQuery } from '@tanstack/react-query'; import type { ReactElement, MutableRefObject } from 'react'; import React, { useEffect, useMemo } from 'react'; From ee2259c7c469ee433a07d9cd31c815e06edda464 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 16 Jan 2023 11:43:40 +0530 Subject: [PATCH 20/21] change function return type --- .../client/views/admin/customSounds/EditCustomSound.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index 716d324fd474..1c2ccbca4fc8 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -12,7 +12,7 @@ type EditCustomSoundProps = { close?: () => void; }; -function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): ReactElement { +function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): ReactElement | null { const t = useTranslation(); const getSounds = useEndpoint('GET', '/v1/custom-sounds.list'); @@ -60,7 +60,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea } if (!data) { - return <>; + return null; } const handleChange: () => void = () => { From 5f8873cd4cb24511d1748125c7e2abd188eaace3 Mon Sep 17 00:00:00 2001 From: Dnouv Date: Mon, 16 Jan 2023 11:53:56 +0530 Subject: [PATCH 21/21] use throw error in place of dispatching new toastmessage --- .../admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx | 2 +- .../client/views/admin/customSounds/CustomSoundsRoute.tsx | 2 +- apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx | 2 +- .../UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx | 2 +- apps/meteor/client/views/admin/rooms/RoomsTable.tsx | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx index 3747086bae2e..96d04a134893 100644 --- a/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx +++ b/apps/meteor/client/views/admin/apps/AppDetailsPage/tabs/AppReleases/AppReleases.tsx @@ -20,7 +20,7 @@ const AppReleases = ({ id }: { id: App['id'] }): ReactElement => { const { apps } = await getVersions(); if (apps.length === 0) { - dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + throw new Error(t('No_results_found')); } return apps; }, diff --git a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx index 54a8aa25776a..ea9fd1a553fc 100644 --- a/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx +++ b/apps/meteor/client/views/admin/customSounds/CustomSoundsRoute.tsx @@ -54,7 +54,7 @@ const CustomSoundsRoute = (): ReactElement => { const { sounds } = await getSounds(query); if (sounds.length === 0) { - dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + throw new Error(t('No_results_found')); } return sounds; }, diff --git a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx index 1c2ccbca4fc8..aabfc37c2412 100644 --- a/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx +++ b/apps/meteor/client/views/admin/customSounds/EditCustomSound.tsx @@ -24,7 +24,7 @@ function EditCustomSound({ _id, onChange, ...props }: EditCustomSoundProps): Rea const { sounds } = await getSounds({ query: JSON.stringify({ _id }) }); if (sounds.length === 0) { - dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + throw new Error(t('No_results_found')); } return sounds[0]; }, diff --git a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx index c3d51617daf7..a7fe837b6e72 100644 --- a/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx +++ b/apps/meteor/client/views/admin/permissions/UsersInRole/UsersInRoleTable/UsersInRoleTableWithData.tsx @@ -45,7 +45,7 @@ const UsersInRoleTableWithData = ({ const { users } = await getUsersInRole(query); if (users.length === 0) { - dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + throw new Error(t('No_results_found')); } return users; }, diff --git a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx index f14207e38b1c..f7d7916d6bdd 100644 --- a/apps/meteor/client/views/admin/rooms/RoomsTable.tsx +++ b/apps/meteor/client/views/admin/rooms/RoomsTable.tsx @@ -122,7 +122,7 @@ const RoomsTable = ({ reload }: { reload: MutableRefObject<() => void> }): React const { rooms } = await getAdminRooms(params); if (rooms.length === 0) { - dispatchToastMessage({ type: 'error', message: t('No_results_found') }); + throw new Error(t('No_results_found')); } return rooms; },