diff --git a/src/features/alerts/hooks/use-query-get-workspace-alerts-malicious-pkg.ts b/src/features/alerts/hooks/use-query-get-workspace-alerts-malicious-pkg.ts index d487747e..ecb44d84 100644 --- a/src/features/alerts/hooks/use-query-get-workspace-alerts-malicious-pkg.ts +++ b/src/features/alerts/hooks/use-query-get-workspace-alerts-malicious-pkg.ts @@ -1,9 +1,19 @@ +import { + AlertConversation, + V1GetWorkspaceAlertsResponse, +} from "@/api/generated"; import { filterAlertsCritical } from "../lib/filter-alerts-critical"; import { isAlertMalicious } from "../lib/is-alert-malicious"; import { useQueryGetWorkspaceAlerts } from "./use-query-get-workspace-alerts"; +// NOTE: This needs to be a stable function reference to enable memo-isation of +// the select operation on each React re-render. +function select(data: V1GetWorkspaceAlertsResponse): AlertConversation[] { + return filterAlertsCritical(data).filter(isAlertMalicious); +} + export function useQueryGetWorkspaceAlertsMaliciousPkg() { return useQueryGetWorkspaceAlerts({ - select: (data) => filterAlertsCritical(data).filter(isAlertMalicious), + select, }); } diff --git a/src/features/alerts/hooks/use-query-get-workspace-alerts-secrets.ts b/src/features/alerts/hooks/use-query-get-workspace-alerts-secrets.ts index 2535fc8c..ee5b7a47 100644 --- a/src/features/alerts/hooks/use-query-get-workspace-alerts-secrets.ts +++ b/src/features/alerts/hooks/use-query-get-workspace-alerts-secrets.ts @@ -1,9 +1,19 @@ +import { + V1GetWorkspaceAlertsResponse, + AlertConversation, +} from "@/api/generated"; import { filterAlertsCritical } from "../lib/filter-alerts-critical"; import { isAlertSecret } from "../lib/is-alert-secret"; import { useQueryGetWorkspaceAlerts } from "./use-query-get-workspace-alerts"; +// NOTE: This needs to be a stable function reference to enable memo-isation of +// the select operation on each React re-render. +function select(data: V1GetWorkspaceAlertsResponse): AlertConversation[] { + return filterAlertsCritical(data).filter(isAlertSecret); +} + export function useQueryGetWorkspaceAlertSecrets() { return useQueryGetWorkspaceAlerts({ - select: (data) => filterAlertsCritical(data).filter(isAlertSecret), + select, }); } diff --git a/src/features/workspace/hooks/use-active-workspace-name.ts b/src/features/workspace/hooks/use-active-workspace-name.ts index ab365f59..85eddfd4 100644 --- a/src/features/workspace/hooks/use-active-workspace-name.ts +++ b/src/features/workspace/hooks/use-active-workspace-name.ts @@ -1,7 +1,14 @@ +import { ListActiveWorkspacesResponse } from "@/api/generated"; import { useActiveWorkspaces } from "./use-active-workspaces"; +// NOTE: This needs to be a stable function reference to enable memo-isation of +// the select operation on each React re-render. +function select(data: ListActiveWorkspacesResponse | undefined): string | null { + return data?.workspaces?.[0]?.name ?? null; +} + export function useActiveWorkspaceName() { return useActiveWorkspaces({ - select: (d) => d?.workspaces?.[0]?.name ?? null, + select, }); } diff --git a/src/hooks/useAlertsData.ts b/src/hooks/useAlertsData.ts index 3b82e37a..b2e966ad 100644 --- a/src/hooks/useAlertsData.ts +++ b/src/hooks/useAlertsData.ts @@ -52,6 +52,8 @@ export const useFilteredAlerts = () => { const { isMaliciousFilterActive, search } = useAlertSearch(); return useAlertsData({ + // NOTE: Inlined select will run on every render, we'll remove this over + // time though - AMG select: ( data: Exclude["data"], undefined>, ) => { diff --git a/src/hooks/usePromptsData.ts b/src/hooks/usePromptsData.ts index c841078e..6978bf93 100644 --- a/src/hooks/usePromptsData.ts +++ b/src/hooks/usePromptsData.ts @@ -7,13 +7,13 @@ import { import { v1GetWorkspaceMessagesOptions } from "@/api/generated/@tanstack/react-query.gen"; import { useActiveWorkspaceName } from "@/features/workspace/hooks/use-active-workspace-name"; -const selectConversations = ( - data: V1GetWorkspaceMessagesResponse, -): Conversation[] => { +// NOTE: This needs to be a stable function reference to enable memo-isation of +// the select operation on each React re-render. +function select(data: V1GetWorkspaceMessagesResponse): Conversation[] { return data.filter((prompt) => prompt.question_answers?.every((item) => item.answer && item.question), ); -}; +} export const usePromptsData = () => { const { data: activeWorkspaceName } = useActiveWorkspaceName(); @@ -26,6 +26,6 @@ export const usePromptsData = () => { return useQuery({ ...v1GetWorkspaceMessagesOptions(options), - select: selectConversations, + select: select, }); };