@dataclouder/ngx-lessons 0.0.31 → 0.0.32

package/src/lib/components/lesson-mini-components/components/ComponentWithForm.ts

@@ -1,25 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { UntypedFormControl } from '@angular/forms';
-
-@Component({
-  selector: 'app-component-form',
-  template: '<div>no template</div>',
-})
-export abstract class ComponentWithForm implements OnInit {
-  // @Input() settings: LessonCompSettings;
-
-  public control: UntypedFormControl = new UntypedFormControl();
-  public status: string;
-
-  ngOnInit(): void {
-    this.control.valueChanges.subscribe(() => {
-      this.status = 'basic';
-    });
-  }
-
-  public validate(): void {
-    // TODO: generic method to evaluate
-  }
-
-  public abstract evaluate(): boolean;
-}

package/src/lib/components/lesson-mini-components/components/lesson-dynamic.component.ts

@@ -1,13 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-import { LessonCompSettings } from './lessons.clases';
-
-@Component({
-  selector: 'app-lesson-component',
-  template: '<div>no template</div>',
-  standalone: true,
-})
-// This is the base class for all the components that are going to be used in the lessons.
-export class LessonDynamicComponent {
-  @Input() settings: LessonCompSettings = {} as LessonCompSettings;
-}

package/src/lib/components/lesson-mini-components/components/lessons.clases.ts

