feat: adição de novos ícones SVG e configuração do ambiente

- Adicionados ícones SVG para ChatGPT, Claude, Gemini e OpenRouter
- Implementados ícones para modos claro e escuro do ChatGPT
- Criado script de inicialização para PostgreSQL com extensão pgcrypto
- Adicionado script de configuração de ambiente que faz backup do .env
- Configurado tsconfig.json para TypeScript com opções de compilação

components/month-picker/loading-spinner.tsx

@@ -0,0 +1,9 @@
+"use client";
+
+import { RiLoader2Line } from "@remixicon/react";
+
+const LoadingSpinner = () => (
+  <RiLoader2Line size={"20"} className="animate-spin" />
+);
+
+export default LoadingSpinner;

components/month-picker/month-picker.tsx

@@ -0,0 +1,121 @@
+"use client";
+
+import { Card } from "@/components/ui/card";
+import { useMonthPeriod } from "@/hooks/use-month-period";
+import { money_font } from "@/public/fonts/font_index";
+import { useRouter } from "next/navigation";
+import { useEffect, useMemo, useTransition } from "react";
+import LoadingSpinner from "./loading-spinner";
+import NavigationButton from "./nav-button";
+import ReturnButton from "./return-button";
+
+export default function MonthPicker() {
+  const {
+    monthNames,
+    currentMonth,
+    currentYear,
+    defaultMonth,
+    defaultYear,
+    buildHref,
+  } = useMonthPeriod();
+
+  const router = useRouter();
+  const [isPending, startTransition] = useTransition();
+
+  const currentMonthLabel = useMemo(
+    () => currentMonth.charAt(0).toUpperCase() + currentMonth.slice(1),
+    [currentMonth]
+  );
+
+  const currentMonthIndex = useMemo(
+    () => monthNames.indexOf(currentMonth),
+    [monthNames, currentMonth]
+  );
+
+  const prevTarget = useMemo(() => {
+    let idx = currentMonthIndex - 1;
+    let year = currentYear;
+    if (idx < 0) {
+      idx = monthNames.length - 1;
+      year = (parseInt(currentYear) - 1).toString();
+    }
+    return buildHref(monthNames[idx], year);
+  }, [currentMonthIndex, currentYear, monthNames, buildHref]);
+
+  const nextTarget = useMemo(() => {
+    let idx = currentMonthIndex + 1;
+    let year = currentYear;
+    if (idx >= monthNames.length) {
+      idx = 0;
+      year = (parseInt(currentYear) + 1).toString();
+    }
+    return buildHref(monthNames[idx], year);
+  }, [currentMonthIndex, currentYear, monthNames, buildHref]);
+
+  const returnTarget = useMemo(
+    () => buildHref(defaultMonth, defaultYear),
+    [buildHref, defaultMonth, defaultYear]
+  );
+
+  const isDifferentFromCurrent =
+    currentMonth !== defaultMonth || currentYear !== defaultYear.toString();
+
+  // Prefetch otimizado: apenas meses adjacentes (M-1, M+1) e mês atual
+  // Isso melhora a performance da navegação sem sobrecarregar o cliente
+  useEffect(() => {
+    // Prefetch do mês anterior e próximo para navegação instantânea
+    router.prefetch(prevTarget);
+    router.prefetch(nextTarget);
+
+    // Prefetch do mês atual se não estivermos nele
+    if (isDifferentFromCurrent) {
+      router.prefetch(returnTarget);
+    }
+  }, [router, prevTarget, nextTarget, returnTarget, isDifferentFromCurrent]);
+
+  const handleNavigate = (href: string) => {
+    startTransition(() => {
+      router.replace(href, { scroll: false });
+    });
+  };
+
+  return (
+    <Card
+      className={`${money_font.className} sticky top-0 z-30 w-full flex-row border-none bg-month-picker text-month-picker-foreground p-5 shadow-none drop-shadow-none`}
+    >
+      <div className="flex items-center gap-1">
+        <NavigationButton
+          direction="left"
+          disabled={isPending}
+          onClick={() => handleNavigate(prevTarget)}
+        />
+
+        <div className="flex items-center">
+          <div
+            className="mx-1 space-x-1 capitalize font-medium tracking-wide"
+            aria-current={!isDifferentFromCurrent ? "date" : undefined}
+            aria-label={`Período selecionado: ${currentMonthLabel} de ${currentYear}`}
+          >
+            <span>{currentMonthLabel}</span>
+            <span className="font-bold">{currentYear}</span>
+          </div>
+
+          {isPending && <LoadingSpinner />}
+        </div>
+
+        <NavigationButton
+          direction="right"
+          disabled={isPending}
+          onClick={() => handleNavigate(nextTarget)}
+        />
+      </div>
+
+      {isDifferentFromCurrent && (
+        <ReturnButton
+          disabled={isPending}
+          onClick={() => handleNavigate(returnTarget)}
+        />
+      )}
+    </Card>
+  );
+}

components/month-picker/nav-button.tsx

@@ -0,0 +1,33 @@
+"use client";
+
+import { RiArrowLeftSLine, RiArrowRightSLine } from "@remixicon/react";
+import React from "react";
+
+interface NavigationButtonProps {
+  direction: "left" | "right";
+  disabled?: boolean;
+  onClick: () => void;
+}
+
+const NavigationButton = React.memo(
+  ({ direction, disabled, onClick }: NavigationButtonProps) => {
+    const Icon = direction === "left" ? RiArrowLeftSLine : RiArrowRightSLine;
+
+    return (
+      <button
+        onClick={onClick}
+        className="text-month-picker-foreground transition-all duration-200 cursor-pointer rounded-lg p-1 hover:bg-month-picker-foreground/10 focus:outline-hidden focus:ring-2 focus:ring-month-picker-foreground/30 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-transparent"
+        disabled={disabled}
+        aria-label={`Navegar para o mês ${
+          direction === "left" ? "anterior" : "seguinte"
+        }`}
+      >
+        <Icon className="text-primary" size={18} />
+      </button>
+    );
+  }
+);
+
+NavigationButton.displayName = "NavigationButton";
+
+export default NavigationButton;

components/month-picker/return-button.tsx

@@ -0,0 +1,27 @@
+"use client";
+
+import React from "react";
+import { Button } from "../ui/button";
+
+interface ReturnButtonProps {
+  disabled?: boolean;
+  onClick: () => void;
+}
+
+const ReturnButton = React.memo(({ disabled, onClick }: ReturnButtonProps) => {
+  return (
+    <Button
+      className="w-28 h-6"
+      size="sm"
+      disabled={disabled}
+      onClick={onClick}
+      aria-label="Retornar para o mês atual"
+    >
+      Mês Atual
+    </Button>
+  );
+});
+
+ReturnButton.displayName = "ReturnButton";
+
+export default ReturnButton;