Added drafts module, fixed issues with draft query.

finnow-api/source/transaction/api.d

@@ -218,7 +218,7 @@ private ulong getCategoryId(in ServerHttpRequest request) {
 
 // Drafts & Templates
 
-immutable DEFAULT_DRAFT_PAGE = PageRequest(1, 10, [Sort("txn.id", SortDir.DESC)]);
+immutable DEFAULT_DRAFT_PAGE = PageRequest(1, 10, [Sort("draft.id", SortDir.DESC)]);
 
 @GetMapping(PROFILE_PATH ~ "/transaction-drafts")
 void handleGetDrafts(ref ServerHttpRequest request, ref ServerHttpResponse response) {

finnow-api/source/transaction/data_impl_sqlite.d

@@ -833,7 +833,7 @@ class SqliteTransactionDraftRepository : TransactionDraftRepository {
             .select("account_debit.name")
             .select("account_debit.type")// 20
             .select("account_debit.number_suffix")
-            .select("string_agg(tags.tag, ',' ORDER BY tags.tag ASC)");
+            .select("group_concat(tags.tag)");
     }
 
     private static TransactionDraftListItem parseDraftListItem(Row row) {
@@ -885,6 +885,8 @@ class SqliteTransactionDraftRepository : TransactionDraftRepository {
             import std.string : split;
             item.tags = aggregateTags.split(",");
         }
+        import std.algorithm : sort;
+        sort(item.tags);
         return item;
     }
 

web-app/src/pages/UserHomePage.vue

@@ -2,12 +2,14 @@
 import ProfileModule from './home/ProfileModule.vue'
 import AccountsModule from './home/AccountsModule.vue'
 import TransactionsModule from './home/TransactionsModule.vue'
+import DraftsModule from './home/DraftsModule.vue'
 </script>
 <template>
   <div class="app-module-container">
     <ProfileModule />
     <AccountsModule />
     <TransactionsModule />
+    <DraftsModule />
     <!-- <AnalyticsModule /> -->
   </div>
 </template>

web-app/src/pages/home/DraftsModule.vue

@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import type { Page, PageRequest } from '@/api/pagination'
+import { TransactionApiClient, type TransactionDraftListItem } from '@/api/transaction'
+import PaginationControls from '@/components/common/PaginationControls.vue'
+import HomeModule from '@/components/HomeModule.vue'
+import { useRoute } from 'vue-router'
+import { onMounted, ref, type Ref } from 'vue'
+import { getSelectedProfile } from '@/api/profile'
+
+const route = useRoute()
+const page: Ref<Page<TransactionDraftListItem>> = ref({
+  items: [],
+  pageRequest: { page: 1, size: 5, sorts: [] },
+  totalElements: 0,
+  totalPages: 0,
+  isFirst: true,
+  isLast: true,
+})
+
+onMounted(async () => {
+  await fetchPage(page.value.pageRequest)
+})
+
+async function fetchPage(pageRequest: PageRequest) {
+  const api = new TransactionApiClient(getSelectedProfile(route))
+  try {
+    page.value = await api.getDrafts(pageRequest)
+  } catch (err) {
+    console.error(err)
+  }
+}
+</script>
+<template>
+  <HomeModule title="Drafts">
+    <template v-slot:default>
+      <PaginationControls
+        :page="page"
+        @update="(pr) => fetchPage(pr)"
+        class="align-right"
+      />
+      <div
+        v-for="draft in page.items"
+        :key="draft.id"
+      >
+        Draft ID: {{ draft.id }} Template name: {{ draft.templateName }}
+      </div>
+    </template>
+  </HomeModule>
+</template>