AI di Form dan Content

Integrasi AI langsung ke form fields dan content creation — bukan chatbot terpisah, tapi AI yang embedded di workflow user.

Smart Autocomplete

// Debounced AI suggestion saat user mengetik
function SmartInput({ label, context }) {
  const [value, setValue] = useState("");
  const [suggestion, setSuggestion] = useState("");

  const getSuggestion = useDebouncedCallback(async (text) => {
    if (text.length < 10) return;
    const result = await fetch("/api/ai/complete", {
      method: "POST",
      body: JSON.stringify({ text, context }),
    });
    const { completion } = await result.json();
    setSuggestion(completion);
  }, 500);

  return (
    <div>
      <label>{label}</label>
      <textarea
        value={value}
        onChange={e => { setValue(e.target.value); getSuggestion(e.target.value); }}
      />
      {suggestion && (
        <button onClick={() => setValue(value + suggestion)}>
          Accept: "{suggestion.slice(0, 30)}..."
        </button>
      )}
    </div>
  );
}

Content Generation Patterns

• Summarize — "Rangkum artikel ini menjadi 3 bullet points"
• Expand — "Kembangkan outline ini menjadi paragraf penuh"
• Rewrite — "Ubah tone menjadi lebih profesional/casual"
• Translate — Translate sambil jaga konteks teknis
• Extract — "Dari email ini, extract: nama, tanggal, action items"

Structured Output

// Force model output JSON yang valid
const response = await openai.chat.completions.create({
  model: "gpt-4o",
  messages: [{
    role: "user",
    content: "Extract data: 'Meeting dengan Budi tanggal 20 April jam 2 siang di kantor Jakarta'"
  }],
  response_format: {
    type: "json_schema",
    json_schema: {
      name: "event",
      schema: {
        type: "object",
        properties: {
          person: { type: "string" },
          date: { type: "string" },
          time: { type: "string" },
          location: { type: "string" },
        },
        required: ["person", "date", "time", "location"],
      },
    },
  },
});
// {"person":"Budi","date":"2026-04-20","time":"14:00","location":"Kantor Jakarta"}