YunoHost/yunohost-admin
1
0
Fork 0
mirror of https://github.com/YunoHost/yunohost-admin.git synced 2024-09-03 20:06:15 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor: rework async ToolSettings

Browse source
This commit is contained in:
axolotle 2024-08-13 00:31:47 +02:00
parent ab506a5727
commit 09e9c272b7
1 changed files with 25 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
app/src/views/tool/ToolSettings.vue
View file

@ -1,53 +1,39 @@
<script setup lang="ts"> <script setup lang="ts">
import { shallowRef } from 'vue'
import api, { objectToParams } from '@/api' import api, { objectToParams } from '@/api'
import ConfigPanelsComponent from '@/components/ConfigPanels.vue' import ConfigPanelsComponent from '@/components/ConfigPanels.vue'
import type {
ConfigPanelsProps,
OnPanelApply,
} from '@/composables/configPanels'
import { formatConfigPanels, useConfigPanels } from '@/composables/configPanels' import { formatConfigPanels, useConfigPanels } from '@/composables/configPanels'
import { useInitialQueries } from '@/composables/useInitialQueries'
import type { CoreConfigPanels } from '@/types/core/options' import type { CoreConfigPanels } from '@/types/core/options'
const props = defineProps<{ tabId?: string }>() const props = defineProps<{ tabId?: string }>()
const { loading, refetch } = useInitialQueries([{ uri: 'settings?full' }], { const coreConfig = await api.get<CoreConfigPanels>({
onQueriesResponse, uri: 'settings?full',
initial: true,
}) })
const config = shallowRef<ConfigPanelsProps | undefined>()
function onQueriesResponse(config_: CoreConfigPanels) { const { form, panel, v, routes, onPanelApply } = useConfigPanels(
config.value = useConfigPanels( formatConfigPanels(coreConfig),
formatConfigPanels(config_), () => props.tabId,
() => props.tabId, ({ panelId, data }, onError) => {
onPanelApply, // FIXME no route for potential action
) api
} .put({
uri: `settings/${panelId}`,
const onPanelApply: OnPanelApply = ({ panelId, data }, onError) => { data: { args: objectToParams(data) },
// FIXME no route for potential action humanKey: { key: 'settings.update', panel: panelId },
api })
.put({ .then(() => api.refetch())
uri: `settings/${panelId}`, .catch(onError)
data: { args: objectToParams(data) }, },
humanKey: { key: 'settings.update', panel: panelId }, )
})
.then(() => refetch())
.catch(onError)
}
</script> </script>
<template> <template>
<ViewBase :loading="loading" skeleton="CardFormSkeleton"> <ConfigPanelsComponent
<ConfigPanelsComponent v-model="form"
v-if="config" :panel="panel"
v-model="config.form" :validations="v"
:panel="config.panel.value" :routes="routes"
:validations="config.v.value" @apply="onPanelApply"
:routes="config.routes" />
@apply="config.onPanelApply"
/>
</ViewBase>
</template> </template>