Skip to content

Commit 4eb45e5

Browse files
committed
refactor: trim whitespace from location and note fields in expense forms; update bulk category import logic
UI: update list view
1 parent 4bcbd77 commit 4eb45e5

11 files changed

Lines changed: 96 additions & 57 deletions

File tree

documentation/components/AddExpenseComponent.html

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -485,8 +485,8 @@ <h3 id="methods">
485485

486486
<tr>
487487
<td class="col-md-4">
488-
<div class="io-line">Defined in <a href="" data-line="144"
489-
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:144</a></div>
488+
<div class="io-line">Defined in <a href="" data-line="150"
489+
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:150</a></div>
490490
</td>
491491
</tr>
492492

@@ -637,8 +637,8 @@ <h3 id="methods">
637637

638638
<tr>
639639
<td class="col-md-4">
640-
<div class="io-line">Defined in <a href="" data-line="165"
641-
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:165</a></div>
640+
<div class="io-line">Defined in <a href="" data-line="171"
641+
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:171</a></div>
642642
</td>
643643
</tr>
644644

@@ -754,8 +754,8 @@ <h3 id="methods">
754754

755755
<tr>
756756
<td class="col-md-4">
757-
<div class="io-line">Defined in <a href="" data-line="201"
758-
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:201</a></div>
757+
<div class="io-line">Defined in <a href="" data-line="207"
758+
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:207</a></div>
759759
</td>
760760
</tr>
761761

@@ -828,8 +828,8 @@ <h3 id="methods">
828828

829829
<tr>
830830
<td class="col-md-4">
831-
<div class="io-line">Defined in <a href="" data-line="210"
832-
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:210</a></div>
831+
<div class="io-line">Defined in <a href="" data-line="216"
832+
class="link-to-prism">src/app/features/add-expense/add-expense.component.ts:216</a></div>
833833
</td>
834834
</tr>
835835

@@ -1345,7 +1345,13 @@ <h3 id="inputs">
13451345
return;
13461346
}
13471347

