JSONLines Example

import { get, prefix, operation, procedure, type VovkIteration } from 'vovk';
import z from 'zod';
 
@prefix('jsonlines')
export default class JSONLinesController {
  @operation({
    summary: 'Stream tokens',
    description: 'Stream tokens to the client',
  })
  @get('tokens', { cors: true })
  static streamTokens = procedure({
    iteration: z.object({ message: z.string() }),
  }).handle(async function* () {
    const tokens: VovkIteration<typeof JSONLinesController.streamTokens>[] = [
      { message: 'Hello,' },
      { message: ' World' },
      { message: ' from' },
      { message: ' JSONLines' },
      { message: ' Endpoint' },
      { message: '!' },
    ];
 
    for (const token of tokens) {
      yield token;
      await new Promise((resolve) => setTimeout(resolve, 300));
    }
  });
}

'use client';
import { useState } from 'react';
import { JSONLinesRPC } from '@/client';
import type { VovkYieldType } from 'vovk';
 
export default function StreamExample() {
  const [tokens, setTokens] = useState<VovkYieldType<typeof JSONLinesRPC.streamTokens>[]>([]);
 
  return (
    <>
      <button
        type="button"
        onClick={async () => {
          setTokens([]);
          using stream = await JSONLinesRPC.streamTokens();
          for await (const token of stream) {
            setTokens((tokens) => [...tokens, token]);
          }
        }}
      >
        Get JSONLines Response
      </button>
      <div>
        {tokens.map(({ message }, i) => (
          <span key={i}>{message}</span>
        ))}
      </div>
    </>
  );
}