Merge branch 'develop' of github.com:EvolutionAPI/evolution-manager-v2 into develop

Author: DavidsonGomes

package-lock.json

@@ -63,6 +63,7 @@
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-switch": "^1.1.0",
     "@radix-ui/react-tabs": "^1.1.0",
+    "@radix-ui/react-tooltip": "^1.2.8",
     "@tanstack/react-query": "^5.52.1",
     "@tanstack/react-table": "^8.20.1",
     "axios": "^1.7.2",

package.json

@@ -0,0 +1,33 @@
+import * as Tooltip from "@radix-ui/react-tooltip";
+import { ReactNode } from "react";
+
+interface TooltipWrapperProps {
+  content: ReactNode; // o texto que vai aparecer no tooltip
+  children: ReactNode; // o trigger (qualquer elemento)
+  side?: "top" | "right" | "bottom" | "left"; // posição opcional
+}
+
+export function TooltipWrapper({ content, children, side = "top" }: TooltipWrapperProps) {
+  return (
+    <Tooltip.Provider delayDuration={200}>
+      <Tooltip.Root>
+        <Tooltip.Trigger asChild>
+          {children}
+        </Tooltip.Trigger>
+        <Tooltip.Portal>
+          <Tooltip.Content
+            side={side}
+             className="
+              rounded px-3 py-1.5 text-sm z-50 border shadow-lg
+            bg-gray-100 text-gray-900 border-gray-300
+            dark:bg-gray-800 dark:text-gray-100 dark:border-gray-700
+            "
+          >
+            {content}
+            <Tooltip.Arrow className="fill-gray-100 dark:fill-gray-800" width={18} height={9} />
+          </Tooltip.Content>
+        </Tooltip.Portal>
+      </Tooltip.Root>
+    </Tooltip.Provider>
+  );
+}

src/components/ui/tooltip.tsx

@@ -19,6 +19,7 @@ import { useManageInstance } from "@/lib/queries/instance/manageInstance";
 import { Instance } from "@/types/evolution.types";
 
 import { NewInstance } from "./NewInstance";
+import { TooltipWrapper } from "@/components/ui/tooltip";
 
 function Dashboard() {
   const { t } = useTranslation();
@@ -114,15 +115,20 @@ function Dashboard() {
       </div>
       <main className="grid gap-6 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
         {filteredInstances.length > 0 &&
-          Array.isArray(instances) &&
-          instances.map((instance: Instance) => (
+          Array.isArray(filteredInstances) ? (
+          filteredInstances.map((instance: Instance) => (
             <Card key={instance.id}>
               <CardHeader>
                 <Link to={`/manager/instance/${instance.id}/dashboard`} className="flex w-full flex-row items-center justify-between gap-4">
-                  <h3 className="text-wrap font-semibold">{instance.name}</h3>
-                  <Button variant="ghost" size="icon">
-                    <Cog className="card-icon" size="20" />
-                  </Button>
+                  <TooltipWrapper content={instance.name} side="top">
+                    <h3 className="text-wrap font-semibold truncate">{instance.name}</h3>
+                  </TooltipWrapper>
+
+                  <TooltipWrapper content={t("dashboard.settings")} side="top">
+                    <Button variant="ghost" size="icon">
+                      <Cog className="card-icon" size="20" />
+                    </Button>
+                  </TooltipWrapper>
                 </Link>
               </CardHeader>
               <CardContent className="flex-1 space-y-6">
@@ -161,7 +167,9 @@ function Dashboard() {
                 </Button>
               </CardFooter>
             </Card>
-          ))}
+          ))) :(
+          <p>{t("dashboard.instancesNotFound")}</p>
+          )}
       </main>
 
       {!!deleteConfirmation && (

src/pages/Dashboard/index.tsx

@@ -2,7 +2,9 @@
   "dashboard": {
     "title": "Instances",
     "search": "Search",
-    "status": "Status"
+    "status": "Status",
+    "settings": "Settings",
+    "instancesNotFound": "No instances found"
   },
   "button": {
     "delete": "Delete",

src/translate/languages/en-US.json

@@ -2,7 +2,9 @@
   "dashboard": {
     "title": "Instancias",
     "search": "Buscar",
-    "status": "Estado"
+    "status": "Estado",
+    "settings": "Configuraciones",
+    "instancesNotFound": "No se encontraron instancias"
   },
   "button": {
     "delete": "Eliminar",

src/translate/languages/es-ES.json

@@ -2,7 +2,9 @@
   "dashboard": {
     "title": "Instances",
     "search": "Rechercher",
-    "status": "Statut"
+    "status": "Statut",
+    "settings": "Paramètres",
+    "instancesNotFound": "Aucune instance trouvée"
   },
   "button": {
     "delete": "Supprimer",

src/translate/languages/fr-FR.json

@@ -2,7 +2,9 @@
   "dashboard": {
     "title": "Instâncias",
     "search": "Pesquisar",
-    "status": "Status"
+    "status": "Status",
+    "settings": "Configurações",
+    "instancesNotFound": "Nenhuma instância encontrada"
   },
   "button": {
     "delete": "Excluir",