1348-
const data &#x3D; this.expenseForm.value;
1348+
const rawData &#x3D; this.expenseForm.value;
1349+
1350+
const data &#x3D; {
1351+
...rawData,
1352+
location: rawData.location?.trim() || null,
1353+
note: rawData.note?.trim() || null,
1354+
};
13491355
try {
13501356
this.expenseService.add(data);
13511357
this.toastService.show(&#x27;Expense added successfully!&#x27;, &#x27;success&#x27;);

documentation/components/ExpenseDetailsModalComponent.html

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -579,8 +579,8 @@ <h3 id="methods">
579579

580580
<tr>
581581
<td class="col-md-4">
582-
<div class="io-line">Defined in <a href="" data-line="112"
583-
class="link-to-prism">src/app/component/list-expenses/expense-details-modal/expense-details-modal.component.ts:112</a></div>
582+
<div class="io-line">Defined in <a href="" data-line="118"
583+
class="link-to-prism">src/app/component/list-expenses/expense-details-modal/expense-details-modal.component.ts:118</a></div>
584584
</td>
585585
</tr>
586586

@@ -770,8 +770,8 @@ <h3 id="methods">
770770

771771
<tr>
772772
<td class="col-md-4">
773-
<div class="io-line">Defined in <a href="" data-line="117"
774-
class="link-to-prism">src/app/component/list-expenses/expense-details-modal/expense-details-modal.component.ts:117</a></div>
773+
<div class="io-line">Defined in <a href="" data-line="123"
774+
class="link-to-prism">src/app/component/list-expenses/expense-details-modal/expense-details-modal.component.ts:123</a></div>
775775
</td>
776776
</tr>
777777

@@ -1006,7 +1006,7 @@ <h3 id="inputs">
10061006
}
10071007

10081008
/** Angular lifecycle hook called on component initialization */
1009-
ngOnInit(): void {}
1009+
ngOnInit(): void { }
10101010

10111011
/**
10121012
* Initializes the reactive edit form with default or selected expense values.
@@ -1051,9 +1051,15 @@ <h3 id="inputs">
10511051
*/
10521052
submitEdit(): void {
10531053
if (this.editForm.valid) {
1054+
const rawData &#x3D; this.editForm.value;
1055+
const data &#x3D; {
1056+
...rawData,
1057+
location: rawData.location?.trim() || null,
1058+
note: rawData.note?.trim() || null,
1059+
};
10541060
const updatedExpense &#x3D; {
10551061
...this.selectedExpense,
1056-
...this.editForm.value,
1062+
...data,
10571063
};
10581064
this.edit.emit(updatedExpense);
10591065
this.toggleEdit();

documentation/components/ExpenseListComponent.html

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -774,12 +774,17 @@ <h3 id="methods">
774774
&lt;/div&gt;
775775

776776
&lt;div class&#x3D;&quot;flex flex-col&quot;&gt;
777-
&lt;span class&#x3D;&quot;text-sm font-medium&quot;&gt;
778-
{{ exp.category_name || &#x27;Uncategorized&#x27; }}
777+
&lt;span class&#x3D;&quot;text-sm font-medium truncate max-w-[180px]&quot;
778+
[title]&#x3D;&quot;exp.note || exp.location || exp.category_name || &#x27;Expense&#x27;&quot;&gt;
779+
{{
780+
exp.note
781+
|| exp.location
782+
|| exp.category_name
783+
|| &#x27;Expense&#x27;
784+
}}
779785
&lt;/span&gt;
780786
&lt;span class&#x3D;&quot;text-xs text-gray-500 dark:text-gray-400&quot;&gt;
781787
{{ getFormattedDate(exp) }}
782-
783788
&lt;/span&gt;
784789
&lt;/div&gt;
785790
&lt;/div&gt;
@@ -819,7 +824,7 @@ <h3 id="methods">
819824
<script src="../js/libs/htmlparser.js"></script>
820825
<script src="../js/libs/deep-iterator.js"></script>
821826
<script>
822-
var COMPONENT_TEMPLATE = '<div><ul> <li *ngFor="let exp of expenses" (click)="onSelect(exp)" class="py-3 px-2 flex items-center justify-between shadow-sm active:scale-[0.99] transition-transform cursor-pointer hover:bg-[var(--list-hover)]"> <!-- Left section: Icon + Category + Date --> <div class="flex items-center gap-3"> <!-- Gradient Circle Icon --> <div class="w-10 h-10 rounded-full flex items-center justify-center text-white text-xl font-bold" [ngStyle]="{ background: \'linear-gradient(135deg, \' + exp.category_color + \', \' + darkenColor(exp.category_color, 0.2) + \')\' }"> {{ exp.category_icon }} </div> <div class="flex flex-col"> <span class="text-sm font-medium"> {{ exp.category_name || \'Uncategorized\' }} </span> <span class="text-xs text-gray-500 dark:text-gray-400"> {{ getFormattedDate(exp) }} </span> </div> </div> <!-- Right section: Amount --> <div class="text-right"> <span class="text-[17px] text-[var(--color-green)]"> {{ currency }} {{ exp.amount }} </span> </div> </li></ul></div>'
827+
var COMPONENT_TEMPLATE = '<div><ul> <li *ngFor="let exp of expenses" (click)="onSelect(exp)" class="py-3 px-2 flex items-center justify-between shadow-sm active:scale-[0.99] transition-transform cursor-pointer hover:bg-[var(--list-hover)]"> <!-- Left section: Icon + Category + Date --> <div class="flex items-center gap-3"> <!-- Gradient Circle Icon --> <div class="w-10 h-10 rounded-full flex items-center justify-center text-white text-xl font-bold" [ngStyle]="{ background: \'linear-gradient(135deg, \' + exp.category_color + \', \' + darkenColor(exp.category_color, 0.2) + \')\' }"> {{ exp.category_icon }} </div> <div class="flex flex-col"> <span class="text-sm font-medium truncate max-w-[180px]" [title]="exp.note || exp.location || exp.category_name || \'Expense\'"> {{ exp.note || exp.location || exp.category_name || \'Expense\' }} </span> <span class="text-xs text-gray-500 dark:text-gray-400"> {{ getFormattedDate(exp) }} </span> </div> </div> <!-- Right section: Amount --> <div class="text-right"> <span class="text-[17px] text-[var(--color-green)]"> {{ currency }} {{ exp.amount }} </span> </div> </li></ul></div>'
823828
var COMPONENTS = [{'name': 'AddExpenseComponent', 'selector': 'app-add-expense'},{'name': 'AiComponent', 'selector': 'app-ai'},{'name': 'AppComponent', 'selector': 'app-root'},{'name': 'BudgetComponent', 'selector': 'app-budget'},{'name': 'CalendarComponent', 'selector': 'app-calendar'},{'name': 'CategoryDropdownComponent', 'selector': 'app-category-dropdown'},{'name': 'DownloadComponentComponent', 'selector': 'app-download-component'},{'name': 'ExpenseDetailsModalComponent', 'selector': 'app-expense-details-modal'},{'name': 'ExpenseListComponent', 'selector': 'app-expense-list'},{'name': 'ExpenseWiseComponent', 'selector': 'app-expense-wise'},{'name': 'FooterComponent', 'selector': 'app-footer'},{'name': 'FormModelComponent', 'selector': 'app-form-model'},{'name': 'GlobalLoaderComponent', 'selector': 'app-global-loader'},{'name': 'GraphsComponent', 'selector': 'app-graphs'},{'name': 'HamburgerMenuComponent', 'selector': 'app-hamburger-menu'},{'name': 'HomeComponent', 'selector': 'app-home'},{'name': 'InstallAppPopupComponentComponent', 'selector': 'app-install-app-popup-component'},{'name': 'ListExpensesComponent', 'selector': 'app-list-expenses'},{'name': 'MusicComponent', 'selector': 'app-music'},{'name': 'NavbarComponent', 'selector': 'app-navbar'},{'name': 'PieChartComponent', 'selector': 'app-pie-chart'},{'name': 'PlaylistMusicComponent', 'selector': 'app-playlist-music'},{'name': 'SearchButtonComponent', 'selector': 'app-search-button'},{'name': 'SearchMusicComponent', 'selector': 'app-search-music'},{'name': 'SettingItemComponent', 'selector': 'app-setting-item'},{'name': 'SettingsComponent', 'selector': 'app-settings'},{'name': 'SidebarComponent', 'selector': 'app-sidebar'},{'name': 'SplashScreenComponent', 'selector': 'app-splash-screen'},{'name': 'TemplatePlaygroundComponent', 'selector': 'template-playground-root'},{'name': 'ToastComponent', 'selector': 'app-toast'}];
824829
var DIRECTIVES = [];
825830
var ACTUAL_COMPONENT = {'name': 'ExpenseListComponent'};

documentation/injectables/CategoryService.html

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,7 @@ <h3 id="methods">
364364
</tr>
365365
<tr>
366366
<td class="col-md-4">
367-
<code>addBulk(data: <a href="../interfaces/Category.html" target="_self">Omit&lt;Category, &quot;category_id&quot; | &quot;user_id&quot;&gt;[]</a>)</code>
367+
<code>addBulk(data: <a href="../interfaces/Category.html" target="_self">Category[]</a>)</code>
368368
</td>
369369
</tr>
370370

@@ -404,7 +404,7 @@ <h3 id="methods">
404404
<tr>
405405
<td>data</td>
406406
<td>
407-
<code><a href="../interfaces/Category.html" target="_self" >Omit&lt;Category, &quot;category_id&quot; | &quot;user_id&quot;&gt;[]</a></code>
407+
<code><a href="../interfaces/Category.html" target="_self" >Category[]</a></code>
408408
</td>
409409

410410
<td>
@@ -975,21 +975,22 @@ <h3 id="methods">
975975
*
976976
* @param data List of category objects without &#x60;category_id&#x60; and &#x60;user_id&#x60;
977977
*/
978-
addBulk(data: Omit&lt;Category, &#x27;category_id&#x27; | &#x27;user_id&#x27;&gt;[]): void {
978+
addBulk(data: Category[]): void {
979979
if (!this.isBrowser()) return;
980980

981-
const all: Category[] &#x3D; this.getAll() ?? [];
982-
const user_id &#x3D; this.userService.getValue&lt;string&gt;(&#x27;id&#x27;) || &#x27;0&#x27;;
981+
const existing: Category[] &#x3D; this.getAll() ?? [];
982+
983+
// Remove categories that already exist (by ID)
984+
const filteredExisting &#x3D; existing.filter(
985+
oldCat &#x3D;&gt; !data.some(newCat &#x3D;&gt; newCat.category_id &#x3D;&#x3D;&#x3D; oldCat.category_id)
986+
);
983987

984-
const imported: Category[] &#x3D; data.map(cat &#x3D;&gt; ({
985-
...cat,
986-
category_id: crypto.randomUUID(),
987-
user_id
988-
}));
988+
// Merge uploaded categories as-is (keep IDs)
989+
const merged &#x3D; [...filteredExisting, ...data];
989990

990991
localStorage.setItem(
991992
this.storageService.getCategoryKey(),
992-
JSON.stringify([...all, ...imported])
993+
JSON.stringify(merged)
993994
);
994995
}
995996
}

