Refactor return process components for improved naming conventions.

- 🛠️ **Refactor**: Updated component selectors from 'lib-' to 'oms-feature-' for consistency
- 🎨 **Style**: Enhanced formatting and readability in HTML and TypeScript files

libs/oms/feature/return-process/eslint.config.mjs

@@ -12,7 +12,7 @@ export default [
         'error',
         {
           type: 'attribute',
-          prefix: 'lib',
+          prefix: 'oms-feature',
           style: 'camelCase',
         },
       ],
@@ -20,7 +20,7 @@ export default [
         'error',
         {
           type: 'element',
-          prefix: 'lib',
+          prefix: 'oms-feature',
           style: 'kebab-case',
         },
       ],

libs/oms/feature/return-process/src/lib/return-process-feature.component.html

@@ -16,6 +16,8 @@
 
 @if (returnProcesses(); as processes) {
   @for (process of processes; track process.id) {
-    <lib-return-process-item [returnProcessId]="process.id"></lib-return-process-item>
+    <oms-feature-return-process-item
+      [returnProcessId]="process.id"
+    ></oms-feature-return-process-item>
   }
 }

libs/oms/feature/return-process/src/lib/return-process-feature.component.ts

@@ -1,4 +1,9 @@
-import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  inject,
+} from '@angular/core';
 import { ButtonComponent } from '@isa/ui/buttons';
 import { NgIconComponent, provideIcons } from '@ng-icons/core';
 import { isaActionChevronLeft } from '@isa/icons';
