gabdlr/groceries-price-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: add chain to extend settings base add

Browse Source
This commit is contained in:
Gabriel De Los Rios
2026-02-16 22:28:00 -03:00
parent 13b19d5776
commit f140ef403b
9 changed files with 78 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/pages/settings/chains/chain-add-page/chain-add-page.html Normal file
View File

@@ -0,0 +1,3 @@
<app-chain-add #c>
<app-chain-form [form]="c.form"/>
</app-chain-add>

8
src/app/pages/settings/chains/chain-add/chain-add.scss → src/app/pages/settings/chains/chain-add-page/chain-add-page.scss
View File

@@ -2,10 +2,4 @@
display: flex;
flex-direction: column;
height: 100%;
}
h3 {
margin-top: 0;
}
}

25
src/app/pages/settings/chains/chain-add-page/chain-add-page.spec.ts Normal file
View File

@@ -0,0 +1,25 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ChainAddPage } from './chain-add-page';
import { ChainSettings } from '../../../../services/chain-settings';
import { provideTranslateService } from '@ngx-translate/core';
describe('ChainAddPage', () => {
let component: ChainAddPage;
let fixture: ComponentFixture<ChainAddPage>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [ChainAddPage],
providers: [{ provide: ChainSettings, useValue: {} }, provideTranslateService()],
}).compileComponents();
fixture = TestBed.createComponent(ChainAddPage);
component = fixture.componentInstance;
await fixture.whenStable();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

13
src/app/pages/settings/chains/chain-add-page/chain-add-page.ts Normal file
View File

@@ -0,0 +1,13 @@
import { Component } from '@angular/core';
import { ChainAdd } from "../../../../components/chain-add/chain-add";
import { ChainForm } from "../chain-form/chain-form";
@Component({
selector: 'app-chain-add-page',
imports: [ChainAdd, ChainForm],
templateUrl: './chain-add-page.html',
styleUrl: './chain-add-page.scss',
})
export class ChainAddPage {
}

8
src/app/pages/settings/chains/chain-add/chain-add.html
View File

@@ -1,8 +0,0 @@
<h3>{{'settings.chain.new_chain'|translate|upperfirst}}</h3>
<app-chain-form [form]="form"/>
<app-action-btn
(click)="save()"
[disabled]="this.form.invalid"
class="top-auto"
text="{{'common.save'|translate|upperfirst}}"
/>

51
src/app/pages/settings/chains/chain-add/chain-add.spec.ts
View File

@@ -1,51 +0,0 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ChainAdd } from './chain-add';
import { vi } from 'vitest';
import { provideTranslateService } from '@ngx-translate/core';
import { ChainFormGroup } from '../chain-formgroup';
import { FormControl } from '@angular/forms';
import { By } from '@angular/platform-browser';
import { ChainSettings } from '../../../../services/chain-settings';
import { Chain } from '../../../../models/Chain';
describe('ChainAdd', () => {
let component: ChainAdd;
let fixture: ComponentFixture<ChainAdd>;
let chainSettings: Partial<ChainSettings>;
beforeEach(async () => {
chainSettings = {
save: vi.fn().mockResolvedValue(undefined),
};
await TestBed.configureTestingModule({
imports: [ChainAdd],
providers: [provideTranslateService(), { provide: ChainSettings, useValue: chainSettings }],
}).compileComponents();
fixture = TestBed.createComponent(ChainAdd);
component = fixture.componentInstance;
});
it('should create', async () => {
await fixture.whenStable();
expect(component).toBeTruthy();
});
it('should insert chain and store image', async () => {
(<any>component).form = new ChainFormGroup({
name: new FormControl('Mock'),
image: new FormControl(new File([], 'mock')),
});
await fixture.whenStable();
const actionBtn = fixture.debugElement.query(By.css('app-action-btn'));
actionBtn.triggerEventHandler('click');
await fixture.whenStable();
expect(chainSettings.save).toHaveBeenCalledExactlyOnceWith(
new Chain(component.form.controls.name.value, ''),
component.form.controls.image.value,
);
});
});

32
src/app/pages/settings/chains/chain-add/chain-add.ts
View File

@@ -1,32 +0,0 @@
import { Component, inject } from '@angular/core';
import { Chain } from '../../../../models/Chain';
import { ChainFormGroup } from '../chain-formgroup';
import { ChainForm } from '../chain-form/chain-form';
import { ActionBtn } from '../../../../components/action-btn/action-btn';
import { TranslatePipe } from '@ngx-translate/core';
import { UpperfirstPipe } from '../../../../pipes/upperfirst-pipe';
import { ChainSettings } from '../../../../services/chain-settings';
@Component({
selector: 'app-chain-add',
imports: [
ActionBtn,
ChainForm,
TranslatePipe,
UpperfirstPipe,
],
templateUrl: './chain-add.html',
styleUrl: './chain-add.scss',
})
export class ChainAdd {
private readonly chainSettings = inject(ChainSettings);
readonly form = new ChainFormGroup();
async save() {
const name = this.form.controls.name.value;
const img = this.form.controls.image.value;
//TODO: the sqlite bridge can't handle null as param
const chain = new Chain(name, '');
await this.chainSettings.save(chain, img);
}
}

2
src/app/pages/settings/settings.route.ts
View File

@@ -23,7 +23,7 @@ export const routes: Route[] = [
},
{
path: 'add',
loadComponent: () => import('./chains/chain-add/chain-add').then(c => c.ChainAdd)
loadComponent: () => import('./chains/chain-add-page/chain-add-page').then(c => c.ChainAddPage)
},
{
path: 'edit/:id',