documentation/interfaces/Category.html

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -663,21 +663,22 @@ <h3 id="inputs">Properties</h3>
663663
*
664664
* @param data List of category objects without &#x60;category_id&#x60; and &#x60;user_id&#x60;
665665
*/
666-
addBulk(data: Omit&lt;Category, &#x27;category_id&#x27; | &#x27;user_id&#x27;&gt;[]): void {
666+
addBulk(data: Category[]): void {
667667
if (!this.isBrowser()) return;
668668

669-
const all: Category[] &#x3D; this.getAll() ?? [];
670-
const user_id &#x3D; this.userService.getValue&lt;string&gt;(&#x27;id&#x27;) || &#x27;0&#x27;;
669+
const existing: Category[] &#x3D; this.getAll() ?? [];
670+
671+
// Remove categories that already exist (by ID)
672+
const filteredExisting &#x3D; existing.filter(
673+
oldCat &#x3D;&gt; !data.some(newCat &#x3D;&gt; newCat.category_id &#x3D;&#x3D;&#x3D; oldCat.category_id)
674+
);
671675

672-
const imported: Category[] &#x3D; data.map(cat &#x3D;&gt; ({
673-
...cat,
674-
category_id: crypto.randomUUID(),
675-
user_id
676-
}));
676+
// Merge uploaded categories as-is (keep IDs)
677+
const merged &#x3D; [...filteredExisting, ...data];
677678

