fix(spie-ui): rename connection component for clarity

robsonos · Nov 30, 2024 · 811f39c · 811f39c
1 parent cdc87f2
commit 811f39c
Show file tree

Hide file tree

Showing 11 changed files with 49 additions and 49 deletions.
diff --git a/apps/spie-ui-e2e/src/e2e/send.cy.ts b/apps/spie-ui-e2e/src/e2e/send.cy.ts
@@ -2,7 +2,7 @@ import { type SerialPortEvent } from '@spie/types';
 
 import { mockElectronAPI } from '../fixtures/mocks/electron-api.mock';
 
-describe('Serial Port Advanced Modal', () => {
+describe('Send component', () => {
   const mockSerialPortList = [
     { path: '/dev/ttyUSB0', manufacturer: 'Manufacturer1' },
     { path: '/dev/ttyUSB1', manufacturer: 'Manufacturer2' },

diff --git a/apps/spie-ui-e2e/src/e2e/serial-port.cy.ts b/apps/spie-ui-e2e/src/e2e/serial-port.cy.ts
@@ -3,7 +3,7 @@ import { type SerialPortEvent } from '@spie/types';
 
 import { mockElectronAPI } from '../fixtures/mocks/electron-api.mock';
 
-describe('Serial Port Configuration', () => {
+describe('Serial Port component', () => {
   const mockSerialPortList = [
     { path: '/dev/ttyUSB0', manufacturer: 'Manufacturer1' },
     { path: '/dev/ttyUSB1', manufacturer: 'Manufacturer2' },
@@ -40,7 +40,7 @@ describe('Serial Port Configuration', () => {
   });
 
   it('should display available serial ports in the dropdown', () => {
-    cy.get('app-serial-port [placeholder="Select Serial Port"]').click();
+    cy.get('app-connection [placeholder="Select Serial Port"]').click();
     cy.get('ion-alert .alert-radio-button').should(
       'have.length',
       mockSerialPortList.length
@@ -56,11 +56,11 @@ describe('Serial Port Configuration', () => {
   it('should allow selecting a serial port', () => {
     const expectedPath = mockSerialPortList[0].path;
 
-    cy.get('app-serial-port [placeholder="Select Serial Port"]').selectOption(
+    cy.get('app-connection [placeholder="Select Serial Port"]').selectOption(
       expectedPath
     );
 
-    cy.get('app-serial-port [placeholder="Select Serial Port"]')
+    cy.get('app-connection [placeholder="Select Serial Port"]')
       .shadow()
       .find('.select-text')
       .should('contain', expectedPath);
@@ -69,29 +69,29 @@ describe('Serial Port Configuration', () => {
   it('should allow selecting a baud rate', () => {
     const expectedBaudRate = 115200;
 
-    cy.get('app-serial-port [placeholder="Select Baud Rate"]').selectOption(
+    cy.get('app-connection [placeholder="Select Baud Rate"]').selectOption(
       expectedBaudRate
     );
 
-    cy.get('app-serial-port [placeholder="Select Baud Rate"]')
+    cy.get('app-connection [placeholder="Select Baud Rate"]')
       .shadow()
       .find('.select-text')
       .should('contain', expectedBaudRate);
   });
 
   it('should disable the Connect button when no serial port is selected', () => {
-    cy.get('app-serial-port ion-button')
+    cy.get('app-connection ion-button')
       .contains('Connect')
       .should('have.class', 'button-disabled');
   });
 
   it('should enable the Connect button after selecting a port', () => {
     const expectedPath = mockSerialPortList[0].path;
 
-    cy.get('app-serial-port [placeholder="Select Serial Port"]').selectOption(
+    cy.get('app-connection [placeholder="Select Serial Port"]').selectOption(
       expectedPath
     );
-    cy.get('app-serial-port ion-button')
+    cy.get('app-connection ion-button')
       .contains('Connect')
       .should('not.have.class', 'button-disabled');
   });
@@ -102,14 +102,14 @@ describe('Serial Port Configuration', () => {
       baudRate: 9600,
     };
 
-    cy.get('app-serial-port [placeholder="Select Serial Port"]').selectOption(
+    cy.get('app-connection [placeholder="Select Serial Port"]').selectOption(
       openOptions.path
     );
-    cy.get('app-serial-port [placeholder="Select Baud Rate"]').selectOption(
+    cy.get('app-connection [placeholder="Select Baud Rate"]').selectOption(
       openOptions.baudRate
     );
 
-    cy.get('app-serial-port ion-button').contains('Connect').click();
+    cy.get('app-connection ion-button').contains('Connect').click();
     cy.wrap(null).then(() => {
       if (onEventTrigger) {
         onEventTrigger({ event: 'open' });
@@ -121,11 +121,11 @@ describe('Serial Port Configuration', () => {
         Cypress.sinon.match(openOptions)
       );
     });
-    cy.get('app-serial-port ion-button')
+    cy.get('app-connection ion-button')
       .contains('Disconnect')
       .should('be.visible');
 
-    cy.get('app-serial-port ion-button').contains('Disconnect').click();
+    cy.get('app-connection ion-button').contains('Disconnect').click();
     cy.wrap(null).then(() => {
       if (onEventTrigger) {
         onEventTrigger({ event: 'close' });
@@ -134,7 +134,7 @@ describe('Serial Port Configuration', () => {
     cy.window().then((win) => {
       cy.wrap(win.electron.serialPort.close).should('have.been.calledOnce');
     });
-    cy.get('app-serial-port ion-button')
+    cy.get('app-connection ion-button')
       .contains('Connect')
       .should('be.visible');
   });
@@ -146,7 +146,7 @@ describe('Serial Port Configuration', () => {
       }
     });
 
-    cy.get('app-serial-port [placeholder="Select Baud Rate"]').selectOption(
+    cy.get('app-connection [placeholder="Select Baud Rate"]').selectOption(
       115200
     );
 
@@ -157,13 +157,13 @@ describe('Serial Port Configuration', () => {
       );
     });
 
-    cy.get('app-serial-port ion-button')
+    cy.get('app-connection ion-button')
       .contains('Disconnect')
       .should('be.visible');
   });
 
   it('should open and close the advanced modal', () => {
-    cy.get('app-serial-port ion-button ion-icon').parent().click();
+    cy.get('app-connection ion-button ion-icon').parent().click();
     cy.get('ion-modal').should('be.visible');
     cy.get('ion-modal ion-toolbar ion-button').click();
     cy.get('ion-modal').should('not.be.visible');
@@ -176,15 +176,15 @@ describe('Serial Port Configuration', () => {
       }
     });
 
-    cy.get('app-serial-port ion-button ion-icon').parent().click();
+    cy.get('app-connection ion-button ion-icon').parent().click();
 
     cy.getAdvancedModalCheckboxElement(
-      'serial-port-advanced-modal',
+      'connection-advanced-modal',
       'HUPCL'
     ).click();
 
     cy.getAdvancedModalSelectElement(
-      'serial-port-advanced-modal',
+      'connection-advanced-modal',
       'Data Bits'
     ).selectOption('5');
 
@@ -198,7 +198,7 @@ describe('Serial Port Configuration', () => {
         );
         cy.wrap(win.electron.serialPort.close).should('have.been.calledOnce');
 
-        cy.get('app-serial-port ion-button')
+        cy.get('app-connection ion-button')
           .contains('Disconnect')
           .should('be.visible');
       }, 500);

diff --git a/apps/spie-ui-e2e/src/e2e/terminal.cy.ts b/apps/spie-ui-e2e/src/e2e/terminal.cy.ts
@@ -2,7 +2,7 @@ import { type SerialPortEvent } from '@spie/types';
 
 import { mockElectronAPI } from '../fixtures/mocks/electron-api.mock';
 
-describe('Serial Port Advanced Modal', () => {
+describe('Terminal component', () => {
   const mockSerialPortList = [
     { path: '/dev/ttyUSB0', manufacturer: 'Manufacturer1' },
     { path: '/dev/ttyUSB1', manufacturer: 'Manufacturer2' },

diff --git a/...serial-port-advanced-modal.component.html → .../connection-advanced-modal.component.html b/...serial-port-advanced-modal.component.html → .../connection-advanced-modal.component.html
@@ -1,10 +1,10 @@
-<ion-modal #serialPortAdvancedModal id="serial-port-advanced-modal">
+<ion-modal #connectionAdvancedModal id="connection-advanced-modal">
   <ng-template>
     <ion-header>
       <ion-toolbar color="primary">
-        <ion-title>Advanced Serial Port Settings</ion-title>
+        <ion-title>Advanced Connection Settings</ion-title>
         <ion-buttons slot="end">
-          <ion-button (click)="serialPortAdvancedModal.dismiss()"
+          <ion-button (click)="connectionAdvancedModal.dismiss()"
             >Close</ion-button
           >
         </ion-buttons>

diff --git a/...serial-port-advanced-modal.component.scss → .../connection-advanced-modal.component.scss b/...serial-port-advanced-modal.component.scss → .../connection-advanced-modal.component.scss
diff --git a/...l/serial-port-advanced-modal.component.ts → ...al/connection-advanced-modal.component.ts b/...l/serial-port-advanced-modal.component.ts → ...al/connection-advanced-modal.component.ts
@@ -22,9 +22,9 @@ import {
 } from '../../../../interfaces/ionic.interface';
 
 @Component({
-  selector: 'app-serial-port-advanced-modal',
-  templateUrl: 'serial-port-advanced-modal.component.html',
-  styleUrls: ['./serial-port-advanced-modal.component.scss'],
+  selector: 'app-connection-advanced-modal',
+  templateUrl: 'connection-advanced-modal.component.html',
+  styleUrls: ['./connection-advanced-modal.component.scss'],
   standalone: true,
   imports: [
     IonButton,
@@ -41,12 +41,12 @@ import {
     IonToolbar,
   ],
 })
-export class SerialPortAdvancedComponent {
+export class ConnectionAdvancedComponent {
   reconnectSubject = input.required<Subject<void>>();
   openOptions = model.required<OpenOptions>();
 
-  serialPortAdvancedModal = viewChild.required<IonModal>(
-    'serialPortAdvancedModal'
+  connectionAdvancedModal = viewChild.required<IonModal>(
+    'connectionAdvancedModal'
   );
 
   onChangeDataBits(event: SelectCustomEvent<string>): void {

diff --git a/...me/serial-port/serial-port.component.html → ...home/connection/connection.component.html b/...me/serial-port/serial-port.component.html → ...home/connection/connection.component.html
@@ -1,6 +1,6 @@
 <ion-card>
   <ion-card-header>
-    <ion-text color="secondary">Serial Port</ion-text>
+    <ion-text color="secondary">Connection</ion-text>
   </ion-card-header>
 
   <ion-grid>
@@ -61,15 +61,15 @@
         <ion-button
           fill="clear"
           color="secondary"
-          (click)="onClickSerialPortAdvancedModal()"
+          (click)="onClickConnectionAdvancedModal()"
         >
           <ion-icon name="settings-outline"></ion-icon>
         </ion-button>
       </ion-col>
     </ion-row>
   </ion-grid>
 
-  <app-serial-port-advanced-modal
+  <app-connection-advanced-modal
     [(openOptions)]="openOptions"
     [reconnectSubject]="reconnectSubject()"
   />

diff --git a/...me/serial-port/serial-port.component.scss → ...home/connection/connection.component.scss b/...me/serial-port/serial-port.component.scss → ...home/connection/connection.component.scss
diff --git a/...home/serial-port/serial-port.component.ts → ...s/home/connection/connection.component.ts b/...home/serial-port/serial-port.component.ts → ...s/home/connection/connection.component.ts
@@ -26,15 +26,15 @@ import {
 } from '@serialport/bindings-interface';
 import { type Subject } from 'rxjs';
 
-import { SerialPortAdvancedComponent } from './serial-port-advanced-modal/serial-port-advanced-modal.component';
+import { ConnectionAdvancedComponent } from './connection-advanced-modal/connection-advanced-modal.component';
 import { type SelectCustomEvent } from '../../../interfaces/ionic.interface';
 import { ElectronService } from '../../../services/electron.service';
 import { ToasterService } from '../../../services/toaster.service';
 
 @Component({
-  selector: 'app-serial-port',
-  templateUrl: 'serial-port.component.html',
-  styleUrls: ['./serial-port.component.scss'],
+  selector: 'app-connection',
+  templateUrl: './connection.component.html',
+  styleUrls: ['./connection.component.scss'],
   standalone: true,
   imports: [
     IonButton,
@@ -48,10 +48,10 @@ import { ToasterService } from '../../../services/toaster.service';
     IonSelect,
     IonSelectOption,
     IonText,
-    SerialPortAdvancedComponent,
+    ConnectionAdvancedComponent,
   ],
 })
-export class SerialPortComponent {
+export class ConnectionComponent {
   private readonly loadingController = inject(LoadingController);
   private readonly toasterService = inject(ToasterService);
   private readonly electronService = inject(ElectronService);
@@ -60,8 +60,8 @@ export class SerialPortComponent {
   isOpen = input.required<boolean>();
   openOptions = model.required<OpenOptions>();
 
-  private serialPortAdvancedComponent = viewChild.required(
-    SerialPortAdvancedComponent
+  private connectionAdvancedComponent = viewChild.required(
+    ConnectionAdvancedComponent
   );
 
   baudRates = [
@@ -140,7 +140,7 @@ export class SerialPortComponent {
     await loading.dismiss();
   }
 
-  async onClickSerialPortAdvancedModal() {
-    this.serialPortAdvancedComponent().serialPortAdvancedModal().present();
+  async onClickConnectionAdvancedModal() {
+    this.connectionAdvancedComponent().connectionAdvancedModal().present();
   }
 }
diff --git a/apps/spie-ui/src/app/pages/home/home.component.html b/apps/spie-ui/src/app/pages/home/home.component.html
@@ -5,7 +5,7 @@
 </ion-header>
 
 <ion-content>
-  <app-serial-port
+  <app-connection
     [(openOptions)]="openOptions"
     [isOpen]="isOpen()"
     [reconnectSubject]="reconnectSubject"

diff --git a/apps/spie-ui/src/app/pages/home/home.component.ts b/apps/spie-ui/src/app/pages/home/home.component.ts
@@ -36,8 +36,8 @@ import {
   tap,
 } from 'rxjs';
 
+import { ConnectionComponent } from './connection/connection.component';
 import { SendComponent } from './send/send.component';
-import { SerialPortComponent } from './serial-port/serial-port.component';
 import { TerminalComponent } from './terminal/terminal.component';
 import { UpdateModalComponent } from './update-modal/update-modal.component';
 import {
@@ -58,7 +58,7 @@ import { ToasterService } from '../../services/toaster.service';
     IonTitle,
     IonToolbar,
     SendComponent,
-    SerialPortComponent,
+    ConnectionComponent,
     TerminalComponent,
     UpdateModalComponent,
   ],