From d5c4f02871714d4fbd49c6db8b3e17b9b835f005 Mon Sep 17 00:00:00 2001
From: Markus Thielker <mail.markus.thielker@gmail.com>
Date: Sun, 17 Mar 2024 12:04:38 +0100
Subject: [PATCH] N-FIN-49: show clear column if no category selected

---
 src/app/payments/columns.tsx | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/app/payments/columns.tsx b/src/app/payments/columns.tsx
index d3b950e..e462267 100644
--- a/src/app/payments/columns.tsx
+++ b/src/app/payments/columns.tsx
@@ -55,13 +55,19 @@ export const columns = (
             cell: ({row}) => {
                 const category = categories.find((category) => category.id === row.original.categoryId);
                 return (
-                    <div className="flex items-center space-x-4">
-                        <svg className="h-5" fill={category?.color} viewBox="0 0 20 20"
-                             xmlns="http://www.w3.org/2000/svg">
-                            <circle cx="10" cy="10" r="10"/>
-                        </svg>
-                        <p>{category?.name ?? '-'}</p>
-                    </div>
+                    <>
+                        {
+                            category && (
+                                <div className="flex items-center space-x-4">
+                                    <svg className="h-5" fill={category?.color} viewBox="0 0 20 20"
+                                         xmlns="http://www.w3.org/2000/svg">
+                                        <circle cx="10" cy="10" r="10"/>
+                                    </svg>
+                                    <p>{category?.name ?? '-'}</p>
+                                </div>
+                            )
+                        }
+                    </>
                 );
             },
             size: 200,