vignesh/trypost
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use Inertia's useHttp for automation JSON calls

Browse source 
The test-run and invocation-detail requests used raw fetch with a hand-rolled
CSRF header. Switch to Inertia v3's useHttp (the standalone XHR client already
used across the app), which handles CSRF, headers and error payloads — dropping
the manual plumbing and reading the 422 message from error.response.data.
This commit is contained in:
Paulo Castellano 2026-06-13 17:41:48 -03:00
parent cf3cbfba9e
commit 19f331741c
2 changed files with 14 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
resources/js/components/automations/TestRunPanel.vue
View file

@ -1,4 +1,5 @@
<script setup lang="ts">
import { useHttp } from '@inertiajs/vue3';
import { IconAlertCircle, IconChevronRight, IconCircleCheck, IconCircleDot, IconInfoCircle, IconLoader2, IconPlayerPlay } from '@tabler/icons-vue';
import { trans } from 'laravel-vue-i18n';
import { ref } from 'vue';
@ -42,13 +43,12 @@ const run = ref<Run | null>(null);
const nodeRuns = ref<NodeRun[]>([]);
const activeRunId = ref<string | null>(null);
const testHttp = useHttp<{ with_real_data: boolean }, { run_id: string }>({ with_real_data: false });
const runHttp = useHttp<Record<string, never>, { run: Run; node_runs: NodeRun[] }>({});
const fetchRun = async (runId: string): Promise<void> => {
try {
const response = await fetch(showRunRoute.url({ automation: props.automationId, run: runId }), {
headers: { Accept: 'application/json' },
});
if (!response.ok) return;
const data = await response.json();
const data = await runHttp.get(showRunRoute.url({ automation: props.automationId, run: runId }));
run.value = data.run;
nodeRuns.value = data.node_runs;
} catch {
@ -79,25 +79,13 @@ const start = async () => {
activeRunId.value = null;
try {
const response = await fetch(testAutomation.url(props.automationId), {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
'X-CSRF-TOKEN': (document.querySelector('meta[name="csrf-token"]') as HTMLMetaElement | null)?.content ?? '',
},
body: JSON.stringify({ with_real_data: realData.value }),
});
if (!response.ok) {
const body = await response.json().catch(() => null);
throw new Error(body?.message ?? '');
}
const { run_id: runId } = await response.json();
testHttp.with_real_data = realData.value;
const { run_id: runId } = await testHttp.post(testAutomation.url(props.automationId));
activeRunId.value = runId;
await fetchRun(runId);
} catch (error) {
const message = error instanceof Error && error.message ? error.message : trans('automations.test.error_starting');
toast.error(message);
} catch (error: unknown) {
const message = (error as { response?: { data?: { message?: string } } })?.response?.data?.message;
toast.error(message ?? trans('automations.test.error_starting'));
} finally {
isStarting.value = false;
}

15
resources/js/pages/automations/Invocations.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { InfiniteScroll, router } from '@inertiajs/vue3';
import { InfiniteScroll, router, useHttp } from '@inertiajs/vue3';
import { IconChevronRight, IconCopy, IconRefresh } from '@tabler/icons-vue';
import { trans, transChoice } from 'laravel-vue-i18n';
import { computed, ref, watch } from 'vue';
@ -152,22 +152,15 @@ const expanded = ref<Record<string, boolean>>({});
const nodeRuns = ref<Record<string, NodeRun[]>>({});
const loadingRuns = ref<Record<string, boolean>>({});
const runHttp = useHttp<Record<string, never>, { node_runs: NodeRun[] }>({});
const toggleExpand = async (invocation: Invocation) => {
expanded.value[invocation.id] = !expanded.value[invocation.id];
if (expanded.value[invocation.id] && !nodeRuns.value[invocation.id]) {
loadingRuns.value[invocation.id] = true;
try {
const response = await fetch(
showRunRoute.url({
automation: props.automation.id,
run: invocation.id,
}),
{
headers: { Accept: 'application/json' },
},
);
const payload = await response.json();
const payload = await runHttp.get(showRunRoute.url({ automation: props.automation.id, run: invocation.id }));
nodeRuns.value[invocation.id] = payload.node_runs ?? [];
} catch {
toast.error(trans('automations.invocations.load_error'));