@@ -1,220 +0,0 @@
-import { UntypedFormControl } from '@angular/forms';
-import { InjectionToken, Type } from '@angular/core';
-import { Provider } from '@angular/core';
-
-import { SelectorBuilderComponent } from './selector/selector-builder/selector-builder.component';
-import { SelectorComponent } from './selector/selector.component';
-
-import { TextWriterBuiderComponent } from './text-writer/text-writer-buider/text-writer-buider.component';
-import { TextWriterComponent } from './text-writer/text-writer.component';
-import { TranslationSwitcherBuilderComponent } from './translationSwitcher/translationSwitcherBuilder/translationSwitcherBuilder.component';
-import { TranslationSwitcherComponent } from './translationSwitcher/translationSwitcher.component';
-import { SpeakerBuilderComponent } from './speaker/speaker-builder/speaker-builder.component';
-import { SpeakerComponent } from './speaker/speaker.component';
-
-export type LessonComponentsType = 'selector' | 'speaker' | 'text-writer' | 'verb-summary' | 'word-summary';
-
-export enum LessonComponentEnum {
-  Selector = 'selector',
-  Speaker = 'speaker',
-  TextWriter = 'textWriter',
-  VerbSummary = 'verbSummary',
-  WordSummary = 'wordSummary',
-  TranslationSwitcher = 'translationSwitcher',
-}
-
-export const LessonComponentBuilders = {
-  [LessonComponentEnum.Selector]: SelectorBuilderComponent,
-  [LessonComponentEnum.Speaker]: SpeakerBuilderComponent,
-  [LessonComponentEnum.TextWriter]: TextWriterBuiderComponent,
-  // [LessonComponentEnum.VerbSummary]: VerbSummaryBuilderComponent,
-  // [LessonComponentEnum.WordSummary]: WordSummaryBuilderComponent,
-  [LessonComponentEnum.TranslationSwitcher]: TranslationSwitcherBuilderComponent,
-};
-
-export const LessonComponents = {
-  [LessonComponentEnum.Selector]: SelectorComponent,
-  [LessonComponentEnum.Speaker]: SpeakerComponent,
-  [LessonComponentEnum.TextWriter]: TextWriterComponent,
-  // [LessonComponentEnum.VerbSummary]: VerbSummaryComponent,
-  // [LessonComponentEnum.WordSummary]: WordSummaryComponent,
-  [LessonComponentEnum.TranslationSwitcher]: TranslationSwitcherComponent,
-};
-
-export function getLessonComponentClass(type: LessonComponentsType) {
-  return LessonComponents[type];
-}
-
-export interface LessonCompSettings {
-  response?: string;
-  responses?: string; // en caso de que haya multiples respuestas
-  options?: string[]; // optiones para visualizar
-  text?: string;
-  hint?: string;
-  explanation?: string;
-}
-// Make LessonComponentConfiguration generic for settings
-export interface LessonComponentConfiguration<T extends LessonCompSettings = LessonCompSettings> {
-  id?: string;
-  component: LessonComponentEnum;
-  settings?: T; // for component that need and standards
-  inputs?: Record<string, any>; // for whatever component.
-}
-
-export interface StorageFile {
-  bucket: string;
-  url: string;
-  path: string; // path where the file is in the storage
-}
-
-export interface AudioStorage extends StorageFile {
-  text?: string;
-  voiceType?: string;
-}
-// Make SpeakerCompConfiguration extend the generic base interface
-export interface SpeakerCompConfiguration extends LessonComponentConfiguration<LessonCompSettings & { voice: string }> {
-  audio: AudioStorage;
-  // settings is now inherited correctly via the generic type argument
-}
-
-export interface LessonComponentInterface {
-  // Update config to use the generic form
-  config: LessonComponentConfiguration<any>;
-
-  control?: UntypedFormControl;
-
-  validate?(): boolean | null;
-  evaluate?(): boolean | null;
-}
-// nuevs
-
-// import { UntypedFormControl } from '@angular/forms';
-
-// import { LessonComponents } from '../models/lessons.class';
-
-export const LESSONS_TOKEN = new InjectionToken<LessonsAbstractService>('Lessons Service');
-
-// Removed duplicate LessonComponentEnum definition
-// Removed duplicate StorageFile definition
-
-export interface ImgStorageData extends StorageFile {
-  fullPath: string; // path + name
-  resolutions: any;
-  resolution: string;
-}
-
-export type LessonImage = ImgStorageData & { type: string };
-
-// Removed duplicate LessonCompSettings definition
-// Removed duplicate LessonComponentConfiguration definition
-
-//  New way of render components
-export interface DynamicContentComponent {
-  id: string; // duplicated id
-  component: LessonComponentEnum; // name of the component
-  inputs: Record<string, any>;
-  config: LessonComponentConfiguration<any>;
-}
-
-type StorageType = StorageFile & { type: string };
-
-export interface Media {
-  audios?: StorageType[];
-  images?: StorageType[];
-}
-
-export interface ILessonExtra {
-  notionPageId?: string;
-}
-
-export interface ILesson {
-  // me faltan los comentarios
-  _id: any;
-  id: string;
-  title: string;
-  description: string;
-  isPublished: boolean;
-  // isPrivate: boolean;
-  textCoded: string;
-  authorId: string;
-  authorEmail: string;
-  tags: string[];
-  media: Media;
-  // Update components array to use generic form
-  components: Array<LessonComponentConfiguration<any>>;
-  dynamicComponents: Record<string, DynamicContentComponent>;
-  baseLang: string;
-  targetLang: string;
-
-  generatedByAI: boolean;
-  prompt: string;
-  level: number;
-  extras: ILessonExtra;
-}
-
-export interface ILessonWithTaken extends ILesson {
-  // FIXME: moved to lessons lib
-
-  taken: any;
-}
-
-// Think on someway of getting the toast alerts service
-
-export abstract class LessonsAbstractService {
-  abstract getLessons(paginator?: any): Promise<any>;
-  abstract getLesson(id: string): Promise<any>;
-  abstract postLesson(lesson: ILesson): Promise<any>;
-  abstract updateLesson(lesson: ILesson): Promise<any>;
-  abstract deleteLesson(id: string): Promise<any>;
-  abstract generateLesson(lesson: ILesson): Promise<any>;
-  abstract postGenerateByAI(id: string): Promise<any>;
-  abstract extractTextFromHtml(html: string): string;
-}
-
-// my-service.provider.ts
-export function provideLessonsService(serviceImplementation: Type<LessonsAbstractService>): Provider[] {
-  return [
-    {
-      provide: LESSONS_TOKEN,
-      useExisting: serviceImplementation,
-    },
-  ];
-}
-
-// export type LessonComponentsType = 'selector' | 'speaker' | 'text-writer' | 'verb-summary' | 'word-summary';
-
-// export function getLessonComponentClass(type: LessonComponentsType) {
-//   // return LessonComponents[type];
-//   return null;
-// }
-
-// Removed duplicate LessonComponentConfiguration definition
-// Removed duplicate StorageFile definition
-// Removed duplicate AudioStorage definition
-// Removed duplicate SpeakerCompConfiguration definition
-// Removed duplicate LessonComponentInterface definition
-
-// export const LessonComponents = {
-//   [LessonComponentEnum.Selector]: 1,
-//   [LessonComponentEnum.Speaker]: 2,
-//   [LessonComponentEnum.TextWriter]: 3,
-//   [LessonComponentEnum.VerbSummary]: 4,
-//   [LessonComponentEnum.WordSummary]: 5,
-//   [LessonComponentEnum.TranslationSwitcher]: 6,
-// }
-
-export const LangCodeDescription = {
-  es: 'Spanish',
-  en: 'English',
-  it: 'Italian',
-  pt: 'Portuguese',
-  fr: 'French',
-};
-
-export const LangCodeDescriptionEs = {
-  es: 'Español',
-  en: 'Inglés',
-  it: 'Italiano',
-  pt: 'Portugués',
-  fr: 'Frances',
-};