@@ -8,7 +13,7 @@ import { ReturnProcessItemComponent } from './return-process-item/return-process
 import { Location } from '@angular/common';
 
 @Component({
-  selector: 'lib-return-process-feature',
+  selector: 'oms-feature-return-process-feature',
   templateUrl: './return-process-feature.component.html',
   styleUrls: ['./return-process-feature.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,

libs/oms/feature/return-process/src/lib/return-process-item/return-process-item.component.html

@@ -4,7 +4,10 @@
   <div class="return-process-item-header">
     <h3 class="isa-text-subtitle-2-bold">Rückgabe informationen</h3>
     @if (progress(); as progress) {
-      <ui-progress-bar [value]="progress.answered" [maxValue]="progress.total"></ui-progress-bar>
+      <ui-progress-bar
+        [value]="progress.answered"
+        [maxValue]="progress.total"
+      ></ui-progress-bar>
     }
   </div>
   <div
@@ -19,10 +22,14 @@
         class="return-process-item-body__product-image w-14"
       />
       <div class="return-process-item-body__product-info">
-        <div class="return-process-item-body__product-info-contibutors isa-text-body-2-bold">
+        <div
+          class="return-process-item-body__product-info-contibutors isa-text-body-2-bold"
+        >
           {{ product.contributors }}
         </div>
-        <div class="return-process-item-body__product-info-name isa-text-body-2-regular">
+        <div
+          class="return-process-item-body__product-info-name isa-text-body-2-regular"
+        >
           {{ product.name }}
         </div>
         <div class="return-process-item-body__product-info-format">
@@ -32,19 +39,23 @@
       </div>
     </div>
 
-    <lib-return-process-questions
+    <oms-feature-return-process-questions
       [returnProcessId]="returnProcessId()"
-    ></lib-return-process-questions>
+    ></oms-feature-return-process-questions>
   </div>
   @switch (eligible.state) {
     @case ('eligible') {
-      <div class="text-isa-accent-green isa-text-body-2-bold flex items-center gap-1">
+      <div
+        class="text-isa-accent-green isa-text-body-2-bold flex items-center gap-1"
+      >
         <ng-icon name="isaActionCheck" size="1.5rem"></ng-icon>
         <span>Artikel bereit für Rückgabe</span>
       </div>
     }
     @case ('not-eligible') {
-      <div class="text-isa-accent-red isa-text-body-2-bold flex items-center gap-1">
+      <div
+        class="text-isa-accent-red isa-text-body-2-bold flex items-center gap-1"
+      >
         <ng-icon name="isaActionClose" size="1.5rem"></ng-icon>
         <span>{{ eligible.reason }}</span>
       </div>

libs/oms/feature/return-process/src/lib/return-process-item/return-process-item.component.ts

@@ -1,14 +1,24 @@
-import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  inject,
+  input,
+} from '@angular/core';
 import { ProductImageDirective } from '@isa/shared/product-image';
 import { ReturnProcessService, ReturnProcessStore } from '@isa/oms/data-access';
 import { NgIconComponent, provideIcons } from '@ng-icons/core';
-import { ProductFormatIconGroup, isaActionCheck, isaActionClose } from '@isa/icons';
+import {
+  ProductFormatIconGroup,
+  isaActionCheck,
+  isaActionClose,
+} from '@isa/icons';
 import { LowerCasePipe } from '@angular/common';
 import { ReturnProcessQuestionsComponent } from '../return-process-questions/return-process-questions.component';
 import { ProgressBarComponent } from '@isa/ui/progress-bar';
 
 @Component({
-  selector: 'lib-return-process-item',
+  selector: 'oms-feature-return-process-item',
   templateUrl: './return-process-item.component.html',
   styleUrls: ['./return-process-item.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -20,7 +30,9 @@ import { ProgressBarComponent } from '@isa/ui/progress-bar';
     ReturnProcessQuestionsComponent,
     ProgressBarComponent,
   ],
-  providers: [provideIcons({ ...ProductFormatIconGroup, isaActionCheck, isaActionClose })],
+  providers: [
+    provideIcons({ ...ProductFormatIconGroup, isaActionCheck, isaActionClose }),
+  ],
 })
 export class ReturnProcessItemComponent {
   #returnProcessService = inject(ReturnProcessService);
@@ -33,7 +45,9 @@ export class ReturnProcessItemComponent {
   });
 
   progress = computed(() => {
-    return this.#returnProcessService.returnProcessQuestionsProgress(this.returnProcess());
+    return this.#returnProcessService.returnProcessQuestionsProgress(
+      this.returnProcess(),
+    );
   });
 
   eligibleForReturn = computed(() => {

libs/oms/feature/return-process/src/lib/return-process-questions/return-process-product-question/return-process-product-question.component.ts

@@ -1,4 +1,11 @@
-import { ChangeDetectionStrategy, Component, effect, inject, input, signal } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  effect,
+  inject,
+  input,
+  signal,
+} from '@angular/core';
 import {
   AbstractControl,
   FormControl,
@@ -7,16 +14,25 @@ import {
   ValidatorFn,
   Validators,
 } from '@angular/forms';
-import { Product, ReturnProcessProductQuestion, ReturnProcessStore } from '@isa/oms/data-access';
+import {
+  Product,
+  ReturnProcessProductQuestion,
+  ReturnProcessStore,
+} from '@isa/oms/data-access';
 import { TextButtonComponent } from '@isa/ui/buttons';
-import { InputControlDirective, TextFieldComponent } from '@isa/ui/input-controls';
+import {
+  InputControlDirective,
+  TextFieldComponent,
+} from '@isa/ui/input-controls';
 import { rxMethod } from '@ngrx/signals/rxjs-interop';
 import { filter, pipe, switchMap, tap } from 'rxjs';
 import { CatalougeSearchService } from '@isa/catalogue/data-access';
 import { tapResponse } from '@ngrx/operators';
 import { ProductImageDirective } from '@isa/shared/product-image';
 
-const eanValidator: ValidatorFn = (control: AbstractControl): ValidationErrors | null => {
+const eanValidator: ValidatorFn = (
+  control: AbstractControl,
+): ValidationErrors | null => {
   const value = control.value;
   if (value && !/^[0-9]{13}$/.test(value)) {
     return { invalidEan: true };
@@ -25,7 +41,7 @@ const eanValidator: ValidatorFn = (control: AbstractControl): ValidationErrors |
 };
 
 @Component({
-  selector: 'lib-return-process-product-question',
+  selector: 'oms-feature-return-process-product-question',
   templateUrl: './return-process-product-question.component.html',
   styleUrls: ['./return-process-product-question.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -53,9 +69,8 @@ export class ReturnProcessProductQuestionComponent {
 
   constructor() {
     effect(() => {
-      const product = this.#returnProcessStore.entityMap()[this.processId()]?.answers[
-        this.question().key
-      ] as Product;
+      const product = this.#returnProcessStore.entityMap()[this.processId()]
+        ?.answers[this.question().key] as Product;
 
       if (product) {
         this.control.setValue(product.ean);

libs/oms/feature/return-process/src/lib/return-process-questions/return-process-questions.component.html

@@ -2,7 +2,9 @@
   <div
     class="flex flex-row gap-2 w-full justify-between items-center border-b border-isa-neutral-300 pb-6 last:border-b-0"
   >
-    <div class="isa-text-body-1-regular">Um welches Produkt handelt es sich?</div>
+    <div class="isa-text-body-1-regular">
+      Um welches Produkt handelt es sich?
+    </div>
     <ui-dropdown
       label="Produktart auswählen"
       [value]="productCategoryDropdown()"
@@ -19,16 +21,16 @@
   <div class="item-content" [class.with-border-bottom]="!last">
     @switch (question.type) {
       @case ('select') {
-        <lib-return-process-select-question
+        <oms-feature-return-process-select-question
           [processId]="returnProcessId()"
           [question]="question"
-        ></lib-return-process-select-question>
+        ></oms-feature-return-process-select-question>
       }
       @case ('product') {
-        <lib-return-process-product-question
+        <oms-feature-return-process-product-question
           [processId]="returnProcessId()"
           [question]="question"
-        ></lib-return-process-product-question>
+        ></oms-feature-return-process-product-question>
       }
       @default {
         {{ question | json }}

libs/oms/feature/return-process/src/lib/return-process-questions/return-process-questions.component.ts

@@ -1,5 +1,11 @@
 import { JsonPipe, KeyValue } from '@angular/common';
-import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  inject,
+  input,
+} from '@angular/core';
 import {
   ReturnProcess,
   ReturnProcessQuestion,
@@ -8,10 +14,13 @@ import {
 } from '@isa/oms/data-access';
 import { ReturnProcessSelectQuestionComponent } from './return-process-select-question/return-process-select-question.component';
 import { ReturnProcessProductQuestionComponent } from './return-process-product-question/return-process-product-question.component';
-import { DropdownButtonComponent, DropdownOptionComponent } from '@isa/ui/input-controls';
+import {
+  DropdownButtonComponent,
+  DropdownOptionComponent,
+} from '@isa/ui/input-controls';
 
 @Component({
-  selector: 'lib-return-process-questions',
+  selector: 'oms-feature-return-process-questions',
   templateUrl: './return-process-questions.component.html',
   styleUrls: ['./return-process-questions.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -42,7 +51,10 @@ export class ReturnProcessQuestionsComponent {
       // Provide an empty array fallback
       return [];
     }
-    return this.#returnProcessService.activeReturnProcessQuestions(currentProcess) ?? [];
+    return (
+      this.#returnProcessService.activeReturnProcessQuestions(currentProcess) ??
+      []
+    );
   });
 
   // Also strongly type if `availableCategories` is an array of strings
@@ -51,7 +63,10 @@ export class ReturnProcessQuestionsComponent {
   });
 
   setProductCategory(category: string | undefined) {
-    this.#returnProcessStore.setProductCategory(this.returnProcessId(), category);
+    this.#returnProcessStore.setProductCategory(
+      this.returnProcessId(),
+      category,
+    );
   }
 
   productCategoryDropdown = computed<string | undefined>(() => {
@@ -59,7 +74,10 @@ export class ReturnProcessQuestionsComponent {
     if (!currentProcess) {
       return undefined;
     }
-    return currentProcess.productCategory || currentProcess.receiptItem.features?.['category'];
+    return (
+      currentProcess.productCategory ||
+      currentProcess.receiptItem.features?.['category']
+    );
   });
 
   // Return false or display a fallback UI if no returnProcess is found

libs/oms/feature/return-process/src/lib/return-process-questions/return-process-select-question/return-process-select-question.component.ts

@@ -1,11 +1,20 @@
-import { ChangeDetectionStrategy, Component, effect, inject, input } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  effect,
+  inject,
+  input,
+} from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
-import { ReturnProcessSelectQuestion, ReturnProcessStore } from '@isa/oms/data-access';
+import {
+  ReturnProcessSelectQuestion,
+  ReturnProcessStore,
+} from '@isa/oms/data-access';
 import { ChipsComponent, ChipOptionComponent } from '@isa/ui/input-controls';
 
 @Component({
-  selector: 'lib-return-process-select-question',
+  selector: 'oms-feature-return-process-select-question',
   templateUrl: './return-process-select-question.component.html',
   styleUrls: ['./return-process-select-question.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
@@ -19,20 +28,31 @@ export class ReturnProcessSelectQuestionComponent {
 
   question = input.required<ReturnProcessSelectQuestion>();
 
-  control = new FormControl<string | undefined>(undefined, [Validators.required]);
+  control = new FormControl<string | undefined>(undefined, [
+    Validators.required,
+  ]);
 
   constructor() {
     this.control.valueChanges.pipe(takeUntilDestroyed()).subscribe((value) => {
       if (this.control.valid) {
-        this.#returnProcessStore.setAnswer(this.processId(), this.question().key, value);
+        this.#returnProcessStore.setAnswer(
+          this.processId(),
+          this.question().key,
+          value,
+        );
       } else {
-        this.#returnProcessStore.removeAnswer(this.processId(), this.question().key);
+        this.#returnProcessStore.removeAnswer(
+          this.processId(),
+          this.question().key,
+        );
       }
     });
 
     effect(() => {
       const value =
-        this.#returnProcessStore.entityMap()[this.processId()]?.answers[this.question().key];
+        this.#returnProcessStore.entityMap()[this.processId()]?.answers[
+          this.question().key
+        ];
       if (value !== this.control.value) {
         this.control.setValue(value as string);
       }