From 2a7c2ac0ea1ac60428a3a9a76cc7616b16447b48 Mon Sep 17 00:00:00 2001 From: Charlie Park Date: Mon, 9 Sep 2024 11:43:11 -0700 Subject: [PATCH 1/2] Use renamed functions in place of raw useApiMutation object --- app/pages/system/SiloImagesPage.tsx | 4 ++-- app/pages/system/networking/IpPoolPage.tsx | 8 ++++---- app/pages/system/networking/IpPoolsPage.tsx | 4 ++-- app/pages/system/silos/SiloIpPoolsTab.tsx | 10 +++++----- app/pages/system/silos/SilosPage.tsx | 4 ++-- 5 files changed, 15 insertions(+), 15 deletions(-) diff --git a/app/pages/system/SiloImagesPage.tsx b/app/pages/system/SiloImagesPage.tsx index c8f92d593..88ac4f12d 100644 --- a/app/pages/system/SiloImagesPage.tsx +++ b/app/pages/system/SiloImagesPage.tsx @@ -70,7 +70,7 @@ export function SiloImagesPage() { const [demoteImage, setDemoteImage] = useState(null) const queryClient = useApiQueryClient() - const deleteImage = useApiMutation('imageDelete', { + const { mutateAsync: deleteImage } = useApiMutation('imageDelete', { onSuccess(_data, variables) { addToast({ content: `${variables.path.image} has been deleted` }) queryClient.invalidateQueries('imageList') @@ -86,7 +86,7 @@ export function SiloImagesPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deleteImage.mutateAsync({ path: { image: image.name } }), + doDelete: () => deleteImage({ path: { image: image.name } }), label: image.name, }), }, diff --git a/app/pages/system/networking/IpPoolPage.tsx b/app/pages/system/networking/IpPoolPage.tsx index a0b0350a4..100e81459 100644 --- a/app/pages/system/networking/IpPoolPage.tsx +++ b/app/pages/system/networking/IpPoolPage.tsx @@ -189,7 +189,7 @@ function IpRangesTable() { const { Table } = useQueryTable('ipPoolRangeList', { path: { pool } }) const queryClient = useApiQueryClient() - const removeRange = useApiMutation('ipPoolRangeRemove', { + const { mutateAsync: removeRange } = useApiMutation('ipPoolRangeRemove', { onSuccess() { queryClient.invalidateQueries('ipPoolRangeList') queryClient.invalidateQueries('ipPoolUtilizationView') @@ -213,7 +213,7 @@ function IpRangesTable() { onActivate: () => confirmAction({ doAction: () => - removeRange.mutateAsync({ + removeRange({ path: { pool }, body: range, }), @@ -281,7 +281,7 @@ function LinkedSilosTable() { const queryClient = useApiQueryClient() const { Table } = useQueryTable('ipPoolSiloList', { path: poolSelector }) - const unlinkSilo = useApiMutation('ipPoolSiloUnlink', { + const { mutateAsync: unlinkSilo } = useApiMutation('ipPoolSiloUnlink', { onSuccess() { queryClient.invalidateQueries('ipPoolSiloList') }, @@ -295,7 +295,7 @@ function LinkedSilosTable() { onActivate() { confirmAction({ doAction: () => - unlinkSilo.mutateAsync({ path: { silo: link.siloId, pool: link.ipPoolId } }), + unlinkSilo({ path: { silo: link.siloId, pool: link.ipPoolId } }), modalTitle: 'Confirm unlink silo', // Would be nice to reference the silo by name like we reference the // pool by name on unlink in the silo pools list, but it's a pain to diff --git a/app/pages/system/networking/IpPoolsPage.tsx b/app/pages/system/networking/IpPoolsPage.tsx index 02792b4ba..b10c7288a 100644 --- a/app/pages/system/networking/IpPoolsPage.tsx +++ b/app/pages/system/networking/IpPoolsPage.tsx @@ -77,7 +77,7 @@ export function IpPoolsPage() { query: { limit: PAGE_SIZE }, }) - const deletePool = useApiMutation('ipPoolDelete', { + const { mutateAsync: deletePool } = useApiMutation('ipPoolDelete', { onSuccess() { apiQueryClient.invalidateQueries('ipPoolList') addToast({ content: 'IP pool deleted' }) @@ -98,7 +98,7 @@ export function IpPoolsPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deletePool.mutateAsync({ path: { pool: pool.name } }), + doDelete: () => deletePool({ path: { pool: pool.name } }), label: pool.name, }), }, diff --git a/app/pages/system/silos/SiloIpPoolsTab.tsx b/app/pages/system/silos/SiloIpPoolsTab.tsx index 3c2f3e42b..0218d7ee7 100644 --- a/app/pages/system/silos/SiloIpPoolsTab.tsx +++ b/app/pages/system/silos/SiloIpPoolsTab.tsx @@ -70,12 +70,12 @@ export function SiloIpPoolsTab() { [allPools] ) - const updatePoolLink = useApiMutation('ipPoolSiloUpdate', { + const { mutateAsync: updatePoolLink } = useApiMutation('ipPoolSiloUpdate', { onSuccess() { queryClient.invalidateQueries('siloIpPoolList') }, }) - const unlinkPool = useApiMutation('ipPoolSiloUnlink', { + const { mutateAsync: unlinkPool } = useApiMutation('ipPoolSiloUnlink', { onSuccess() { queryClient.invalidateQueries('siloIpPoolList') }, @@ -91,7 +91,7 @@ export function SiloIpPoolsTab() { if (pool.isDefault) { confirmAction({ doAction: () => - updatePoolLink.mutateAsync({ + updatePoolLink({ path: { silo, pool: pool.id }, body: { isDefault: false }, }), @@ -121,7 +121,7 @@ export function SiloIpPoolsTab() { const verb = defaultPool ? 'change' : 'make' confirmAction({ doAction: () => - updatePoolLink.mutateAsync({ + updatePoolLink({ path: { silo, pool: pool.id }, body: { isDefault: true }, }), @@ -138,7 +138,7 @@ export function SiloIpPoolsTab() { className: 'destructive', onActivate() { confirmAction({ - doAction: () => unlinkPool.mutateAsync({ path: { silo, pool: pool.id } }), + doAction: () => unlinkPool({ path: { silo, pool: pool.id } }), modalTitle: `Confirm unlink pool`, modalContent: (

diff --git a/app/pages/system/silos/SilosPage.tsx b/app/pages/system/silos/SilosPage.tsx index e34821b3f..6fbec4722 100644 --- a/app/pages/system/silos/SilosPage.tsx +++ b/app/pages/system/silos/SilosPage.tsx @@ -75,7 +75,7 @@ export function SilosPage() { query: { limit: PAGE_SIZE }, }) - const deleteSilo = useApiMutation('siloDelete', { + const { mutateAsync: deleteSilo } = useApiMutation('siloDelete', { onSuccess() { queryClient.invalidateQueries('siloList') }, @@ -86,7 +86,7 @@ export function SilosPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deleteSilo.mutateAsync({ path: { silo: silo.name } }), + doDelete: () => deleteSilo({ path: { silo: silo.name } }), label: silo.name, }), }, From d42fe0acb14113ce8dfa8054466641ab88334ee6 Mon Sep 17 00:00:00 2001 From: Charlie Park Date: Mon, 9 Sep 2024 11:56:31 -0700 Subject: [PATCH 2/2] Migrate some more files over; will hold here --- app/pages/ProjectsPage.tsx | 4 ++-- app/pages/SiloAccessPage.tsx | 4 ++-- app/pages/project/access/ProjectAccessPage.tsx | 4 ++-- app/pages/project/disks/DisksPage.tsx | 5 ++--- app/pages/project/floating-ips/FloatingIpsPage.tsx | 8 ++++---- app/pages/project/images/ImagesPage.tsx | 4 ++-- app/pages/project/snapshots/SnapshotsPage.tsx | 4 ++-- app/pages/project/vpcs/RouterPage.tsx | 5 ++--- .../project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx | 4 ++-- app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx | 4 ++-- app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx | 4 ++-- app/pages/project/vpcs/VpcsPage.tsx | 5 ++--- app/pages/settings/SSHKeysPage.tsx | 4 ++-- 13 files changed, 28 insertions(+), 31 deletions(-) diff --git a/app/pages/ProjectsPage.tsx b/app/pages/ProjectsPage.tsx index bd3e99307..e8f71bead 100644 --- a/app/pages/ProjectsPage.tsx +++ b/app/pages/ProjectsPage.tsx @@ -66,7 +66,7 @@ export function ProjectsPage() { query: { limit: PAGE_SIZE }, }) - const deleteProject = useApiMutation('projectDelete', { + const { mutateAsync: deleteProject } = useApiMutation('projectDelete', { onSuccess() { // TODO: figure out if this is invalidating as expected, can we leave out the query // altogether, etc. Look at whether limit param matters. @@ -92,7 +92,7 @@ export function ProjectsPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deleteProject.mutateAsync({ path: { project: project.name } }), + doDelete: () => deleteProject({ path: { project: project.name } }), label: project.name, }), }, diff --git a/app/pages/SiloAccessPage.tsx b/app/pages/SiloAccessPage.tsx index 08383f754..ad9060a62 100644 --- a/app/pages/SiloAccessPage.tsx +++ b/app/pages/SiloAccessPage.tsx @@ -103,7 +103,7 @@ export function SiloAccessPage() { }, [siloRows]) const queryClient = useApiQueryClient() - const updatePolicy = useApiMutation('policyUpdate', { + const { mutateAsync: updatePolicy } = useApiMutation('policyUpdate', { onSuccess: () => queryClient.invalidateQueries('policyView'), // TODO: handle 403 }) @@ -137,7 +137,7 @@ export function SiloAccessPage() { label: 'Delete', onActivate: confirmDelete({ doDelete: () => - updatePolicy.mutateAsync({ + updatePolicy({ // we know policy is there, otherwise there's no row to display body: deleteRole(row.id, siloPolicy), }), diff --git a/app/pages/project/access/ProjectAccessPage.tsx b/app/pages/project/access/ProjectAccessPage.tsx index 763bb077e..79f5939f8 100644 --- a/app/pages/project/access/ProjectAccessPage.tsx +++ b/app/pages/project/access/ProjectAccessPage.tsx @@ -118,7 +118,7 @@ export function ProjectAccessPage() { }, [siloRows, projectRows]) const queryClient = useApiQueryClient() - const updatePolicy = useApiMutation('projectPolicyUpdate', { + const { mutateAsync: updatePolicy } = useApiMutation('projectPolicyUpdate', { onSuccess: () => queryClient.invalidateQueries('projectPolicyView'), // TODO: handle 403 }) @@ -167,7 +167,7 @@ export function ProjectAccessPage() { label: 'Delete', onActivate: confirmDelete({ doDelete: () => - updatePolicy.mutateAsync({ + updatePolicy({ path: { project }, // we know policy is there, otherwise there's no row to display body: deleteRole(row.id, projectPolicy), diff --git a/app/pages/project/disks/DisksPage.tsx b/app/pages/project/disks/DisksPage.tsx index d41a889cd..94ae333a8 100644 --- a/app/pages/project/disks/DisksPage.tsx +++ b/app/pages/project/disks/DisksPage.tsx @@ -98,7 +98,7 @@ export function DisksPage() { const { project } = useProjectSelector() const { Table } = useQueryTable('diskList', { query: { project } }) - const deleteDisk = useApiMutation('diskDelete', { + const { mutateAsync: deleteDisk } = useApiMutation('diskDelete', { onSuccess() { queryClient.invalidateQueries('diskList') }, @@ -142,8 +142,7 @@ export function DisksPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => - deleteDisk.mutateAsync({ path: { disk: disk.name }, query: { project } }), + doDelete: () => deleteDisk({ path: { disk: disk.name }, query: { project } }), label: disk.name, }), disabled: diff --git a/app/pages/project/floating-ips/FloatingIpsPage.tsx b/app/pages/project/floating-ips/FloatingIpsPage.tsx index 4377bac75..ea12da064 100644 --- a/app/pages/project/floating-ips/FloatingIpsPage.tsx +++ b/app/pages/project/floating-ips/FloatingIpsPage.tsx @@ -115,7 +115,7 @@ export function FloatingIpsPage() { }) const navigate = useNavigate() - const floatingIpDetach = useApiMutation('floatingIpDetach', { + const { mutateAsync: floatingIpDetach } = useApiMutation('floatingIpDetach', { onSuccess() { queryClient.invalidateQueries('floatingIpList') addToast({ content: 'Your floating IP has been detached' }) @@ -124,7 +124,7 @@ export function FloatingIpsPage() { addToast({ title: 'Error', content: err.message, variant: 'error' }) }, }) - const deleteFloatingIp = useApiMutation('floatingIpDelete', { + const { mutateAsync: deleteFloatingIp } = useApiMutation('floatingIpDelete', { onSuccess() { queryClient.invalidateQueries('floatingIpList') queryClient.invalidateQueries('ipPoolUtilizationView') @@ -153,7 +153,7 @@ export function FloatingIpsPage() { confirmAction({ actionType: 'danger', doAction: () => - floatingIpDetach.mutateAsync({ + floatingIpDetach({ path: { floatingIp: floatingIp.name }, query: { project }, }), @@ -198,7 +198,7 @@ export function FloatingIpsPage() { : false, onActivate: confirmDelete({ doDelete: () => - deleteFloatingIp.mutateAsync({ + deleteFloatingIp({ path: { floatingIp: floatingIp.name }, query: { project }, }), diff --git a/app/pages/project/images/ImagesPage.tsx b/app/pages/project/images/ImagesPage.tsx index 0f054ccb3..700bb9eb4 100644 --- a/app/pages/project/images/ImagesPage.tsx +++ b/app/pages/project/images/ImagesPage.tsx @@ -56,7 +56,7 @@ export function ImagesPage() { const [promoteImageName, setPromoteImageName] = useState(null) - const deleteImage = useApiMutation('imageDelete', { + const { mutateAsync: deleteImage } = useApiMutation('imageDelete', { onSuccess(_data, variables) { addToast({ content: `${variables.path.image} has been deleted` }) queryClient.invalidateQueries('imageList') @@ -73,7 +73,7 @@ export function ImagesPage() { label: 'Delete', onActivate: confirmDelete({ doDelete: () => - deleteImage.mutateAsync({ + deleteImage({ path: { image: image.name }, query: { project }, }), diff --git a/app/pages/project/snapshots/SnapshotsPage.tsx b/app/pages/project/snapshots/SnapshotsPage.tsx index b61216095..a5dac4a26 100644 --- a/app/pages/project/snapshots/SnapshotsPage.tsx +++ b/app/pages/project/snapshots/SnapshotsPage.tsx @@ -103,7 +103,7 @@ export function SnapshotsPage() { const { Table } = useQueryTable('snapshotList', { query: { project } }) const navigate = useNavigate() - const deleteSnapshot = useApiMutation('snapshotDelete', { + const { mutateAsync: deleteSnapshot } = useApiMutation('snapshotDelete', { onSuccess() { queryClient.invalidateQueries('snapshotList') }, @@ -121,7 +121,7 @@ export function SnapshotsPage() { label: 'Delete', onActivate: confirmDelete({ doDelete: () => - deleteSnapshot.mutateAsync({ + deleteSnapshot({ path: { snapshot: snapshot.name }, query: { project }, }), diff --git a/app/pages/project/vpcs/RouterPage.tsx b/app/pages/project/vpcs/RouterPage.tsx index 5820b915a..09f870de6 100644 --- a/app/pages/project/vpcs/RouterPage.tsx +++ b/app/pages/project/vpcs/RouterPage.tsx @@ -87,7 +87,7 @@ export function RouterPage() { query: { project, vpc }, }) - const deleteRouterRoute = useApiMutation('vpcRouterRouteDelete', { + const { mutateAsync: deleteRouterRoute } = useApiMutation('vpcRouterRouteDelete', { onSuccess() { apiQueryClient.invalidateQueries('vpcRouterRouteList') addToast({ content: 'Your route has been deleted' }) @@ -158,8 +158,7 @@ export function RouterPage() { className: 'destructive', onActivate: () => confirmAction({ - doAction: () => - deleteRouterRoute.mutateAsync({ path: { route: routerRoute.id } }), + doAction: () => deleteRouterRoute({ path: { route: routerRoute.id } }), errorTitle: 'Could not remove route', modalTitle: 'Confirm remove route', modalContent: ( diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx index e4fab8bc6..3f2b21eb5 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx @@ -114,7 +114,7 @@ export function VpcFirewallRulesTab() { const navigate = useNavigate() - const updateRules = useApiMutation('vpcFirewallRulesUpdate', { + const { mutateAsync: updateRules } = useApiMutation('vpcFirewallRulesUpdate', { onSuccess() { queryClient.invalidateQueries('vpcFirewallRulesView') }, @@ -149,7 +149,7 @@ export function VpcFirewallRulesTab() { label: 'Delete', onActivate: confirmDelete({ doDelete: () => - updateRules.mutateAsync({ + updateRules({ query: vpcSelector, body: { rules: rules.filter((r) => r.id !== rule.id), diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx index 3a47a7c7c..784e87e76 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcRoutersTab.tsx @@ -61,7 +61,7 @@ export function VpcRoutersTab() { [vpcSelector] ) - const deleteRouter = useApiMutation('vpcRouterDelete', { + const { mutateAsync: deleteRouter } = useApiMutation('vpcRouterDelete', { onSuccess() { apiQueryClient.invalidateQueries('vpcRouterList') addToast({ content: 'Your router has been deleted' }) @@ -88,7 +88,7 @@ export function VpcRoutersTab() { className: 'destructive', onActivate: confirmDelete({ doDelete: () => - deleteRouter.mutateAsync({ + deleteRouter({ path: { router: router.name }, query: { project, vpc }, }), diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx index c24c2eb73..1fccb74bd 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx +++ b/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx @@ -44,7 +44,7 @@ export function VpcSubnetsTab() { const { Table } = useQueryTable('vpcSubnetList', { query: vpcSelector }) - const deleteSubnet = useApiMutation('vpcSubnetDelete', { + const { mutateAsync: deleteSubnet } = useApiMutation('vpcSubnetDelete', { onSuccess() { queryClient.invalidateQueries('vpcSubnetList') }, @@ -63,7 +63,7 @@ export function VpcSubnetsTab() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deleteSubnet.mutateAsync({ path: { subnet: subnet.id } }), + doDelete: () => deleteSubnet({ path: { subnet: subnet.id } }), label: subnet.name, }), }, diff --git a/app/pages/project/vpcs/VpcsPage.tsx b/app/pages/project/vpcs/VpcsPage.tsx index 87f01df47..c03dfeb6b 100644 --- a/app/pages/project/vpcs/VpcsPage.tsx +++ b/app/pages/project/vpcs/VpcsPage.tsx @@ -80,7 +80,7 @@ export function VpcsPage() { }) const navigate = useNavigate() - const deleteVpc = useApiMutation('vpcDelete', { + const { mutateAsync: deleteVpc } = useApiMutation('vpcDelete', { onSuccess() { queryClient.invalidateQueries('vpcList') }, @@ -102,8 +102,7 @@ export function VpcsPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => - deleteVpc.mutateAsync({ path: { vpc: vpc.name }, query: { project } }), + doDelete: () => deleteVpc({ path: { vpc: vpc.name }, query: { project } }), label: vpc.name, }), }, diff --git a/app/pages/settings/SSHKeysPage.tsx b/app/pages/settings/SSHKeysPage.tsx index ef496fdce..97ad48f88 100644 --- a/app/pages/settings/SSHKeysPage.tsx +++ b/app/pages/settings/SSHKeysPage.tsx @@ -45,7 +45,7 @@ export function SSHKeysPage() { const { Table } = useQueryTable('currentUserSshKeyList', {}) const queryClient = useApiQueryClient() - const deleteSshKey = useApiMutation('currentUserSshKeyDelete', { + const { mutateAsync: deleteSshKey } = useApiMutation('currentUserSshKeyDelete', { onSuccess: () => { queryClient.invalidateQueries('currentUserSshKeyList') addToast({ content: 'Your SSH key has been deleted' }) @@ -57,7 +57,7 @@ export function SSHKeysPage() { { label: 'Delete', onActivate: confirmDelete({ - doDelete: () => deleteSshKey.mutateAsync({ path: { sshKey: sshKey.name } }), + doDelete: () => deleteSshKey({ path: { sshKey: sshKey.name } }), label: sshKey.name, }), },