package/src/lib/components/lesson-mini-components/components/selector/selector-builder/selector-builder.component.html

@@ -1,62 +0,0 @@
-<div>
-  <div>
-    <p-message>Construcción del componente de Selección, sirve para hacer una pregunta y mostrar varias opciones, ejemplo:</p-message>
-  </div>
-
-  <div>
-    <span>En que año llegó cristobal colon a america?</span>
-    <app-selector [config]="sampleConfig"></app-selector>
-  </div>
-
-  <hr />
-
-  <div>
-    <form class="builder-form" [formGroup]="formGroup">
-      <input class="form-input" type="text" pInputText fullWidth formControlName="response" placeholder="Respuesta Correcta..." />
-      <br />
-
-      <input class="form-input" type="" pInputText fullWidth formControlName="hint" placeholder="Escribe una pista para esta pregunta" />
-
-      <br />
-      <input
-        class="form-input"
-        type="text"
-        pInputText
-        fullWidth
-        formControlName="explanation"
-        placeholder="Excribe una explicación para la respuesta" />
-
-        <hr />
-        <h6>Opciones</h6>
-
-        <div class="form-group" formArrayName="options">
-          @for (item of optionsForm.controls; track item; let i = $index) {
-            <div
-              style="display: flex; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 10px; flex-direction: column"
-              >
-              <div>
-                <input type="text" pInputText fullWidth [formControlName]="i" />
-                <p-button (click)="deleteFormArrayByIndex('options', i)" icon="pi pi-times" severity="danger"></p-button>
-              </div>
-            </div>
-          }
-        </div>
-
-        <p-button (click)="pushControlToFormArray('options')" label="Agregar Opción" [text]="true" severity="help"></p-button>
-      </form>
-
-      <!-- <button nbButton (click)="isRendered = !isRendered"> Renderizar </button> -->
-
-      @if (isRendered) {
-        <div>
-          <!-- TODO:  probably i need to pass some params -->
-          <app-selector></app-selector>
-        </div>
-      }
-    </div>
-
-    <div>
-      <p-button (click)="copyToClipboard()" [disabled]="formGroup.invalid" label="Copia Código" [rounded]="true"></p-button>
-      <p-button (click)="showCode()" [disabled]="formGroup.invalid" label="Mostrar" [rounded]="true" severity="secondary"></p-button>
-    </div>
-  </div>

package/src/lib/components/lesson-mini-components/components/selector/selector-builder/selector-builder.component.scss

