Update

apps/dashboard/package.json

@@ -31,9 +31,9 @@
     "framer-motion": "^10.16.5",
     "next": "14.0.4-canary.4",
     "next-international": "^1.1.4",
-    "next-safe-action": "^5.1.2",
+    "next-safe-action": "^5.1.3",
     "next-themes": "^0.2.1",
-    "next-usequerystate": "^1.12.2",
+    "next-usequerystate": "^1.13.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-dropzone": "^14.2.3",
@@ -45,7 +45,7 @@
   "devDependencies": {
     "@midday/tsconfig": "workspace:*",
     "@t3-oss/env-nextjs": "^0.7.1",
-    "@types/node": "^20.9.4",
+    "@types/node": "^20.9.5",
     "@types/react": "^18.2.38",
     "@types/react-dom": "^18.2.17",
     "typescript": "^5.3.2"

apps/dashboard/src/components/charts/transactions-list.tsx

@@ -1,5 +1,6 @@
 import { formatAmount } from "@/utils/format";
 import { getTransactions } from "@midday/supabase/cached-queries";
+import { Avatar, AvatarFallback, AvatarImage } from "@midday/ui/avatar";
 import { Icons } from "@midday/ui/icons";
 import { Skeleton } from "@midday/ui/skeleton";
 import { cn } from "@midday/ui/utils";
@@ -58,7 +59,16 @@ export async function TransactionsList({ type, disabled }) {
               href={`/transactions?id=${transaction.id}`}
               className="flex p-3"
             >
-              <div className="w-[50%]">
+              <div className="w-[50%] flex space-x-2">
+                <Avatar className="rounded-full w-5 h-5">
+                  <AvatarImage src={transaction?.enrichment?.logo_url} />
+                  <AvatarFallback>
+                    <span className="text-[10px]">
+                      {transaction?.name?.charAt(0)}
+                    </span>
+                  </AvatarFallback>
+                </Avatar>
+
                 <span
                   className={cn(
                     "text-sm",

apps/dashboard/src/components/tables/transactions/data-table-row.tsx

@@ -5,6 +5,7 @@ import { Category } from "@/components/category";
 import { TransactionMethod } from "@/components/transaction-method";
 import { useCurrentLocale } from "@/locales/client";
 import { formatAmount } from "@/utils/format";
+import { Avatar, AvatarFallback, AvatarImage } from "@midday/ui/avatar";
 import { Icons } from "@midday/ui/icons";
 import { cn } from "@midday/ui/utils";
 import { format } from "date-fns";
@@ -47,7 +48,16 @@ export function DataTableRow({ collapsed, onSelect, data, selected }) {
         {data.date && format(new Date(data.date), "MMM d")}
       </DataTableCell>
 
-      <DataTableCell className="w-[430px]">{data.name}</DataTableCell>
+      <DataTableCell className="w-[430px] space-x-2">
+        <Avatar className="rounded-full w-5 h-5">
+          <AvatarImage src={data?.enrichment?.logo_url} />
+          <AvatarFallback>
+            <span className="text-[10px]">{data?.name?.charAt(0)}</span>
+          </AvatarFallback>
+        </Avatar>
+
+        <span>{data.name}</span>
+      </DataTableCell>
 
       <DataTableCell className="w-[200px]">
         <span className={cn("text-sm", data.amount > 0 && "text-[#00C969]")}>

apps/dashboard/src/components/transaction-details.tsx

@@ -8,6 +8,7 @@ import {
   AccordionItem,
   AccordionTrigger,
 } from "@midday/ui/accordion";
+import { Avatar, AvatarFallback, AvatarImage } from "@midday/ui/avatar";
 import { Button } from "@midday/ui/button";
 import { Icons } from "@midday/ui/icons";
 import { Skeleton } from "@midday/ui/skeleton";
@@ -42,33 +43,38 @@ export function TransactionDetails({ transactionId, onClose, data }) {
 
             <h2 className="mt-4 mb-3">
               {isLoading ? (
-                <Skeleton className="w-[35%] h-[22px] rounded-md mb-4" />
+                <Skeleton className="w-[35%] h-[22px] rounded-md" />
               ) : (
                 data?.name
               )}
             </h2>
-            <div className="flex flex-col">
-              {isLoading ? (
-                <div className="flex flex-col space-y-3 mb-[5px]">
-                  <Skeleton className="w-[50%] h-[32px] rounded-md mb-2" />
-                  <Skeleton className="w-[20%] h-[15px] rounded-md" />
-                </div>
-              ) : (
-                <div className="flex flex-col space-y-3">
-                  <span
-                    className={cn(
-                      "text-4xl",
-                      data?.amount > 0 && "text-[#00C969]"
-                    )}
-                  >
-                    {formatAmount({
-                      amount: data?.amount,
-                      currency: data?.currency,
-                      locale,
-                    })}
-                  </span>
-                </div>
-              )}
+            <div className="flex justify-between items-center">
+              <div className="flex flex-col w-full">
+                {isLoading ? (
+                  <Skeleton className="w-[50%] h-[30px] rounded-md" />
+                ) : (
+                  <div className="flex flex-col space-y-3">
+                    <span
+                      className={cn(
+                        "text-4xl",
+                        data?.amount > 0 && "text-[#00C969]"
+                      )}
+                    >
+                      {formatAmount({
+                        amount: data?.amount,
+                        currency: data?.currency,
+                        locale,
+                      })}
+                    </span>
+                  </div>
+                )}
+              </div>
+              <Avatar className="rounded-full w-[60px] h-[60px]">
+                <AvatarImage src={data?.enrichment?.logo_url} />
+                <AvatarFallback>
+                  <span className="text-sm">{data?.name?.charAt(0)}</span>
+                </AvatarFallback>
+              </Avatar>
             </div>
           </div>
 

apps/dashboard/src/jobs/transactions.ts

@@ -12,6 +12,23 @@ import { capitalCase } from "change-case";
 import { revalidateTag } from "next/cache";
 import { z } from "zod";
 
+export async function processPromisesBatch(
+  items: Array<any>,
+  limit: number,
+  fn: (item: any) => Promise<any>
+): Promise<any> {
+  let results = [];
+  for (let start = 0; start < items.length; start += limit) {
+    const end = start + limit > items.length ? items.length : start + limit;
+
+    const slicedResults = await Promise.all(items.slice(start, end).map(fn));
+
+    results = [...results, ...slicedResults];
+  }
+
+  return results;
+}
+
 const mapTransactionMethod = (method: string) => {
   switch (method) {
     case "Payment":
@@ -44,7 +61,7 @@ const transformTransactions = (transactions, { teamId, accountId }) =>
     amount: data.transactionAmount.amount,
     currency: data.transactionAmount.currency,
     bank_account_id: accountId,
-    category: data.transactionAmount.amount > 0 ? "income" : "uncategorized",
+    category: data.transactionAmount.amount > 0 ? "income" : null,
     team_id: teamId,
   }));
 
@@ -227,6 +244,13 @@ client.defineJob({
       }
     }
 
+    await io.sendEvent("Enrich Transactions", {
+      name: "transactions.encrichment",
+      payload: {
+        teamId: data?.team_id,
+      },
+    });
+
     if (error) {
       await io.logger.error(JSON.stringify(error, null, 2));
     }
@@ -279,6 +303,13 @@ client.defineJob({
       revalidateTag(`transactions_${teamId}`);
       revalidateTag(`spending_${teamId}`);
       revalidateTag(`metrics_${teamId}`);
+
+      await io.sendEvent("Enrich Transactions", {
+        name: "transactions.encrichment",
+        payload: {
+          teamId,
+        },
+      });
     }
 
     if (error) {
@@ -289,6 +320,68 @@ client.defineJob({
   },
 });
 
+client.defineJob({
+  id: "transactions-encrichment",
+  name: "Transactions - Enrichment",
+  version: "1.0.0",
+  trigger: eventTrigger({
+    name: "transactions.encrichment",
+    schema: z.object({
+      teamId: z.string(),
+    }),
+  }),
+  integrations: { supabase },
+  run: async (payload, io) => {
+    const { teamId } = payload;
+
+    const { data: transactionsData } = await io.supabase.client
+      .from("transactions")
+      .select("id, name")
+      .eq("team_id", teamId)
+      .is("category", null)
+      .is("logo_url", null)
+      .is("enrichment_id", null)
+      .select();
+
+    async function enrichTransactions(transaction) {
+      const { data } = await io.supabase.client
+        .rpc("search_enriched_transactions", { term: transaction.name })
+        .single();
+
+      return {
+        ...data,
+        enriched_id: data?.id,
+      };
+    }
+
+    const result = await processPromisesBatch(
+      transactionsData,
+      5,
+      enrichTransactions
+    );
+
+    if (result.length > 0) {
+      const { data: updatedTransactions } = await io.supabase.client
+        .from("transactions")
+        .upsert(result, {
+          onConflict: "internal_id",
+          ignoreDuplicates: true,
+        })
+        .select();
+
+      if (updatedTransactions?.length > 0) {
+        revalidateTag(`transactions_${teamId}`);
+        revalidateTag(`spending_${teamId}`);
+        revalidateTag(`metrics_${teamId}`);
+
+        await io.logger.info(
+          `Transactions Enriched: ${updatedTransactions?.length}`
+        );
+      }
+    }
+  },
+});
+
 client.defineJob({
   id: "transactions-export",
   name: "Transactions - Export",

apps/website/package.json

@@ -23,7 +23,7 @@
   },
   "devDependencies": {
     "@midday/tsconfig": "workspace:*",
-    "@types/node": "^20.9.4",
+    "@types/node": "^20.9.5",
     "@types/react": "^18.2.38",
     "@types/react-dom": "^18.2.17"
   }

packages/gocardless/src/index.ts

@@ -252,3 +252,31 @@ export async function getTransactions(accountId: string) {
 
   return result.json();
 }
+
+export async function getRequisitions() {
+  const token = await getAccessToken();
+
+  const result = await fetch(`${baseUrl}/api/v2/requisitions/`, {
+    method: "GET",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+  return result.json();
+}
+
+export async function deleteRequisition(id: string) {
+  const token = await getAccessToken();
+
+  const result = await fetch(`${baseUrl}/api/v2/requisitions/${id}/`, {
+    method: "DELETE",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+  return result.json();
+}

packages/supabase/src/queries/index.ts

@@ -169,11 +169,14 @@ export async function getSpendingQuery(
       currency: data?.at(0)?.currency,
     },
     data: Object.entries(combinedValues).map(
-      ([category, { amount, currency }]) => ({
-        category,
-        currency,
-        amount: +Math.abs(amount).toFixed(2),
-      })
+      ([category, { amount, currency }]) => {
+        return {
+          category:
+            !category || category === "null" ? "uncategorized" : category,
+          currency,
+          amount: +Math.abs(amount).toFixed(2),
+        };
+      }
     ),
   };
 }
@@ -219,6 +222,7 @@ export async function getTransactionsQuery(
       `
       *,
       assigned:assigned_id(*),
+      enrichment:enrichment_id(id,category,logo_url),
       attachments(id,size,name)
     `,
       { count: "exact" }
@@ -290,7 +294,13 @@ export async function getTransactionsQuery(
       totalAmount,
       currency: data?.at(0)?.currency,
     },
-    data,
+    data: data?.map((transaction) => ({
+      ...transaction,
+      category:
+        transaction?.category ||
+        transaction?.enrichment?.category ||
+        "uncategorized",
+    })),
   };
 }
 
@@ -300,9 +310,9 @@ export async function getTransaction(supabase: Client, id: string) {
     .select(
       `
       *,
-      account:bank_account_id(*),
       assigned:assigned_id(*),
-      attachments(*)
+      enrichment:enrichment_id(id,category,logo_url),
+      attachments(id,size,name)
     `
     )
     .eq("id", id)