<script setup>
import { ExpressionEditor } from "../../../ui/expression-editor";
import { Field, FieldGroup, FieldLabel } from "../../../ui/field";
import { Locale as LocaleField } from "../../../ui/locale";
import { Markdown } from "../../../ui/markdown";
import { getStructFieldDescription, getStructFieldTitle } from "../../../../share/schema-meta";
import { schema } from "./schema";
defineOptions({ name: "ShwfedHttpRequestOperationConfig" });
const value = defineModel({ type: null, ...{ required: true } });
const opSchema = schema(() => {
});
const fieldTitle = (f) => getStructFieldTitle(opSchema, f) ?? f;
const fieldDescription = (f) => getStructFieldDescription(opSchema, f);
const JSON_VAR = { json: { type: "dyn", label: "HTTP \u54CD\u5E94" } };
const OUTCOME_VARS = {
  json: { type: "dyn", label: "HTTP \u54CD\u5E94" },
  result: { type: "string", label: "\u6267\u884C\u7ED3\u679C" }
};
function patch(patchValue) {
  const next = { ...value.value, ...patchValue };
  for (const [k, v] of Object.entries(patchValue)) {
    if (v === void 0) Reflect.deleteProperty(next, k);
  }
  value.value = next;
}
function patchOptionalExpression(key, v) {
  patch({ [key]: v.length === 0 ? void 0 : v });
}
function patchDescription(v) {
  const blank = v.every((entry) => entry.message.trim().length === 0);
  patch({ description: blank ? void 0 : v });
}
</script>

<template>
  <FieldGroup>
    <Field orientation="vertical">
      <FieldLabel class="text-xs text-zinc-500">
        <template
          v-if="fieldDescription('expression')"
          #tooltip
        >
          <Markdown
            :source="fieldDescription('expression')"
            block
            class="prose prose-sm prose-zinc"
          />
        </template>
        {{ fieldTitle("expression") }}
      </FieldLabel>
      <ExpressionEditor
        :model-value="value.expression"
        multiline
        placeholder="例：http.post('/api/foo').body({ id: row.id })"
        result-type="HttpRequest"
        class="min-h-16"
        @update:model-value="(v) => patch({ expression: v })"
      />
    </Field>

    <div class="grid grid-cols-2 gap-4">
      <Field orientation="vertical">
        <FieldLabel class="text-xs text-zinc-500">
          <template
            v-if="fieldDescription('resultExpression')"
            #tooltip
          >
            <Markdown
              :source="fieldDescription('resultExpression')"
              block
              class="prose prose-sm prose-zinc"
            />
          </template>
          {{ fieldTitle("resultExpression") }}
        </FieldLabel>
        <ExpressionEditor
          :model-value="value.resultExpression ?? ''"
          placeholder="例：json.code == 0 ? 'success' : 'error'"
          result-type="string"
          :extra-vars="JSON_VAR"
          @update:model-value="(v) => patchOptionalExpression('resultExpression', v)"
        />
      </Field>

      <Field orientation="vertical">
        <FieldLabel class="text-xs text-zinc-500">
          <template
            v-if="fieldDescription('titleExpression')"
            #tooltip
          >
            <Markdown
              :source="fieldDescription('titleExpression')"
              block
              class="prose prose-sm prose-zinc"
            />
          </template>
          {{ fieldTitle("titleExpression") }}
        </FieldLabel>
        <ExpressionEditor
          :model-value="value.titleExpression ?? ''"
          placeholder="例：result == 'error' ? '保存失败' : '保存成功'"
          result-type="string"
          :extra-vars="OUTCOME_VARS"
          @update:model-value="(v) => patchOptionalExpression('titleExpression', v)"
        />
      </Field>
    </div>

    <Field orientation="vertical">
      <FieldLabel class="text-xs text-zinc-500">
        <template
          v-if="fieldDescription('description')"
          #tooltip
        >
          <Markdown
            :source="fieldDescription('description')"
            block
            class="prose prose-sm prose-zinc"
          />
        </template>
        {{ fieldTitle("description") }}
      </FieldLabel>
      <LocaleField
        markdown
        :model-value="value.description"
        @update:model-value="(v) => patchDescription(v)"
      />
    </Field>
  </FieldGroup>
</template>
