@testgorilla/tgo-ai-interview-test

AI Interview component for TestGorilla assessments.

Installation

npm install @testgorilla/tgo-ai-interview-test

Usage

import { AiInterviewTestComponent } from '@testgorilla/tgo-ai-interview-test';

@Component({
  imports: [AiInterviewTestComponent],
  template: `
    <tgo-ai-interview-test
      [question]="question"
      [test]="test"
      [isFirstQuestion]="false"
      [conversationUrl]="conversationUrl"
      [selectedMediaDevices]="selectedMediaDevices"
      [mediaAccessChanged]="mediaAccessChanged"
      (submissionStateChanged)="onSubmissionStateChanged($event)"
      (loadingStateChanged)="onLoadingStateChanged($event)"
      (requestMediaAccess)="onRequestMediaAccess()"
    ></tgo-ai-interview-test>
  `,
})
export class MyComponent {}

Assets (translations)

This package ships its translations under assets/i18n. Consumer apps must copy these assets into their build output so Transloco can load them at runtime.

• Angular CLI / Nx: add an assets entry pointing at the package:

{
  "assets": [
    "src/favicon.ico",
    "src/assets",
    {
      "glob": "**/*",
      "input": "node_modules/@testgorilla/tgo-ai-interview-test/assets",
      "output": "assets/tgo-ai-interview-test"
    }
  ]
}

If you develop inside this repo (consuming the workspace sources), also include the local path:

{
  "glob": "**/*",
  "input": "packages/tgo-ai-interview-test/src/assets",
  "output": "assets/tgo-ai-interview-test"
}

After adding the asset entries, rebuild/re-serve your app so /assets/tgo-ai-interview-test/i18n/en.json is available.

API

Inputs

| Name | Type | Required | Default | Description | | ------------------- | --------------------------------- | -------- | ------- | ------------------------------------------------ | | question | Question | Yes | - | Question data containing text/media content | | test | TestResultRead | Yes | - | Test configuration and metadata | | isFirstQuestion | boolean | No | false | Whether this is the first question in the test | | conversationUrl | string | No | - | Daily.co conversation URL for the AI interview | | selectedMediaDevices| SelectedMediaDevices | No | - | Selected audio/video device IDs | | mediaAccessChanged | Observable<SelectedMediaDevices>| No | - | Observable for media device changes |

Outputs

| Name | Type | Description | | -------------------- | --------------------------- | ---------------------------------------------- | | submissionStateChanged| EventEmitter<ISubmissionState | null> | Emits submission state when answer is submitted | | loadingStateChanged | EventEmitter<boolean> | Emits loading state changes | | requestMediaAccess | EventEmitter<void> | Emits when media access permission is needed |

Peer Dependencies

This library requires the following peer dependencies:

• @angular/common ~18.2.13
• @angular/core ~18.2.13
• @angular/animations ~18.2.13
• @angular/material ~18.2.14 (for dialog support)
• @ngneat/transloco ~4.3.0
• @testgorilla/tgo-ui ~3.14.10
• @daily-co/daily-js ^0.79.0
• rxjs ~7.8.1

Internal Dependencies

All required services, models, and components are included within this library:

• MediaService - Handles audio/video recording and playback
• ThemeService - Provides theme/company color configuration
• Question, TestResultRead, SelectedMediaDevices, ISubmissionState - Type definitions
• AudioAnimationComponent, VideoCountdownComponent, VimeoVideoComponent - UI components
• InterviewStreamComponent - Daily.co video call integration component
• InterviewVideoComponent - Video display component
• ReviewInstructionsDialogComponent - Dialog component for review instructions
• TranslocoLazyModuleUtils, getAvailableLangs - Translation utilities

Features

• AI-powered interview via Daily.co video calls
• Candidate video recording
• Real-time video/audio stream handling
• Media device selection
• Translation support via Transloco
• Review instructions dialog
• Preview mode support