@dataclouder/ngx-lessons 0.0.30 → 0.0.32

package/src/lib/components/dc-lessons/dc-lesson-renderer/dc-lesson-renderer.component.html

@@ -1,27 +0,0 @@
-<div>
-  <!-- <div *ngIf="lesson">
-     {lesson.title }} 
-    <br>
-    <img [src]="imageCover" alt="">
-  </div> -->
-
-  <div #dynamicLesson class="targetclass">
-    <ng-template #target></ng-template>
-  </div>
-</div>
-
-<br />
-<div style="display: flex; gap: 10px">
-  <div *ngIf="(mainForm.controls | keyvalue)?.length">
-    <p-button label="Calificar Lección" icon="pi pi-check-circle" (click)="evaluateForms()" [rounded]="true"></p-button>
-  </div>
-
-  <p-button icon="pi pi-verified" [rounded]="true" (click)="startAI()" label="Repasar con IA" />
-</div>
-<br /><br />
-
-@if(chatVisible) {
-<p-drawer header="Conversation" [(visible)]="chatVisible" position="bottom" styleClass="app-bottom-overlay">
-  <dc-chat [agentCard]="agentMasterLesson" [evaluatorAgentCard]="evaluatorAgentCard"></dc-chat>
-</p-drawer>
-}

package/src/lib/components/dc-lessons/dc-lesson-renderer/dc-lesson-renderer.component.scss

@@ -1,3 +0,0 @@
-.evaluate{
-  float: right;
-}

package/src/lib/components/dc-lessons/dc-lesson-renderer/dc-lesson-renderer.component.ts

