Skip to content
This repository was archived by the owner on Jul 3, 2023. It is now read-only.

Commit 2ab91c3

Browse files
gzgz
committed
Add onError handler in queries where its missing.
1 parent 9982a8f commit 2ab91c3

File tree

13 files changed

+70
-52
lines changed

13 files changed

+70
-52
lines changed

‎web-ui/src/analytics/TableSqlPrograms.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ const TableSqlPrograms = () => {
6969
{
7070
onError: (error: CancelError) => {
7171
queryClient.invalidateQueries(['project'])
72-
queryClient.invalidateQueries(['projectStatus', {project_id: newRow.project_id}])
72+
queryClient.invalidateQueries(['projectStatus', { project_id: newRow.project_id }])
7373
pushMessage({ message: error.message, key: new Date().getTime(), color: 'error' })
7474
apiRef.current.updateRows([oldRow])
7575
}

‎web-ui/src/analytics/editor.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -305,7 +305,9 @@ const useCompileProjectIfChanged = (
305305
const queryClient = useQueryClient()
306306
const { pushMessage } = useStatusNotification()
307307

308-
const { mutate, isLoading, isError } = useMutation<CompileProjectRequest, CancelError, any>(ProjectService.compileProject)
308+
const { mutate, isLoading, isError } = useMutation<CompileProjectRequest, CancelError, any>(
309+
ProjectService.compileProject
310+
)
309311
useEffect(() => {
310312
if (
311313
!isLoading &&
@@ -355,7 +357,7 @@ const usePollCompilationStatus = (
355357
) => {
356358
const queryClient = useQueryClient()
357359
const compilationStatus = useQuery<ProjectDescr>({
358-
queryKey: ['projectStatus', { project_id: project.project_id } ],
360+
queryKey: ['projectStatus', { project_id: project.project_id }],
359361
refetchInterval: data =>
360362
data === undefined || data.status === 'Pending' || data.status === 'CompilingSql' ? 1000 : false,
361363
enabled: project.project_id !== null && (project.status === 'Pending' || project.status === 'CompilingSql')

‎web-ui/src/connectors/DataSourceTable.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ const DataSourceTable = () => {
4242
{
4343
onSettled: () => {
4444
queryClient.invalidateQueries(['connector'])
45-
queryClient.invalidateQueries(['connectorStatus', {connector_id: newRow.connector_id}])
45+
queryClient.invalidateQueries(['connectorStatus', { connector_id: newRow.connector_id }])
4646
},
4747
onError: (error: CancelError) => {
4848
pushMessage({ message: error.message, key: new Date().getTime(), color: 'error' })

‎web-ui/src/connectors/dialogs/SubmitHandler.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export const ConnectorFormUpdateRequest = <TData extends FieldValues>(
7272
updateConnector(source_desc, {
7373
onSettled: () => {
7474
queryClient.invalidateQueries(['connector'])
75-
queryClient.invalidateQueries(['connectorStatus', {connector_id: source_desc.connector_id}])
75+
queryClient.invalidateQueries(['connectorStatus', { connector_id: source_desc.connector_id }])
7676
},
7777
onSuccess: () => {
7878
pushMessage({ message: 'Connector updated successfully!', key: new Date().getTime(), color: 'success' })

‎web-ui/src/pages/_app.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,9 @@ if (themeConfig.routingLoader) {
4343
const queryClient = new QueryClient({
4444
defaultOptions: {
4545
queries: {
46-
queryFn: defaultQueryFn,
47-
},
48-
},
46+
queryFn: defaultQueryFn
47+
}
48+
}
4949
})
5050

5151
const App = (props: ExtendedAppProps) => {

‎web-ui/src/pages/streaming/builder/index.tsx

Lines changed: 26 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,17 @@ import { useBuilderState } from 'src/streaming/builder/useBuilderState'
1111
import { Dispatch, SetStateAction, useEffect, useState } from 'react'
1212
import {
1313
AttachedConnector,
14+
CancelError,
1415
ConfigDescr,
1516
ConfigId,
1617
ConfigService,
1718
ConnectorDescr,
1819
Direction,
20+
NewConfigRequest,
1921
NewConfigResponse,
2022
ProjectDescr,
23+
UpdateConfigRequest,
24+
UpdateConfigResponse
2125
} from 'src/types/manager'
2226
import { useMutation, useQuery } from '@tanstack/react-query'
2327
import { ReactFlowProvider, useReactFlow } from 'reactflow'
@@ -27,6 +31,7 @@ import { useReplacePlaceholder } from 'src/streaming/builder/hooks/useSqlPlaceho
2731
import { projectToProjectWithSchema } from 'src/types/program'
2832
import { useAddConnector } from 'src/streaming/builder/hooks/useAddIoNode'
2933
import MissingSchemaDialog from 'src/streaming/builder/NoSchemaDialog'
34+
import useStatusNotification from 'src/components/errors/useStatusNotification'
3035

3136
const stateToSaveLabel = (state: SaveIndicatorState): string =>
3237
match(state)
@@ -71,16 +76,20 @@ export const PipelineWithProvider = (props: {
7176

7277
const { getNode, getEdges } = useReactFlow()
7378

74-
const { mutate: newConfigMutate } = useMutation(ConfigService.newConfig)
75-
const { mutate: updateConfigMutate } = useMutation(ConfigService.updateConfig)
79+
const { mutate: newConfigMutate } = useMutation<NewConfigResponse, CancelError, NewConfigRequest>(
80+
ConfigService.newConfig
81+
)
82+
const { mutate: updateConfigMutate } = useMutation<UpdateConfigResponse, CancelError, UpdateConfigRequest>(
83+
ConfigService.updateConfig
84+
)
7685
const replacePlaceholder = useReplacePlaceholder()
7786
const addConnector = useAddConnector()
7887

88+
const { pushMessage } = useStatusNotification()
7989
const projects = useQuery<ProjectDescr[]>(['project'])
8090
const connectorQuery = useQuery<ConnectorDescr[]>(['connector'])
81-
const configQuery = useQuery<ConfigDescr>(['configStatus', { config_id: configId }],
82-
{
83-
enabled:
91+
const configQuery = useQuery<ConfigDescr>(['configStatus', { config_id: configId }], {
92+
enabled:
8493
configId !== undefined && saveState !== 'isSaving' && saveState !== 'isModified' && saveState !== 'isDebouncing'
8594
})
8695
useEffect(() => {
@@ -109,8 +118,7 @@ export const PipelineWithProvider = (props: {
109118
if (foundProject) {
110119
if (foundProject.schema == null) {
111120
setMissingSchemaDialog(true)
112-
}
113-
else {
121+
} else {
114122
setMissingSchemaDialog(false)
115123
}
116124

@@ -185,7 +193,8 @@ export const PipelineWithProvider = (props: {
185193
config
186194
},
187195
{
188-
onError: error => {
196+
onError: (error: CancelError) => {
197+
pushMessage({ message: error.message, key: new Date().getTime(), color: 'error' })
189198
setSaveState('isUpToDate')
190199
console.log('error', error)
191200
},
@@ -224,11 +233,9 @@ export const PipelineWithProvider = (props: {
224233
connectors
225234
}
226235

227-
console.log('updateRequest', updateRequest)
228-
229236
updateConfigMutate(updateRequest, {
230-
onError: error => {
231-
console.log('error', error)
237+
onError: (error: CancelError) => {
238+
pushMessage({ message: error.message, key: new Date().getTime(), color: 'error' })
232239
setSaveState('isUpToDate')
233240
},
234241
onSuccess: () => {
@@ -250,7 +257,8 @@ export const PipelineWithProvider = (props: {
250257
description,
251258
config,
252259
getNode,
253-
getEdges
260+
getEdges,
261+
pushMessage
254262
])
255263

256264
return (
@@ -277,7 +285,11 @@ export const PipelineWithProvider = (props: {
277285
<PipelineGraph />
278286
</div>
279287
</Grid>
280-
<MissingSchemaDialog open={missingSchemaDialog} setOpen={setMissingSchemaDialog} project_id={project?.project_id} />
288+
<MissingSchemaDialog
289+
open={missingSchemaDialog}
290+
setOpen={setMissingSchemaDialog}
291+
project_id={project?.project_id}
292+
/>
281293
</>
282294
)
283295
}

‎web-ui/src/pages/streaming/introspection/[config]/[view].tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@ const IntrospectInputOutput = () => {
1919
const router = useRouter()
2020
const { config, view } = router.query
2121

22-
const projectQuery = useQuery<ProjectDescr>(['projectStatus', {project_id: configDescr?.project_id}],
23-
{ enabled: configDescr !== undefined && configDescr.project_id !== undefined
22+
const projectQuery = useQuery<ProjectDescr>(['projectStatus', { project_id: configDescr?.project_id }], {
23+
enabled: configDescr !== undefined && configDescr.project_id !== undefined
2424
})
2525
useEffect(() => {
2626
if (!projectQuery.isLoading && !projectQuery.isError && viewName) {
@@ -52,7 +52,7 @@ const IntrospectInputOutput = () => {
5252
}
5353
}, [configId, setConfigId, config, view, setViewName])
5454

55-
const configQuery = useQuery<ConfigDescr>(['configStatus', {config_id: configId}], {
55+
const configQuery = useQuery<ConfigDescr>(['configStatus', { config_id: configId }], {
5656
enabled: configId !== undefined
5757
})
5858
useEffect(() => {

‎web-ui/src/streaming/PipelineTable.tsx

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -52,10 +52,9 @@ interface ConnectorData {
5252
const DetailPanelContent = (props: { row: ConfigDescr }) => {
5353
const [inputs, setInputs] = useState<ConnectorData[]>([])
5454
const [outputs, setOutputs] = useState<ConnectorData[]>([])
55-
const projectQuery = useQuery<ProjectDescr>(
56-
['projectStatus', {project_id: props.row.project_id}],
57-
{ enabled: props.row.project_id !== undefined }
58-
)
55+
const projectQuery = useQuery<ProjectDescr>(['projectStatus', { project_id: props.row.project_id }], {
56+
enabled: props.row.project_id !== undefined
57+
})
5958

6059
const connectorQuery = useQuery<ConnectorDescr[]>(['connector'])
6160
useEffect(() => {
@@ -88,8 +87,7 @@ const DetailPanelContent = (props: { row: ConfigDescr }) => {
8887
const [globalMetrics, setGlobalMetrics] = useState<GlobalMetrics[]>([])
8988
const [inputMetrics, setInputMetrics] = useState<Map<string, InputConnectorMetrics>>(new Map())
9089
const [outputMetrics, setOutputMetrics] = useState<Map<string, OutputConnectorMetrics>>(new Map())
91-
const pipelineStatusQuery = useQuery<any>(['pipelineStatus', {pipeline_id: props.row.pipeline?.pipeline_id}],
92-
{
90+
const pipelineStatusQuery = useQuery<any>(['pipelineStatus', { pipeline_id: props.row.pipeline?.pipeline_id }], {
9391
enabled: props.row.pipeline !== undefined && props.row.pipeline !== null,
9492
refetchInterval: 1000
9593
})
@@ -386,7 +384,7 @@ export default function PipelineTable() {
386384
startPipelineMutate(resp.pipeline_id, {
387385
onSettled: () => {
388386
queryClient.invalidateQueries(['configs'])
389-
queryClient.invalidateQueries(['configStatus', {config_id: curRow.config_id}])
387+
queryClient.invalidateQueries(['configStatus', { config_id: curRow.config_id }])
390388
},
391389
onSuccess: () => {
392390
setIsLaunching(map => new Map(map.set(curRow.config_id, PipelineStatus.RUNNING)))
@@ -399,7 +397,7 @@ export default function PipelineTable() {
399397
},
400398
onSettled: () => {
401399
queryClient.invalidateQueries(['configs'])
402-
queryClient.invalidateQueries(['configStatus', {config_id: curRow.config_id}])
400+
queryClient.invalidateQueries(['configStatus', { config_id: curRow.config_id }])
403401
},
404402
onError: error => {
405403
pushMessage({ message: error.message, key: new Date().getTime(), color: 'error' })
@@ -413,7 +411,7 @@ export default function PipelineTable() {
413411
startPipelineMutate(curRow.pipeline.pipeline_id, {
414412
onSettled: () => {
415413
queryClient.invalidateQueries(['configs'])
416-
queryClient.invalidateQueries(['configStatus', {config_id: curRow.config_id}])
414+
queryClient.invalidateQueries(['configStatus', { config_id: curRow.config_id }])
417415
},
418416
onSuccess: () => {
419417
setIsLaunching(map => new Map(map.set(curRow.config_id, PipelineStatus.RUNNING)))
@@ -446,7 +444,7 @@ export default function PipelineTable() {
446444
pausePipelineMutate(curRow.pipeline.pipeline_id, {
447445
onSettled: () => {
448446
queryClient.invalidateQueries(['configs'])
449-
queryClient.invalidateQueries(['configStatus', {config_id: curRow.config_id}])
447+
queryClient.invalidateQueries(['configStatus', { config_id: curRow.config_id }])
450448
},
451449
onSuccess: () => {
452450
setIsLaunching(map => new Map(map.set(curRow.config_id, PipelineStatus.PAUSED)))
@@ -475,7 +473,7 @@ export default function PipelineTable() {
475473
{
476474
onSettled: () => {
477475
queryClient.invalidateQueries(['configs'])
478-
queryClient.invalidateQueries(['configStatus', {config_id: curRow.config_id}])
476+
queryClient.invalidateQueries(['configStatus', { config_id: curRow.config_id }])
479477
},
480478
onSuccess: () => {
481479
setIsLaunching(map => new Map(map.set(curRow.config_id, PipelineStatus.UNUSED)))

‎web-ui/src/streaming/builder/NoSchemaDialog.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,11 @@ import DialogContent from '@mui/material/DialogContent'
77
import DialogActions from '@mui/material/DialogActions'
88
import DialogContentText from '@mui/material/DialogContentText'
99

10-
const MissingSchemaDialog = (props: { open: boolean; setOpen: Dispatch<SetStateAction<boolean>>, project_id: number | undefined }) => {
10+
const MissingSchemaDialog = (props: {
11+
open: boolean
12+
setOpen: Dispatch<SetStateAction<boolean>>
13+
project_id: number | undefined
14+
}) => {
1115
const router = useRouter()
1216
const handleClose = () => {
1317
props.setOpen(false)

‎web-ui/src/streaming/builder/NodeTypes/InputNode.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ const InputNode = ({ id, data }: NodeProps) => {
2020

2121
// Fetch the connector data for the corresponding ac.connector_id
2222
const [connector, setConnector] = useState<ConnectorDescr | undefined>(undefined)
23-
const connectorQuery = useQuery(['connector', { connector_id: data.ac.connector_id }], () =>
23+
const connectorQuery = useQuery(['connector', { connector_id: data.ac.connector_id }], () =>
2424
ConnectorService.connectorStatus(data.ac.connector_id)
2525
)
2626
useEffect(() => {

‎web-ui/src/streaming/builder/NodeTypes/OutputNode.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const OutputNode = ({ id, data }: NodeProps) => {
2121

2222
// Fetch the connector data for the corresponding ac.connector_id
2323
const [connector, setConnector] = useState<ConnectorDescr | undefined>(undefined)
24-
const connectorQuery = useQuery<ConnectorDescr>(['connectorStatus', { connector_id: data.ac.connector_id }])
24+
const connectorQuery = useQuery<ConnectorDescr>(['connectorStatus', { connector_id: data.ac.connector_id }])
2525
useEffect(() => {
2626
if (!connectorQuery.isError && !connectorQuery.isLoading) {
2727
setConnector(connectorQuery.data)

‎web-ui/src/streaming/builder/hooks/useSqlPlaceholderClick.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,15 @@ import { useCallback } from 'react'
1111
// Replaces the program placeholder node with a sqlProgram node
1212
export function useReplacePlaceholder() {
1313
const { getNode, deleteElements, addNodes } = useReactFlow()
14-
const updateNodeInternals = useUpdateNodeInternals();
14+
const updateNodeInternals = useUpdateNodeInternals()
1515

1616
const replacePlaceholder = useCallback(
1717
(program: ProjectWithSchema) => {
1818
const parentNode = getNode('sql')
1919
if (!parentNode) {
2020
return
2121
}
22-
deleteElements({nodes: [parentNode]})
22+
deleteElements({ nodes: [parentNode] })
2323
addNodes({
2424
...parentNode,
2525
type: 'sqlProgram',
@@ -53,7 +53,7 @@ export function useSqlPlaceholderClick(id: NodeProps['id']) {
5353
const configId = null
5454
if (configId) {
5555
// TODO: figure out if it's better to optimistically update query here?
56-
queryClient.setQueryData(['configStatus', {config_id: configId}], (oldData: ConfigDescr | undefined) => {
56+
queryClient.setQueryData(['configStatus', { config_id: configId }], (oldData: ConfigDescr | undefined) => {
5757
return oldData ? { ...oldData, project_id: project.project_id } : oldData
5858
})
5959
}

‎web-ui/src/types/defaultQueryFn.ts

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,32 @@
11
// Define a default query function that will receive the query key
22
// and decide what API to call based on the query key.
33

4-
import { QueryFunctionContext } from "@tanstack/react-query";
5-
import { match, P } from "ts-pattern"
4+
import { QueryFunctionContext } from '@tanstack/react-query'
5+
import { match, P } from 'ts-pattern'
66

7-
import { ConfigService, ConnectorService, PipelineService, ProjectService } from "./manager";
7+
import { ConfigService, ConnectorService, PipelineService, ProjectService } from './manager'
88

99
export const defaultQueryFn = async (context: QueryFunctionContext) => {
1010
return match(context.queryKey)
11-
.with(['projectCode', { project_id: P.select() }], (project_id) => {
11+
.with(['projectCode', { project_id: P.select() }], project_id => {
1212
if (typeof project_id == 'number') return ProjectService.projectCode(project_id)
1313
})
14-
.with(['projectStatus', { project_id: P.select() }], (project_id) => {
14+
.with(['projectStatus', { project_id: P.select() }], project_id => {
1515
if (typeof project_id == 'number') return ProjectService.projectStatus(project_id)
1616
})
17-
.with(['configStatus', { config_id: P.select() }], (config_id) => {
17+
.with(['configStatus', { config_id: P.select() }], config_id => {
1818
if (typeof config_id == 'number') return ConfigService.configStatus(config_id)
1919
})
20-
.with(['pipelineStatus', { pipeline_id: P.select() }], (pipeline_id) => {
20+
.with(['pipelineStatus', { pipeline_id: P.select() }], pipeline_id => {
2121
if (typeof pipeline_id == 'number') return PipelineService.pipelineStatus(pipeline_id)
2222
})
23-
.with(['connectorStatus', { connector_id: P.select() }], (connector_id) => {
23+
.with(['connectorStatus', { connector_id: P.select() }], connector_id => {
2424
if (typeof connector_id == 'number') return ConnectorService.connectorStatus(connector_id)
2525
})
2626
.with(['project'], () => ProjectService.listProjects())
2727
.with(['connector'], () => ConnectorService.listConnectors())
2828
.with(['configs'], () => ConfigService.listConfigs())
29-
.otherwise(() => {throw new Error('Invalid query key, maybe you need to update defaultQueryFn.ts')});
30-
}
29+
.otherwise(() => {
30+
throw new Error('Invalid query key, maybe you need to update defaultQueryFn.ts')
31+
})
32+
}

0 commit comments

Comments
 (0)