Update OperationCrud display with tags and sorting

Author: Pierstoval

src/lib/crud/cruds/OperationCrud.ts

@@ -1,23 +1,26 @@
 import {
+	ArrayField,
 	CallbackStateProcessor,
 	CallbackStateProvider,
 	CheckboxField,
 	CrudDefinition,
 	DateField,
+	KeyValueObjectField,
 	List,
 	NumberField,
 	PaginatedResults,
 	TextField,
 	UrlAction,
 	View,
-	type RequestParameters,
 	type CrudOperation,
 	type ListOperationOptions,
-	KeyValueObjectField
+	type RequestParameters,
 } from '@orbitale/svelte-admin';
 
-import { getOperationById, getOperations, getOperationsCount } from '$lib/db/operations';
+import {getOperationById, getOperations, getOperationsCount} from '$lib/db/operations';
 import type Operation from '$lib/entities/Operation';
+import SortableField from "$lib/admin/src/SortableField";
+import type {OrderBy} from "$lib/admin/src/OrderBy";
 
 export default new CrudDefinition<Operation>({
 	name: 'operations',
@@ -28,11 +31,11 @@ export default new CrudDefinition<Operation>({
 	operations: [
 		new List(
 			[
-				new DateField('operation_date', 'Date'),
+				new DateField('operation_date', 'Date', {sortable: true}),
 				new TextField('op_type', 'Type 1'),
 				new TextField('type_display', 'Type 2'),
 				new TextField('details', 'Details'),
-				new TextField('tags', 'Tags'),
+				new ArrayField('tags', 'Tags', new KeyValueObjectField('', '', 'name')),
 				new NumberField('amount_display', 'Montant')
 			],
 			[new UrlAction('View', '/crud/operations/view')],
@@ -54,7 +57,7 @@ export default new CrudDefinition<Operation>({
 			new NumberField('hash', 'Hash'),
 			new TextField('state', 'State'),
 			new KeyValueObjectField('bank_account', 'Bank account', 'name'),
-			new TextField('tags', 'Tags'),
+			new ArrayField('tags', 'Tags', new KeyValueObjectField('', '', 'name')),
 			new CheckboxField('ignored_from_charts', 'Is ignored from charts')
 		])
 	],
@@ -68,15 +71,19 @@ export default new CrudDefinition<Operation>({
 
 			if (operation.name === 'list') {
 				const options: ListOperationOptions = operation.options;
-				const results = await getOperations(Number(requestParameters.page) || 1);
+				const page = Number(requestParameters.page || 1);
+				let sort: SortableField|null = null;
+				if (requestParameters.sort) {
+					const firstKey = Object.keys(requestParameters.sort)[0];
+					sort = new SortableField(firstKey, requestParameters.sort[firstKey] as OrderBy, firstKey);
+				}
+				const results = await getOperations(page, sort);
 				const numberOfItems = await getOperationsCount(null);
-				return Promise.resolve(
-					new PaginatedResults(
-						Number(requestParameters.page),
-						numberOfItems / Number(options.pagination?.itemsPerPage || 10),
-						numberOfItems,
-						results
-					)
+				return new PaginatedResults(
+					page,
+					numberOfItems / Number(options.pagination?.itemsPerPage || 10),
+					numberOfItems,
+					results
 				);
 			}
 

src/lib/db/bank_accounts.ts

@@ -1,20 +1,15 @@
 import BankAccount from '$lib/entities/BankAccount';
 import api_call from '$lib/utils/api_call';
-import { writable } from 'svelte/store';
-import type { Writable } from 'svelte/store';
-import DeserializedOperation from '$lib/db/operations';
-import BankAccountsCrud from '$lib/crud/cruds/BankAccountsCrud';
 
-export const bankAccountsStore: Writable<BankAccount[]> = writable();
+const cache: Record<string, BankAccount> = {};
 
 export async function getBankAccounts(): Promise<Array<BankAccount>> {
 	const res: string = await api_call('bank_account_find_all');
 
-	const bank_accounts = JSON.parse(res).map((data: BankAccount) => {
+	const bank_accounts: Array<BankAccount> = JSON.parse(res).map((data: BankAccount) => {
 		return new BankAccount(data.id, data.name, data.slug, data.currency);
 	});
-
-	bankAccountsStore.set(bank_accounts);
+	bank_accounts.forEach(a => cache[a.id] = a);
 
 	return bank_accounts;
 }
@@ -31,6 +26,10 @@ export async function getBankAccountsAsChoices(): Promise<Array<{ name: string;
 }
 
 export async function getBankAccountById(id: number): Promise<BankAccount | null> {
+	if (cache[id]) {
+		return Promise.resolve(cache[id]);
+	}
+
 	const res: string = await api_call('bank_account_get_by_id', { id: id.toString() });
 
 	if (!res) {
@@ -43,6 +42,8 @@ export async function getBankAccountById(id: number): Promise<BankAccount | null
 		throw new Error('Could not deserialize bank account.');
 	}
 
+	cache[id] = bank_account;
+
 	return bank_account;
 }
 
@@ -52,6 +53,8 @@ export async function createBankAccount(bank_account: BankAccount): Promise<void
 	if (isNaN(+id)) {
 		throw new Error('Internal error: API returned a non-number ID.');
 	}
+
+	cache[id] = bank_account;
 }
 
 export async function updateBankAccount(bank_account: BankAccount) {
@@ -64,4 +67,6 @@ export async function updateBankAccount(bank_account: BankAccount) {
 		name: bank_account.name,
 		currency: bank_account.currency
 	});
+
+	cache[bank_account.id] = bank_account;
 }