ChatGPT Hooks

import { useUploadFile, useRequestModal, useRequestCheckout } from 'sunpeak/host/chatgpt';
import { isChatGPT } from 'sunpeak/host';

import { isChatGPT } from 'sunpeak/host';
import { useUploadFile } from 'sunpeak/host/chatgpt';

function MyResource() {
  // Only use ChatGPT hooks when running on ChatGPT
  if (!isChatGPT()) {
    return <p>File upload requires ChatGPT.</p>;
  }

  return <FileUploader />;
}

function FileUploader() {
  const uploadFile = useUploadFile();
  // Safe to call — we're inside ChatGPT
  // ...
}

function useUploadFile(): (file: File) => Promise<CreateFileResult>

import { useUploadFile } from 'sunpeak/host/chatgpt';

function ImageUploader() {
  const uploadFile = useUploadFile();

  const handleChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
    const file = e.currentTarget.files?.[0];
    if (!file) return;
    const { fileId } = await uploadFile(file);
    console.log('Uploaded:', fileId);
  };

  return <input type="file" accept="image/*" onChange={handleChange} />;
}

function useRequestModal(): (params: OpenModalParams) => Promise<void>

import { useRequestModal } from 'sunpeak/host/chatgpt';

function SettingsButton() {
  const requestModal = useRequestModal();

  return (
    <button onClick={() => requestModal({ template: 'ui://widget/settings.html' })}>
      Open Settings
    </button>
  );
}

function useRequestCheckout(): (session: CheckoutSession) => Promise<CheckoutOrder>

import { useRequestCheckout } from 'sunpeak/host/chatgpt';

function BuyButton() {
  const requestCheckout = useRequestCheckout();

  const handleBuy = async () => {
    try {
      const order = await requestCheckout({
        id: 'session-1',
        payment_provider: {
          provider: 'stripe',
          merchant_id: 'acct_xxx',
          supported_payment_methods: ['card', 'apple_pay'],
        },
        status: 'ready_for_payment',
        currency: 'USD',
        totals: [{ type: 'total', display_text: 'Total', amount: 999 }],
        links: [],
        payment_mode: 'live',
      });
      console.log('Order completed:', order.id);
    } catch {
      console.log('Checkout cancelled or failed');
    }
  };

  return <button onClick={handleBuy}>Buy Now</button>;
}

import { getOpenAIRuntime } from 'sunpeak/host/chatgpt';
import type { OpenAIRuntime } from 'sunpeak/host/chatgpt';

const runtime: OpenAIRuntime | undefined = getOpenAIRuntime();
if (runtime?.openExternal) {
  runtime.openExternal({ href: 'https://example.com' });
}