@testgorilla/tgo-ai-interview-test

@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