@@ -1,15 +0,0 @@
-nb-card{
-  width: 60vw;
-}
-
-.builder-form{
-  padding: 5px;
-}
-
-.form-input{
-  margin-top: 10px;
-}
-
-.mar-top{
-  margin: 5px;
-}

package/src/lib/components/lesson-mini-components/components/selector/selector-builder/selector-builder.component.ts

@@ -1,70 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { UntypedFormArray, FormsModule, ReactiveFormsModule, FormBuilder } from '@angular/forms';
-
-
-import { InputTextModule } from 'primeng/inputtext';
-import { ButtonModule } from 'primeng/button';
-import { DynamicDialogRef } from 'primeng/dynamicdialog';
-import { MessageModule } from 'primeng/message';
-
-import { ComponentBuilder } from '../../ComponentBuilder';
-import { SelectorComponent } from '../selector.component';
-import { LessonComponentConfiguration, LessonComponentEnum } from '../../lessons.clases';
-
-@Component({
-  selector: 'app-selector-builder',
-  templateUrl: './selector-builder.component.html',
-  styleUrls: ['./selector-builder.component.scss'],
-  standalone: true,
-  imports: [FormsModule, ReactiveFormsModule, SelectorComponent, InputTextModule, ButtonModule, MessageModule],
-})
-export class SelectorBuilderComponent extends ComponentBuilder implements OnInit {
-  constructor(
-    protected override formBuilder: FormBuilder,
-    // protected override toastrService: ToastService,
-    protected override ref: DynamicDialogRef,
-  ) {
-    super(formBuilder, null);
-  }
-  public sampleConfig: LessonComponentConfiguration = {
-    id: '1',
-    component: LessonComponentEnum.Selector,
-    settings: {
-      options: ['fourteen ninety-two', 'fourteen ninety-six', 'fifteen ninety-one'],
-      response: 'fourteen ninety-two',
-      hint: 'Pista para la respuesta',
-      explanation: 'Explicación de la respuesta',
-      responses: 'Opción 1, Opción 2, Opción 3',
-      text: 'Texto de la pregunta',
-    },
-  };
-
-  // public formGroup = this.formBuilder.group({
-  //   options: this.formBuilder.array([]),
-  //   response: ['', Validators.required],
-  //   hint: [],
-  //   explanation: [],
-  // });
-
-  ngOnInit(): void {
-    this.formGroup.get('response');
-  }
-
-  public isRendered;
-
-  //TODO Probablemente estos 3 pueden irse a una clase abstracta
-
-  public pushControlToFormArray(controlName: string): void {
-    this.formGroup.controls.options.push(this.formBuilder.control(''));
-    // (this.formGroup.get(controlName) as UntypedFormArray).push(this.formBuilder.control(''));
-    console.log(this.formGroup.controls.options);
-  }
-
-  public deleteFormArrayByIndex(controlName: string, index: number): void {
-    (this.formGroup.get(controlName) as UntypedFormArray).removeAt(index);
-  }
-
-  get optionsForm(): UntypedFormArray {
-    return this.formGroup.get('options') as UntypedFormArray;
-  }
-}

package/src/lib/components/lesson-mini-components/components/selector/selector.component.html

@@ -1 +0,0 @@
-<p-select [class]="status" placeholder="Selecciona" [options]="config.settings.options" [formControl]="control"></p-select>

package/src/lib/components/lesson-mini-components/components/selector/selector.component.scss

@@ -1,12 +0,0 @@
-::ng-deep .comp-selector button {
-    min-width: 80px;
-  };
-
-
-  .warning{
-    border-color: #f0ad4e;
-}
-
-.danger{
-    border-color: #e1211b;
-}