@@ -1,271 +0,0 @@
-import { Component, ComponentRef, ElementRef, Inject, Input, OnInit, Renderer2, ViewChild, ViewContainerRef } from '@angular/core';
-import { UntypedFormGroup, Validators } from '@angular/forms';
-import { ActivatedRoute } from '@angular/router';
-import { NgIf, KeyValuePipe } from '@angular/common';
-
-import { ButtonModule } from 'primeng/button';
-
-import {
-  getLessonComponentClass,
-  ILesson,
-  LangCodeDescription,
-  LessonComponentConfiguration,
-  LessonComponentsType,
-  LESSONS_TOKEN,
-  LessonsAbstractService,
-} from '../../lesson-mini-components/components/lessons.clases';
-
-import { TOAST_ALERTS_TOKEN, ToastAlertsAbstractService } from '@dataclouder/ngx-core';
-import { LessonComponentInterface } from '../../lesson-mini-components/components/lessons.clases';
-import { ComponentWithForm } from '../../lesson-mini-components/components/ComponentWithForm';
-import {
-  CONVERSATION_AI_TOKEN,
-  AgentCardsAbstractService,
-  DCConversationPromptBuilderService,
-  DCChatComponent,
-  IAgentCard,
-  ConversationType,
-  TextEngines,
-  IMiniAgentCard,
-} from '@dataclouder/ngx-agent-cards';
-
-import { DrawerModule } from 'primeng/drawer';
-
-// TODO: i need strategy to create prompt dinamically dpending on user language and level.
-const DefaultLessonAgentCard: IAgentCard = {
-  conversationSettings: {
-    conversationType: ConversationType.General,
-    textEngine: TextEngines.SimpleText,
-    autoStart: true,
-  },
-  characterCard: {
-    data: {
-      name: 'Lesson Master',
-      description: 'You are an AI developed by Polilan Company, you are a lesson master, you are going to help the user to learn english',
-      tags: ['lesson', 'master', 'ai'],
-      post_history_instructions:
-        'Your reply should be always short, 1 or 2 paragraphs at most, and to the point, and you should ask friendly questions all the time',
-    },
-  },
-  model: { provider: 'google' },
-};
-
-@Component({
-  selector: 'dc-lesson-renderer',
-  templateUrl: './dc-lesson-renderer.component.html',
-  styleUrls: ['./dc-lesson-renderer.component.scss'],
-  standalone: true,
-  imports: [NgIf, KeyValuePipe, ButtonModule, DCChatComponent, DrawerModule],
-})
-export class DCLessonRendererComponent implements OnInit {
-  @Input() public lesson: ILesson;
-  @Input() public test: boolean;
-
-  @ViewChild('dynamicLesson', { static: true }) dynamicLesson: ElementRef;
-
-  public lessonId: string = this.activatedRoute.snapshot.paramMap.get('id');
-  public dataText: string = `<h1>Nueva lección </h1> <p> Texto aquí</p>`;
-  public components: { [key: string]: ComponentRef<LessonComponentInterface> } = {};
-  public mainForm: UntypedFormGroup = new UntypedFormGroup({});
-  public imageCover: string;
-
-  public chatVisible: boolean = false;
-
-  constructor(
-    private renderer: Renderer2,
-    private viewContainerRef: ViewContainerRef,
-    private activatedRoute: ActivatedRoute,
-    @Inject(TOAST_ALERTS_TOKEN) private toastrService: ToastAlertsAbstractService,
-    @Inject(LESSONS_TOKEN) private lessonService: LessonsAbstractService,
-    @Inject(CONVERSATION_AI_TOKEN) private agentCardsService: AgentCardsAbstractService,
-    private conversationBuilder: DCConversationPromptBuilderService, // private userService: UserService,
-  ) {}
-
-  ngOnInit(): void {
-    this.initLesson();
-  }
-
-  public async initLesson() {
-    await this.getLessonIfId();
-    this.renderLesson();
-  }
-
-  public async getLessonIfId() {
-    if (this.lesson) {
-      return;
-    }
-
-    if (!this.lessonId) {
-      return;
-    }
-    this.dataText = `<h1>Cargando </h1> <p>...</p>`;
-    this.lesson = await this.lessonService.getLesson(this.lessonId);
-    console.log('lesson', this.lesson);
-  }
-
-  private renderLesson(): void {
-    this.imageCover = this.lesson.media?.images?.find((img) => img.type === 'cover')?.url;
-
-    console.log('imageCover', this.imageCover);
-    // Pasos para renderizar,
-    // 0) Usar la expresión regular para  sustitur los componentes por un span con un id
-    // 1) En el mismo proceso de remplazar se contruyen dinamicamente los componentes
-    // 2) Agregar componentes al DOM en su respectivo spanid
-
-    // TODO Optimización, es posible agregar el componente al DOM  en el mismo paso en que se crea el span?
-
-    const r1 = new RegExp('~(.+?)~', 'g');
-    let count = 0;
-    this.components = {}; //Si se destruye la lección, se destruyen todos los componentes dinamicis? tODO necesito reiniciar?
-
-    const lessonHtml = this.lesson.textCoded.replace(r1, (_matching, jsonCoded) => {
-      const componentName = `dynamicComp${count}`;
-      count++;
-      const componentRef = this.createComponentReferenceWithJson(jsonCoded);
-      if (!componentRef) {
-        return null;
-      }
-      this.components[componentName] = componentRef;
-      if (componentRef.instance.control) {
-        // Algunos componentes tienen formularios, estos se copian en mainForm como un unico control
-        this.mainForm.addControl(componentName, componentRef.instance.control);
-        this.mainForm.get(componentName).setValidators([Validators.required]);
-      }
-      return `<span id="${componentName}"></span>`;
-    });
-
-    this.dynamicLesson.nativeElement.innerHTML = lessonHtml;
-
-    for (let compName of Object.keys(this.components)) {
-      // Interpolar componentes dentro del lugar correspondiente
-      const elementRef = document.getElementById(compName);
-      this.addComponentToNode(this.components[compName], elementRef);
-    }
-  }
-
-  private addComponentToNode(componentRef: ComponentRef<LessonComponentInterface>, nodeDOM: any) {
-    this.renderer.appendChild(nodeDOM, componentRef.location.nativeElement);
-  }
-
-  private createComponentReferenceWithJson(json: string): ComponentRef<LessonComponentInterface> {
-    const lessonCodedConfig: LessonComponentConfiguration = JSON.parse(json);
-
-    let componentConfig;
-    if (this.lesson.components && lessonCodedConfig.id) {
-      // TODO: retomar, Creo que esta linea es para reutilziar los componentes por id, pero si no tiene,
-      componentConfig = this.lesson.components.find((comp) => comp.id === lessonCodedConfig.id);
-    }
-
-    const LessonClass = getLessonComponentClass(<LessonComponentsType>lessonCodedConfig.component);
-
-    if (!LessonClass) {
-      console.error('No existe este componente, revisa el codigo insertado' + json);
-      // throw new Error('No existe este com revisa el codigo insertado');
-      return null;
-    }
-
-    const componentRef = this.viewContainerRef.createComponent<LessonComponentInterface>(LessonClass);
-    componentRef.instance.config = componentConfig || lessonCodedConfig;
-    return componentRef;
-  }
-
-  public async evaluateForms() {
-    if (!this.mainForm.valid) {
-      for (let controlName of Object.keys(this.mainForm.controls)) {
-        this.components[controlName].instance.validate();
-      }
-      this.toastrService.warn({ subtitle: 'Por favor completa todos los formularios', title: 'Espera' });
-      return;
-    }
-
-    const rates = { correct: 0, incorrect: 0, score: 0 };
-
-    for (let controlName of Object.keys(this.mainForm.controls)) {
-      const instance = this.components[controlName].instance;
-      if (instance instanceof ComponentWithForm) {
-        // TODO: quizá no necesito validar  instanceof ComponentWithForm ya que se garantiza que todo en mainform tiene un control.
-        try {
-          const result = instance.evaluate();
-          if (result) {
-            rates.correct++;
-          } else {
-            rates.incorrect++;
-          }
-        } catch (err) {
-          console.error('Validation method for instance is failing', instance);
-        }
-      }
-    }
-    if (this.test) {
-      return;
-    }
-    rates.score = rates.correct / (rates.correct + rates.incorrect);
-
-    const status = rates.score > 0.7 ? 'passed' : 'failed';
-
-    const takenLesson = { lessonId: this.lesson.id, status: status, score: rates.score };
-    // TODO: implementar el servicio para guardar la lección tomada
-    // await this.lessonService.saveTakenLesson(takenLesson);
-
-    if (status === 'passed') {
-      this.toastrService.success({ subtitle: 'Aprobaste, se guardó tu calificación', title: 'Muy bien' });
-    } else {
-      this.toastrService.warn({ subtitle: 'Revisa tus respuestas', title: 'Algunas preguntas no son correctas' });
-    }
-  }
-
-  public agentMasterLesson: IAgentCard;
-
-  public evaluatorAgentCard: IMiniAgentCard;
-
-  public async startAI() {
-    // TODO: para refactorizar y utilizar las lecciones en otro componente, voy a necesitar pasar esto al servicio abstracto asi cada aplicación lo implementa.
-    const lessonText = this.lessonService.extractTextFromHtml(this.lesson.textCoded);
-
-    const scenario = `The user is reading lessons through this app interface. They will now talk with you, and you need to evaluate their understanding of the lesson. 
-    Ask friendly questions throughout the conversation and help them learn English. Here is the lesson text the user just read:
-    ${lessonText}
-    In your next reply, start by greeting the user, asking something about the lesson, and then continue the conversation.`;
-
-    // const user = this.userService.getUserSnapshot();
-    alert('i need to fix this, need to find a way to pass user throug the service not the library, i think i already started something.');
-    const user = {} as any;
-    const targetLevel = parseInt(user.languageProgress[user.settings.targetLanguage].level);
-
-    const langTargetDesc = LangCodeDescription[user.settings.targetLanguage];
-    const langBaseDesc = LangCodeDescription[user.settings.baseLanguage];
-
-    let userInformationPrompt = `
-    User information: user name is ${user.personalData.firstname} ${user.personalData.lastname}, their native language is ${langBaseDesc}, 
-    and right now is learning ${langTargetDesc}, their current level is ${user.languageProgress[user.settings.targetLanguage].level} out of 5.`;
-
-    if (targetLevel <= 2) {
-      userInformationPrompt += `\nUser is a beginner in english, always reply in ${langBaseDesc}, but during the conversation use simple words in ${langTargetDesc}`;
-    }
-
-    console.log('lessonText', lessonText);
-
-    const lessonAgentCard: IAgentCard = DefaultLessonAgentCard;
-    lessonAgentCard.characterCard.data.scenario = scenario;
-    lessonAgentCard.characterCard.data.post_history_instructions += `\n${userInformationPrompt}`;
-    this.agentMasterLesson = lessonAgentCard;
-
-    this.evaluatorAgentCard = this.getDefualtLessonEvaluatorAgentCard(lessonText);
-    this.chatVisible = true;
-  }
-
-  private getDefualtLessonEvaluatorAgentCard(lessonText: string): IMiniAgentCard {
-    return {
-      expectedResponseType: `interface EvalResult {
-        score: number;                       // Score of the user's response 0 to 3
-        feedback: string;                    // Feedback of the user's understanding of the conversation
-      }`,
-      messages: [],
-      model: { id: 'gpt-4o-mini', provider: 'openai' },
-      sources: [lessonText],
-      task: `User is reading a taking a lesson, now their are having a conversation, 
-      you have to evaluate the current conversation, and give a feedback of the user understanding of the lesson, 
-      this is the lesson:  ${lessonText}`,
-    };
-  }
-}

