Support null category descriptions.

web-app/src/api/transaction.ts

@@ -17,7 +17,7 @@ export interface TransactionCategory {
   id: number
   parentId: number | null
   name: string
-  description: string
+  description: string | null
   color: string
 }
 
@@ -135,7 +135,7 @@ export interface AddTransactionPayloadLineItem {
 
 export interface CreateCategoryPayload {
   name: string
-  description: string
+  description: string | null
   color: string
   parentId: number | null
 }

web-app/src/components/EditCategoryModal.vue

@@ -29,7 +29,7 @@ function show(): Promise<string | undefined> {
   description.value = props.category?.description ?? ''
   if (props.category) {
     name.value = props.category.name
-    description.value = props.category.description
+    description.value = props.category.description ?? ""
     color.value = '#' + props.category.color
     parentId.value = props.category.parentId
   } else {
@@ -46,8 +46,11 @@ function canSave() {
     color.value.match('^#(([0-9a-fA-F]{2}){3}|([0-9a-fA-F]){3})$')
   if (!inputValid) return false
   if (props.category) {
+    const prevDescription = props.category.description?.trim() ?? ""
+    const currentDescription = description.value.trim()
+    const descriptionChanged = prevDescription !== currentDescription
     return props.category.name.trim() !== name.value.trim() ||
-      props.category.description.trim() !== description.value.trim() ||
+      descriptionChanged ||
       props.category.color.trim().toLowerCase() !== color.value.trim().toLowerCase() ||
       props.category.parentId !== parentId.value
   }
@@ -56,9 +59,13 @@ function canSave() {
 
 async function doSave() {
   const api = new TransactionApiClient(getSelectedProfile(route))
+  let desc: string | null = description.value.trim()
+  if (desc.length === 0) {
+    desc = null
+  }
   const payload = {
     name: name.value.trim(),
-    description: description.value.trim(),
+    description: desc,
     color: color.value.trim().substring(1),
     parentId: parentId.value
   }