Remove unused font file and update font index; initialize database extensions with improved error handling; add EstabelecimentoLogo component for dynamic logo generation.

components/dashboard/purchases-by-category-widget.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { EstabelecimentoLogo } from "@/components/lancamentos/shared/estabelecimento-logo";
 import MoneyValues from "@/components/money-values";
 import {
   Select,
@@ -11,7 +12,6 @@ import {
 import { CATEGORY_TYPE_LABEL } from "@/lib/categorias/constants";
 import type { PurchasesByCategoryData } from "@/lib/dashboard/purchases-by-category";
 import { RiArrowDownLine, RiStore3Line } from "@remixicon/react";
-import Image from "next/image";
 import { useEffect, useMemo, useState } from "react";
 import { WidgetEmptyState } from "../widget-empty-state";
 
@@ -19,30 +19,6 @@ type PurchasesByCategoryWidgetProps = {
   data: PurchasesByCategoryData;
 };
 
-const resolveLogoPath = (logo: string | null) => {
-  if (!logo) {
-    return null;
-  }
-  if (/^(https?:\/\/|data:)/.test(logo)) {
-    return logo;
-  }
-  return logo.startsWith("/") ? logo : `/logos/${logo}`;
-};
-
-const buildInitials = (value: string) => {
-  const parts = value.trim().split(/\s+/).filter(Boolean);
-  if (parts.length === 0) {
-    return "LC";
-  }
-  if (parts.length === 1) {
-    const firstPart = parts[0];
-    return firstPart ? firstPart.slice(0, 2).toUpperCase() : "LC";
-  }
-  const firstChar = parts[0]?.[0] ?? "";
-  const secondChar = parts[1]?.[0] ?? "";
-  return `${firstChar}${secondChar}`.toUpperCase() || "LC";
-};
-
 const formatTransactionDate = (date: Date) => {
   const formatter = new Intl.DateTimeFormat("pt-BR", {
     weekday: "short",
@@ -180,30 +156,13 @@ export function PurchasesByCategoryWidget({
       ) : (
         <ul className="flex flex-col">
           {currentTransactions.map((transaction) => {
-            const logo = resolveLogoPath(transaction.logo);
-            const initials = buildInitials(transaction.name);
-
             return (
               <li
                 key={transaction.id}
                 className="flex items-center justify-between gap-3 border-b border-dashed py-2 last:border-b-0 last:pb-0"
               >
                 <div className="flex min-w-0 flex-1 items-center gap-3">
-                  <div className="flex size-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted">
-                    {logo ? (
-                      <Image
-                        src={logo}
-                        alt={`Logo de ${transaction.name}`}
-                        width={48}
-                        height={48}
-                        className="h-full w-full object-contain"
-                      />
-                    ) : (
-                      <span className="text-sm font-semibold uppercase text-muted-foreground">
-                        {initials}
-                      </span>
-                    )}
-                  </div>
+                  <EstabelecimentoLogo name={transaction.name} size={38} />
 
                   <div className="min-w-0">
                     <p className="truncate text-sm font-medium text-foreground">