package/src/lib/components/dc-lessons/lesson-form/lesson-form.component.html

@@ -1,5 +0,0 @@
-<div class="lesson-form-container">
-  <h2>Lesson Form</h2>
-  <p>Esto es dentro del componente de la leccion</p>
-  <!-- Form implementation will go here -->
-</div>

package/src/lib/components/dc-lessons/lesson-form/lesson-form.component.scss

@@ -1,3 +0,0 @@
-.lesson-form-container {
-  padding: 1rem;
-} 

package/src/lib/components/dc-lessons/lesson-form/lesson-form.component.ts

@@ -1,14 +0,0 @@
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ReactiveFormsModule } from '@angular/forms';
-
-@Component({
-  selector: 'dc-lesson-form',
-  templateUrl: './lesson-form.component.html',
-  styleUrls: ['./lesson-form.component.scss'],
-  standalone: true,
-  imports: [CommonModule, ReactiveFormsModule],
-})
-export class DCLessonFormComponent {
-  // Form implementation will go here
-}

package/src/lib/components/dc-lessons/lesson-list/dc-lesson-list.component.html

@@ -1,30 +0,0 @@
-<dc-filter-bar [customFilters]="customFilters" (onFilterAction)="applyFilterBarEvent($event)"></dc-filter-bar>
-
-@if(viewType === 'table') {
-<app-quick-table [columns]="columns" [tableData]="lessons" [actions]="actions" (onAction)="doOrEmitAction($event)"></app-quick-table>
-} @else {
-<div class="lesson-list-container">
-  @if (!isLoadingLessons && lessons?.length > 0) { @for (lesson of lessons; track lesson._id) {
-  <ng-container
-    #outlet="ngComponentOutlet"
-    [ngComponentOutlet]="cardComponent"
-    [ngComponentOutletInputs]="{
-      lesson: lesson,
-      isAdmin: isAdmin
-    }">
-  </ng-container>
-  } } @else {
-  <p>No se encontraron lecciones disponibles</p>
-  }
-</div>
-}
-
-<p-paginator
-  currentPageReportTemplate="{{ totalRecords }} lecciones"
-  [showCurrentPageReport]="true"
-  (onPageChange)="onPageChange($event)"
-  [first]="paginatorFirst"
-  [rows]="paginatorRows"
-  [totalRecords]="totalRecords"
-  [rowsPerPageOptions]="[10, 20, 30]">
-</p-paginator>

