const { createApp, ref } = Vue;

createApp({
  setup() {
    const result = ref('');
    const error = ref('');
    const loading = ref(false);

    async function ping() {
      loading.value = true;
      error.value = '';
      try {
        const res = await fetch('/api/hello');
        if (!res.ok) throw new Error(`HTTP ${res.status}`);
        result.value = JSON.stringify(await res.json(), null, 2);
      } catch (e) {
        error.value = String(e);
      } finally {
        loading.value = false;
      }
    }

    return { result, error, loading, ping };
  },
}).mount('#app');