Mutations second pass, add subscriptions + errors

This commit is contained in:
Christoph Kluge 2023-05-12 11:05:39 +02:00
parent 4bd1d30aa5
commit 23e485afce
3 changed files with 60 additions and 52 deletions

View File

@ -54,17 +54,15 @@
} }
const client = getContextClient(); const client = getContextClient();
const query = gql` const updateConfigurationMutation = ({ name, value }) => {
return mutationStore({
client: client,
query: gql`
mutation($name: String!, $value: String!) { mutation($name: String!, $value: String!) {
updateConfiguration(name: $name, value: $value) updateConfiguration(name: $name, value: $value)
} }
`; `,
variables: { name, value }
const updateConfiguration = ({ name, value }) => {
mutationStore({
client,
query,
variables: { name, value },
})} })}
let columnHovering = null let columnHovering = null
@ -92,9 +90,14 @@
metrics = newMetricsOrder.filter(m => unorderedMetrics.includes(m)) metrics = newMetricsOrder.filter(m => unorderedMetrics.includes(m))
isOpen = false isOpen = false
updateConfiguration({ updateConfigurationMutation({
name: cluster == null ? configName : `${configName}:${cluster}`, name: cluster == null ? configName : `${configName}:${cluster}`,
value: JSON.stringify(metrics) value: JSON.stringify(metrics)
}).subscribe(res => {
if (res.fetching === false && res.error) {
throw res.error
// console.log('Error on subscription: ' + res.error)
}
}) })
} }
</script> </script>

View File

@ -8,9 +8,8 @@
export let metricsInScatterplots export let metricsInScatterplots
const client = getContextClient(); const client = getContextClient();
const updateConfigurationMutation = ({ name, value }) => {
$: updateConfigurationMutation = ({ name, value }) => { return mutationStore({
mutationStore({
client: client, client: client,
query: gql`mutation($name: String!, $value: String!) { query: gql`mutation($name: String!, $value: String!) {
updateConfiguration(name: $name, value: $value) updateConfiguration(name: $name, value: $value)
@ -26,6 +25,11 @@
updateConfigurationMutation({ updateConfigurationMutation({
name: data.name, name: data.name,
value: JSON.stringify(data.value) value: JSON.stringify(data.value)
}).subscribe(res => {
if (res.fetching === false && res.error) {
throw res.error
// console.log('Error on subscription: ' + res.error)
}
}) })
} }
</script> </script>

View File

@ -81,34 +81,23 @@
`; `;
$: jobs = queryStore({ $: jobs = queryStore({
client, client: client,
query, query: query,
variables: { paging, sorting, filter }, variables: { paging, sorting, filter }
}); });
const configName = 'plot_list_jobsPerPage'
let configValue = ''
$: if (configValue != '') {
mutationStore({
client: getContextClient(),
query: gql`
mutation ($configName: String!, $configValue: String!) {
updateConfiguration(name: $configName, value: $configValue)
}
`,
variables: { configName, configValue },
});
}
const updateConfiguration = ({ value, page }) => {
configValue = value; // Trigger mutation
paging = { itemsPerPage: value, page: page }; // Trigger reload of jobList
};
// $: $jobs.variables = { ...$jobs.variables, sorting, paging }
$: matchedJobs = $jobs.data != null ? $jobs.data.jobs.count : 0; $: matchedJobs = $jobs.data != null ? $jobs.data.jobs.count : 0;
// Force refresh list with existing unchanged variables (== usually would not trigger reactivity)
export function refresh() {
queryStore({
client: client,
query: query,
variables: { paging, sorting, filter },
requestPolicy: 'network-only'
});
}
// (Re-)query and optionally set new filters. // (Re-)query and optionally set new filters.
export function update(filters) { export function update(filters) {
if (filters != null) { if (filters != null) {
@ -116,26 +105,39 @@
if (minRunningFor && minRunningFor > 0) { if (minRunningFor && minRunningFor > 0) {
filters.push({ minRunningFor }); filters.push({ minRunningFor });
} }
filter = filters; filter = filters;
} }
page = 1; page = 1;
paging = paging = { page, itemsPerPage }; paging = paging = { page, itemsPerPage };
} }
// Force refresh list with existing unchanged variables (== usually would not trigger reactivity) const updateConfigurationMutation = ({ name, value }) => {
export function refresh() { return mutationStore({
queryStore({ client: client,
client, query: gql`
query, mutation ($name: String!, $value: String!) {
variables: { paging, sorting, filter }, updateConfiguration(name: $name, value: $value)
requestPolicy: 'network-only' }
`,
variables: { name, value }
}); });
} }
function updateConfiguration(value, page) {
updateConfigurationMutation({ name: 'plot_list_jobsPerPage', value: value })
.subscribe(res => {
if (res.fetching === false && !res.error) {
paging = { itemsPerPage: value, page: page }; // Trigger reload of jobList
} else if (res.fetching === false && res.error) {
throw res.error
// console.log('Error on subscription: ' + res.error)
}
})
};
let tableWidth = null; let tableWidth = null;
let jobInfoColumnWidth = 250; let jobInfoColumnWidth = 250;
$: plotWidth = Math.floor( $: plotWidth = Math.floor(
(tableWidth - jobInfoColumnWidth) / metrics.length - 10 (tableWidth - jobInfoColumnWidth) / metrics.length - 10
); );
@ -232,11 +234,10 @@
totalItems={matchedJobs} totalItems={matchedJobs}
on:update={({ detail }) => { on:update={({ detail }) => {
if (detail.itemsPerPage != itemsPerPage) { if (detail.itemsPerPage != itemsPerPage) {
itemsPerPage = detail.itemsPerPage; updateConfiguration(
updateConfiguration({ detail.itemsPerPage.toString(),
value: itemsPerPage.toString(), detail.page
page: detail.page, )
})
} else { } else {
paging = { itemsPerPage: detail.itemsPerPage, page: detail.page } paging = { itemsPerPage: detail.itemsPerPage, page: detail.page }
} }