package/src/lib/components/dc-lessons/lesson-list/dc-lesson-list.component.scss

@@ -1,17 +0,0 @@
-:host {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-
-.lesson-list-container {
-  padding: 1rem;
-  flex: 1;
-  overflow-y: auto;
-  min-height: 0; /* This is important for flex containers to respect overflow */
-}
-
-p-paginator {
-  margin-top: auto;
-  padding: 0.5rem 1rem;
-}

package/src/lib/components/dc-lessons/lesson-list/dc-lesson-list.component.ts

@@ -1,170 +0,0 @@
-import { ChangeDetectorRef, Component, EventEmitter, Inject, Input, OnInit, Output, Type, ViewChildren, QueryList, OnDestroy } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { PaginatorModule } from 'primeng/paginator';
-import { NgComponentOutlet } from '@angular/common';
-import { ActivatedRoute, Router, RouterModule } from '@angular/router';
-
-import { Subscription } from 'rxjs';
-import {
-  DCFilterBarComponent,
-  ICustomFilter,
-  OnActionEvent,
-  PaginationBase,
-  PColumn,
-  QuickTableComponent,
-  TOAST_ALERTS_TOKEN,
-  ToastAlertsAbstractService,
-} from '@dataclouder/ngx-core';
-
-import { LESSONS_TOKEN, LessonsAbstractService } from '../../lesson-mini-components/components/lessons.clases';
-import { DcLessonCardComponent } from '../dc-lesson-card/dc-lesson-card.component';
-import { MenuItem } from 'node_modules/primeng/api/menuitem';
-
-const tableViewColumns: PColumn[] = [
-  { field: 'media.images[0].url', header: 'Image', type: 'image' },
-  { field: 'title', header: 'Título' },
-  { field: 'description', header: 'Descripción' },
-];
-
-const TableViewActions: MenuItem[] = [
-  { title: 'select', label: 'Select', icon: 'pi pi-check', severity: 'primary' },
-  { title: 'qr', label: 'QR', icon: 'pi pi-qrcode', severity: 'info' },
-  { title: 'edit', label: 'Edit', icon: 'pi pi-pencil', severity: 'info' },
-  { title: 'delete', label: 'Delete', icon: 'pi pi-trash', severity: 'danger' },
-];
-
-const returnProperties: Record<string, 0 | 1> = { id: 1, title: 1, assets: 1 };
-
-@Component({
-  selector: 'dc-lesson-list',
-  templateUrl: './dc-lesson-list.component.html',
-  styleUrls: ['./dc-lesson-list.component.scss'],
-  standalone: true,
-  imports: [CommonModule, RouterModule, DCFilterBarComponent, PaginatorModule, NgComponentOutlet, QuickTableComponent],
-})
-export class DCLessonListComponent extends PaginationBase implements OnInit, OnDestroy {
-  @Input() public isAdmin: boolean = false;
-  @Input() public customCardComponent?: Type<DcLessonCardComponent>;
-  @Input() public customFilters: ICustomFilter[] = [];
-  @Input() public viewType: 'table' | 'cards' = 'cards';
-
-  @Input() public override actions: MenuItem[] = TableViewActions;
-
-  public override columns: PColumn[] = tableViewColumns;
-
-  @ViewChildren('outlet') outlets!: QueryList<NgComponentOutlet>;
-
-  public cardComponent: Type<DcLessonCardComponent> = null;
-  public cardEventSubs: Subscription[] = [];
-
-  public lessons: any[] = [];
-  public isLoadingLessons = false;
-
-  constructor(
-    private cdr: ChangeDetectorRef,
-    public override router: Router,
-    public override route: ActivatedRoute,
-    @Inject(LESSONS_TOKEN) private lessonsService: LessonsAbstractService,
-    @Inject(TOAST_ALERTS_TOKEN) private toastrService: ToastAlertsAbstractService,
-  ) {
-    super(route, router);
-  }
-
-  ngOnInit(): void {
-    this.filterConfig.returnProps = returnProperties;
-    this.cardComponent = this.customCardComponent || DcLessonCardComponent;
-
-    this.getPaginatedLessons(this.filterConfig);
-  }
-
-  public subscribeDinamicInstantToEvents() {
-    this.clearcardEventSubs();
-    this.subscribeToCardEvents();
-  }
-
-  private subscribeToCardEvents() {
-    this.outlets.forEach((outlet) => {
-      const instance: DcLessonCardComponent = outlet.componentInstance;
-
-      this.cardEventSubs.push(
-        instance.onAction.subscribe((lesson: any) => {
-          this.doOrEmitAction(lesson);
-        }),
-      );
-    });
-  }
-
-  private clearcardEventSubs() {
-    this.cardEventSubs.forEach((sub) => sub.unsubscribe());
-    this.cardEventSubs = [];
-  }
-
-  ngOnDestroy() {
-    this.clearcardEventSubs();
-  }
-
-  public async getPaginatedLessons(paginator: any) {
-    try {
-      this.lessons = null;
-      this.isLoadingLessons = true;
-      this.cdr.detectChanges();
-      const lessons = await this.lessonsService.getLessons(paginator);
-
-      this.lessons = lessons['rows'] || lessons;
-      this.totalRecords = lessons['count'] || this.lessons.length;
-
-      console.log('lessons', lessons);
-
-      setTimeout(() => {
-        this.subscribeDinamicInstantToEvents();
-      });
-    } finally {
-      this.isLoadingLessons = false;
-      this.cdr.detectChanges();
-    }
-  }
-
-  public search(searchText: string) {
-    this.filterConfig['text'] = searchText;
-    this.getPaginatedLessons(this.filterConfig);
-  }
-
-  private removeLesson(lesson: any) {
-    const response = confirm('¿Estás seguro de querer eliminar esta lección?');
-    if (response) {
-      this.lessonsService.deleteLesson(lesson._id);
-      this.lessons = this.lessons.filter((l) => l._id !== lesson._id);
-      this.cdr.detectChanges();
-      this.toastrService.success({ title: 'Adios a la lección', subtitle: 'La lección ha sido eliminada correctamente' });
-    }
-  }
-
-  public newLesson() {
-    this.onAction.emit({ action: 'new' });
-  }
-
-  public applyFilterBarEvent(filterEvent: OnActionEvent) {
-    if (filterEvent.action == 'changeView') {
-      this.viewType = this.viewType === 'table' ? 'cards' : 'table';
-      return;
-    } else {
-      console.log('filterChanged in dc-lesson-list', filterEvent);
-      this.filterConfig = filterEvent.item;
-      this.filterConfig.returnProps = returnProperties;
-
-      this.getPaginatedLessons(this.filterConfig);
-    }
-  }
-
-  protected override loadData(): Promise<void> {
-    return this.getPaginatedLessons(this.filterConfig);
-  }
-
-  public doOrEmitAction(actionEvent: OnActionEvent) {
-    if (actionEvent.action === 'delete') {
-      this.removeLesson(actionEvent.item);
-    } else {
-      this.onAction.emit(actionEvent);
-    }
-  }
-}

package/src/lib/components/dc-lessons/lessons.component.ts

@@ -1,10 +0,0 @@
-import { Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
-  selector: 'app-lessonsv2',
-  template: '<router-outlet></router-outlet>',
-  standalone: true,
-  imports: [RouterOutlet],
-})
-export class LessonsV2Component {}

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