package/src/lib/components/lesson-mini-components/components/selector/selector.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { SelectorComponent } from './selector.component';
-
-describe('SelectorComponent', () => {
-  let component: SelectorComponent;
-  let fixture: ComponentFixture<SelectorComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-    imports: [SelectorComponent]
-})
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(SelectorComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/components/lesson-mini-components/components/selector/selector.component.ts

@@ -1,47 +0,0 @@
-import { Component, Input } from '@angular/core';
-
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { SelectModule } from 'primeng/select';
-
-import { ComponentWithForm } from '../ComponentWithForm';
-import { LessonComponentConfiguration, LessonComponentInterface } from '../lessons.clases';
-
-@Component({
-  selector: 'app-selector',
-  templateUrl: './selector.component.html',
-  styleUrls: ['./selector.component.scss'],
-  standalone: true,
-  imports: [FormsModule, ReactiveFormsModule, SelectModule],
-})
-export class SelectorComponent extends ComponentWithForm implements LessonComponentInterface {
-  public isFilled = false;
-
-  constructor() {
-    super();
-  }
-  @Input() config: LessonComponentConfiguration;
-
-  public evaluate() {
-    let result;
-    if (this.control.value == null) {
-      result = null;
-    } else {
-      result = this.control.value?.toLowerCase().trim() === this.config.settings.response.toLowerCase().trim();
-    }
-
-    if (result) {
-      this.status = 'success';
-    } else {
-      this.status = 'danger';
-    }
-    this.isFilled = true;
-    return result;
-  }
-
-  public override validate() {
-    if (this.control.invalid) {
-      this.status = 'warning';
-    }
-    return true;
-  }
-}

package/src/lib/components/lesson-mini-components/components/speaker/speaker-builder/speaker-builder.component.html

@@ -1,13 +0,0 @@
-<div>
-  <div>
-    <h5>Constructor de Speaker</h5>
-  </div>
-
-  <lib-ngx-tts (ttsGenerated)="handleTtsGenerated($event)"></lib-ngx-tts>
-
-  <br />
-  <div>
-    <p-button (click)="copyToClipboard()" [disabled]="formGroup.invalid" label="Copia Código" [rounded]="true"></p-button>
-    <p-button (click)="showCode()" [disabled]="!tts()" label="Mostrar" [rounded]="true" severity="secondary"></p-button>
-  </div>
-</div>

package/src/lib/components/lesson-mini-components/components/speaker/speaker-builder/speaker-builder.component.ts

@@ -1,40 +0,0 @@
-import { Component, signal } from '@angular/core';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { ComponentBuilder } from '../../ComponentBuilder';
-import { ButtonModule } from 'primeng/button';
-import { InputTextModule } from 'primeng/inputtext';
-import { DropdownModule } from 'primeng/dropdown';
-import { NgxTtsComponent, TTSGenerated } from '@dataclouder/ngx-tts';
-import { LessonComponentConfiguration, LessonCompSettings } from '../../lessons.clases';
-
-@Component({
-  selector: 'app-speaker-builder',
-  templateUrl: './speaker-builder.component.html',
-  styleUrls: ['./speaker-builder.component.scss'],
-  standalone: true,
-  imports: [FormsModule, ReactiveFormsModule, InputTextModule, ButtonModule, DropdownModule, NgxTtsComponent],
-})
-export class SpeakerBuilderComponent extends ComponentBuilder {
-  public tts = signal<TTSGenerated | undefined>(undefined);
-
-  public handleTtsGenerated(event: TTSGenerated): void {
-    console.log('TTS generated:', event);
-    this.tts.set(event);
-  }
-
-  // Update return type and add settings object
-  protected override getCode(): LessonComponentConfiguration<LessonCompSettings & { voice: string }> {
-    const ttsValue = this.tts();
-    if (!ttsValue) {
-      // Handle the case where tts is undefined, maybe throw an error or return a default config
-      console.error('TTS data is not generated yet.');
-      // Depending on requirements, you might return a default/empty config or throw
-      return { component: this.questionType, inputs: {} }; // Example: return empty inputs
-    }
-    const code: LessonComponentConfiguration<LessonCompSettings & { voice: string }> = {
-      component: this.questionType,
-      inputs: { tts: ttsValue },
-    };
-    return code;
-  }
-}

package/src/lib/components/lesson-mini-components/components/speaker/speaker.component.html

@@ -1,9 +0,0 @@
-<button
-  pButton
-  style="padding: 0px 2px"
-  severity="help"
-  size="small"
-  (click)="speach()"
-  [label]="config?.settings?.text"
-  [text]="true"
-  [rounded]="true"></button>

package/src/lib/components/lesson-mini-components/components/speaker/speaker.component.scss

@@ -1,3 +0,0 @@
-.lisen{
-  cursor: pointer;
-}

package/src/lib/components/lesson-mini-components/components/speaker/speaker.component.ts

@@ -1,33 +0,0 @@
-// ❌ can use this until i copy services to this lib
-import { Component, Input, OnInit } from '@angular/core';
-import { ButtonModule } from 'primeng/button';
-import { SpeakerCompConfiguration } from '../lessons.clases';
-import { TTSGenerated } from '@dataclouder/ngx-tts';
-
-// import { CONVERSATION_AI_TOKEN } from '@dataclouder/ngx-agent-cards';
-@Component({
-  selector: 'app-speaker',
-  templateUrl: './speaker.component.html',
-  styleUrls: ['./speaker.component.scss'],
-  standalone: true,
-  imports: [ButtonModule],
-})
-export class SpeakerComponent implements OnInit {
-  ngOnInit(): void {
-    // throw new Error('Method not implemented.');
-  }
-  @Input() config: SpeakerCompConfiguration;
-  @Input() tts: TTSGenerated | undefined;
-
-  //   voiceOptions = VoiceOptions;
-  //   constructor(private speachService: SpeechService, private audioService: AudioService) {}
-  //   ngOnInit(): void {}
-  public speach() {
-    console.log('should speech but will do in next version');
-    //   if (this.config.audio) {
-    //     this.audioService.playAudio(this.config.audio.url);
-    //   } else {
-    //     this.speachService.speach(this.config.settings.text);
-    //   }
-  }
-}

package/src/lib/components/lesson-mini-components/components/text-writer/text-writer-buider/text-writer-buider.component.html

@@ -1,24 +0,0 @@
-<div>
-  <div>
-    <h5>Constructor de formulario con texto</h5>
-  </div>
-
-  <div>
-    <form class="builder-form" [formGroup]="formGroup">
-      <input pInputText type="text" nbInput fullWidth formControlName="response" placeholder="Respuesta" />
-
-      <input pInputText class="form-input" type="" nbInput fullWidth formControlName="hint"
-        placeholder="Escribe una pista para esta pregunta" />
-
-      <input pInputText class="form-input" type="text" nbInput fullWidth formControlName="explanation"
-        placeholder="Excribe una explicación para la respuesta" />
-    </form>
-  </div>
-
-  <div>
-    <p-button (click)="copyToClipboard()" [disabled]="formGroup.invalid" label="Copia Código"
-      [rounded]="true"></p-button>
-    <p-button (click)="showCode()" [disabled]="formGroup.invalid" label="Mostrar" [rounded]="true"
-      severity="secondary"></p-button>
-  </div>
-</div>

package/src/lib/components/lesson-mini-components/components/text-writer/text-writer-buider/text-writer-buider.component.scss

@@ -1,15 +0,0 @@
-nb-card{
-  width: 60vw;
-}
-
-.builder-form{
-  padding: 5px;
-}
-
-.form-input{
-  margin-top: 10px;
-}
-
-.mar-top{
-  margin: 5px;
-}

package/src/lib/components/lesson-mini-components/components/text-writer/text-writer-buider/text-writer-buider.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TextWriterBuiderComponent } from './text-writer-buider.component';
-
-describe('TextWriterBuiderComponent', () => {
-  let component: TextWriterBuiderComponent;
-  let fixture: ComponentFixture<TextWriterBuiderComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-    imports: [TextWriterBuiderComponent]
-})
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(TextWriterBuiderComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});