Vertex AI

export function provideVertexAI(fn: () => VertexAI): EnvironmentProviders;
export function getVertexAI(app?: FirebaseApp): VertexAI;

export class VertexAI extends VertexAI {}
export class VertexAIInstances extends Array<VertexAI> {}
export const vertexAIInstance$: Observable<VertexAI>;

/**
 * Get generative model instance
 * @param vertexAI - Vertex AI instance
 * @param modelParams - Model parameters
 * @returns Generative model instance
 */
export function getGenerativeModel(
  vertexAI: VertexAI,
  modelParams: ModelParams
): GenerativeModel;

/**
 * Check if Vertex AI is supported
 * @returns Promise resolving to support status
 */
export function isSupported(): Promise<boolean>;

interface ModelParams {
  model: string;
  generationConfig?: GenerationConfig;
  safetySettings?: SafetySetting[];
}

interface GenerativeModel {
  generateContent(request: string | GenerateContentRequest): Promise<GenerateContentResult>;
  generateContentStream(request: string | GenerateContentRequest): AsyncGenerator<GenerateContentResult>;
  startChat(startChatParams?: StartChatParams): ChatSession;
}

interface GenerateContentResult {
  response: GenerateContentResponse;
}

interface GenerateContentResponse {
  text(): string;
  candidates?: GenerateContentCandidate[];
}

import { Component, inject } from '@angular/core';
import { VertexAI, getGenerativeModel } from '@angular/fire/vertexai';

@Component({
  selector: 'app-vertex-ai',
  template: `
    <div>
      <textarea [(ngModel)]="prompt" placeholder="Enter your prompt..."></textarea>
      <button (click)="generateContent()" [disabled]="loading">Generate</button>
      <div *ngIf="response">
        <h3>Response:</h3>
        <p>{{ response }}</p>
      </div>
    </div>
  `,
})
export class VertexAIComponent {
  private vertexAI = inject(VertexAI);
  
  prompt = '';
  response = '';
  loading = false;

  async generateContent() {
    if (!this.prompt.trim()) return;
    
    this.loading = true;
    try {
      const model = getGenerativeModel(this.vertexAI, {
        model: 'gemini-pro'
      });
      
      const result = await model.generateContent(this.prompt);
      this.response = result.response.text();
    } catch (error) {
      console.error('Generation error:', error);
      this.response = 'Error generating content';
    } finally {
      this.loading = false;
    }
  }
}