From 50ffed4fee712697f568cf18f73b1b1588047553 Mon Sep 17 00:00:00 2001
From: Evandro Fonseca Junior <asemlk54@hotmail.com>
Date: Tue, 20 Jan 2026 21:36:20 -0300
Subject: [PATCH] fix(error tracking): streamline Rybbit integration by
 removing unnecessary type assertions

- Updated ErrorBoundary and ErrorTracking components to directly access the Rybbit object without type assertions.
- Enhanced error tracking by ensuring stack traces and component stacks are only included if available.
- Improved the HeroSection component by replacing the standard img tag with Next.js Image component for better performance and optimization.
---
 app/components/ErrorBoundary.tsx     |  8 ++++----
 app/components/ErrorTracking.tsx     |  8 ++++----
 app/sobre/components/HeroSection.tsx |  8 ++++++--
 lib/types/rybbit.d.ts                | 29 ++++++++++++++++++++++++++++
 4 files changed, 43 insertions(+), 10 deletions(-)
 create mode 100644 lib/types/rybbit.d.ts

diff --git a/app/components/ErrorBoundary.tsx b/app/components/ErrorBoundary.tsx
index c2e5030..c1e872b 100644
--- a/app/components/ErrorBoundary.tsx
+++ b/app/components/ErrorBoundary.tsx
@@ -27,12 +27,12 @@ export class ErrorBoundary extends Component<Props, State> {
 
   componentDidCatch(error: Error, errorInfo: ErrorInfo) {
     // Enviar erro ao Rybbit se disponível
-    if (typeof window !== "undefined" && (window as any).rybbit) {
+    if (typeof window !== "undefined" && window.rybbit) {
       try {
-        (window as any).rybbit.track("error", {
+        window.rybbit.track("error", {
           message: error.message,
-          stack: error.stack,
-          componentStack: errorInfo.componentStack,
+          stack: error.stack || undefined,
+          componentStack: errorInfo.componentStack || undefined,
           errorName: error.name,
           timestamp: new Date().toISOString(),
         });
diff --git a/app/components/ErrorTracking.tsx b/app/components/ErrorTracking.tsx
index 3d54c68..1ca98fa 100644
--- a/app/components/ErrorTracking.tsx
+++ b/app/components/ErrorTracking.tsx
@@ -10,9 +10,9 @@ export function ErrorTracking() {
   useEffect(() => {
     // Handler para erros JavaScript não capturados
     const handleError = (event: ErrorEvent) => {
-      if (typeof window !== "undefined" && (window as any).rybbit) {
+      if (typeof window !== "undefined" && window.rybbit) {
         try {
-          (window as any).rybbit.track("error", {
+          window.rybbit.track("error", {
             message: event.message,
             filename: event.filename,
             lineno: event.lineno,
@@ -30,11 +30,11 @@ export function ErrorTracking() {
 
     // Handler para Promise rejections não tratadas
     const handleUnhandledRejection = (event: PromiseRejectionEvent) => {
-      if (typeof window !== "undefined" && (window as any).rybbit) {
+      if (typeof window !== "undefined" && window.rybbit) {
         try {
           const error = event.reason instanceof Error ? event.reason : new Error(String(event.reason));
           
-          (window as any).rybbit.track("error", {
+          window.rybbit.track("error", {
             message: error.message || String(event.reason),
             stack: error.stack,
             errorName: error.name || "UnhandledPromiseRejection",
diff --git a/app/sobre/components/HeroSection.tsx b/app/sobre/components/HeroSection.tsx
index 8e8a9e5..58cb90b 100644
--- a/app/sobre/components/HeroSection.tsx
+++ b/app/sobre/components/HeroSection.tsx
@@ -1,6 +1,7 @@
 "use client";
 
 import { ChevronDown } from "lucide-react";
+import Image from "next/image";
 import { Button } from "@/components/ui/button";
 
 export function HeroSection() {
@@ -17,10 +18,13 @@ export function HeroSection() {
       <div className="relative z-10 max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
         {/* Logo */}
         <div className="mb-8">
-          <img
+          <Image
             src="/apple-touch-icon.png"
             alt="NutriScan Logo"
-            className="w-24 h-24 mx-auto rounded-2xl shadow-xl"
+            width={96}
+            height={96}
+            className="mx-auto rounded-2xl shadow-xl"
+            priority
           />
         </div>
 
diff --git a/lib/types/rybbit.d.ts b/lib/types/rybbit.d.ts
new file mode 100644
index 0000000..856fea1
--- /dev/null
+++ b/lib/types/rybbit.d.ts
@@ -0,0 +1,29 @@
+/**
+ * Definições de tipos para a API do Rybbit Analytics
+ * Estende a interface Window global para incluir o objeto rybbit
+ */
+
+interface RybbitTrackEvent {
+  message?: string;
+  stack?: string | null;
+  componentStack?: string | null;
+  errorName?: string;
+  timestamp?: string;
+  type?: string;
+  filename?: string | null;
+  lineno?: number | null;
+  colno?: number | null;
+  [key: string]: unknown;
+}
+
+interface Rybbit {
+  track(eventName: string, data?: RybbitTrackEvent): void;
+}
+
+declare global {
+  interface Window {
+    rybbit?: Rybbit;
+  }
+}
+
+export {};