@@ -1,74 +0,0 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormControl } from '@angular/forms';
-import { DynamicDialogRef } from 'primeng/dynamicdialog';
-
-import { LessonComponentBuilders, LessonComponentConfiguration, LessonComponentEnum, LessonCompSettings } from './lessons.clases';
-
-// Create a type that maps the interface to FormControls
-export type LessonCompSettingsForm = {
-  [K in keyof Required<LessonCompSettings>]: FormControl<LessonCompSettings[K]>;
-};
-
-@Component({
-  selector: 'app-component-builder',
-  template: '<div>no template</div>',
-})
-export class ComponentBuilder {
-  constructor(
-    protected formBuilder: FormBuilder,
-    // protected toastrService: ToastService, // protected ref: NbDialogRef<ComponentBuilder>,
-    protected ref: DynamicDialogRef,
-  ) {}
-
-  // Sobreescribir si es necesario
-  // public formGroup = this.formBuilder.group<LessonCompSettings>({});
-
-  public formGroup = this.formBuilder.group({
-    response: new FormControl<string | null>(null),
-    responses: new FormControl<string | null>(null),
-    options: this.formBuilder.array([]),
-    text: new FormControl<string | null>(null),
-    hint: new FormControl<string | null>(null),
-    explanation: new FormControl<string | null>(null),
-  });
-
-  // Every component knows its type by comparing agains LessonComponentBuilders
-  get questionType(): LessonComponentEnum {
-    const self = this;
-
-    const name = Object.keys(LessonComponentBuilders).find((componentName: any) => {
-      const componentClass = LessonComponentBuilders[componentName];
-      if (self instanceof componentClass) {
-        return componentName;
-      }
-    });
-
-    return <LessonComponentEnum>name;
-  }
-
-  private getCode(): string {
-    const data = this.formGroup.value;
-    // Deleting null values
-    Object.keys(data).forEach((key) => {
-      if (data[key] === null) {
-        delete data[key];
-      }
-    });
-    const id = Math.random().toString(36).substring(7);
-    const code: LessonComponentConfiguration = { id: id, component: this.questionType, settings: { ...data } as unknown as LessonCompSettings };
-    return `~${JSON.stringify(code)}~`;
-  }
-
-  public showCode() {
-    const code = this.getCode();
-    alert(code);
-  }
-
-  public async copyToClipboard() {
-    const code = this.getCode();
-    await navigator.clipboard.writeText(code);
-    // this.toastrService.info('Control + V para pegar', 'Se copió al portapapeles');
-    // this.ref.close();
-    this.ref.close(code);
-  }
-}

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;
-}