678679
localStorage.setItem(
679680
this.storageService.getCategoryKey(),
680-
JSON.stringify([...all, ...imported])
681+
JSON.stringify(merged)
681682
);
682683
}
683684
}

documentation/js/search/search_index.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

public/dev.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,4 +43,6 @@ ng g s service-name
4343
- Use feat: → new feature
4444
- Use fix: → bug fix
4545
- Use perf: → performance improvements
46-
- Use refactor: → code cleanup
46+
- Use refactor: → code cleanup
47+
- Use UI: → user interface changes
48+
- Use docs: → documentation changes

src/app/component/list-expenses/expense-details-modal/expense-details-modal.component.ts

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ export class ExpenseDetailsModalComponent implements OnInit {
5454
}
5555

5656
/** Angular lifecycle hook called on component initialization */
57-
ngOnInit(): void {}
57+
ngOnInit(): void { }
5858

5959
/**
6060
* Initializes the reactive edit form with default or selected expense values.
@@ -99,9 +99,15 @@ export class ExpenseDetailsModalComponent implements OnInit {
9999
*/
100100
submitEdit(): void {
101101
if (this.editForm.valid) {
102+
const rawData = this.editForm.value;
103+
const data = {
104+
...rawData,
105+
location: rawData.location?.trim() || null,
106+
note: rawData.note?.trim() || null,
107+
};
102108
const updatedExpense = {
103109
...this.selectedExpense,
104-
...this.editForm.value,
110+
...data,
105111
};
106112
this.edit.emit(updatedExpense);
107113
this.toggleEdit();

src/app/component/list-expenses/expense-list/expense-list.component.html

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,17 @@
1212
</div>
1313

1414
<div class="flex flex-col">
15-
<span class="text-sm font-medium">
16-
{{ exp.category_name || 'Uncategorized' }}
15+
<span class="text-sm font-medium truncate max-w-[180px]"
16+
[title]="exp.note || exp.location || exp.category_name || 'Expense'">
17+
{{
18+
exp.note
19+
|| exp.location
20+
|| exp.category_name
21+
|| 'Expense'
22+
}}
1723
</span>
1824
<span class="text-xs text-gray-500 dark:text-gray-400">
1925
{{ getFormattedDate(exp) }}
20-
2126
</span>
2227
</div>
2328
</div>

src/app/features/add-expense/add-expense.component.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,13 @@ export class AddExpenseComponent implements OnInit {
128128
return;
129129
}
130130

131-
const data = this.expenseForm.value;
131+
const rawData = this.expenseForm.value;
132+
133+
const data = {
134+
...rawData,
135+
location: rawData.location?.trim() || null,
136+
note: rawData.note?.trim() || null,
137+
};
132138
try {
133139
this.expenseService.add(data);
134140
this.toastService.show('Expense added successfully!', 'success');

0 commit comments

Comments
 (0)