GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-16 18:05:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: handle alert list updates

Browse Source
This commit is contained in:
Yunus M 2025-05-31 13:32:55 +05:30
parent 68effaf232
commit 203c050ac1
2 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/container/AllAlertChannels/AlertChannels.tsx
View File

@ -7,7 +7,7 @@ import useComponentPermission from 'hooks/useComponentPermission';
import { useNotifications } from 'hooks/useNotifications'; import { useNotifications } from 'hooks/useNotifications';
import history from 'lib/history'; import history from 'lib/history';
import { useAppContext } from 'providers/App/App'; import { useAppContext } from 'providers/App/App';
import { useCallback, useState } from 'react'; import { useCallback } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { generatePath } from 'react-router-dom'; import { generatePath } from 'react-router-dom';
import { Channels } from 'types/api/channels/getAll'; import { Channels } from 'types/api/channels/getAll';
@ -17,7 +17,6 @@ import Delete from './Delete';
function AlertChannels({ allChannels }: AlertChannelsProps): JSX.Element { function AlertChannels({ allChannels }: AlertChannelsProps): JSX.Element {
const { t } = useTranslation(['channels']); const { t } = useTranslation(['channels']);
const { notifications } = useNotifications(); const { notifications } = useNotifications();
const [channels, setChannels] = useState<Channels[]>(allChannels);
const { user } = useAppContext(); const { user } = useAppContext();
const [action] = useComponentPermission(['new_alert_action'], user.role); const [action] = useComponentPermission(['new_alert_action'], user.role);
@ -56,14 +55,19 @@ function AlertChannels({ allChannels }: AlertChannelsProps): JSX.Element {
<Button onClick={(): void => onClickEditHandler(id)} type="link"> <Button onClick={(): void => onClickEditHandler(id)} type="link">
{t('column_channel_edit')} {t('column_channel_edit')}
</Button> </Button>
<Delete id={id} setChannels={setChannels} notifications={notifications} /> <Delete id={id} notifications={notifications} />
</> </>
), ),
}); });
} }
return ( return (
<ResizeTable columns={columns} dataSource={channels} rowKey="id" bordered /> <ResizeTable
columns={columns}
dataSource={allChannels}
rowKey="id"
bordered
/>
); );
} }

11
frontend/src/container/AllAlertChannels/Delete.tsx
View File

@ -1,14 +1,15 @@
import { Button } from 'antd'; import { Button } from 'antd';
import { NotificationInstance } from 'antd/es/notification/interface'; import { NotificationInstance } from 'antd/es/notification/interface';
import deleteChannel from 'api/channels/delete'; import deleteChannel from 'api/channels/delete';
import { Dispatch, SetStateAction, useState } from 'react'; import { useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Channels } from 'types/api/channels/getAll'; import { useQueryClient } from 'react-query';
import APIError from 'types/api/error'; import APIError from 'types/api/error';
function Delete({ notifications, setChannels, id }: DeleteProps): JSX.Element { function Delete({ notifications, id }: DeleteProps): JSX.Element {
const { t } = useTranslation(['channels']); const { t } = useTranslation(['channels']);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const queryClient = useQueryClient();
const onClickHandler = async (): Promise<void> => { const onClickHandler = async (): Promise<void> => {
try { try {
@ -21,7 +22,8 @@ function Delete({ notifications, setChannels, id }: DeleteProps): JSX.Element {
message: 'Success', message: 'Success',
description: t('channel_delete_success'), description: t('channel_delete_success'),
}); });
setChannels((preChannels) => preChannels.filter((e) => e.id !== id)); // Invalidate and refetch
queryClient.invalidateQueries(['getChannels']);
setLoading(false); setLoading(false);
} catch (error) { } catch (error) {
notifications.error({ notifications.error({
@ -46,7 +48,6 @@ function Delete({ notifications, setChannels, id }: DeleteProps): JSX.Element {
interface DeleteProps { interface DeleteProps {
notifications: NotificationInstance; notifications: NotificationInstance;
setChannels: Dispatch<SetStateAction<Channels[]>>;
id: string; id: string;
} }