diff --git a/src/App.tsx b/src/App.tsx
index 3029f80..c8c7a83 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,6 +1,6 @@
 import IndexApp from "@/components/index";
 import AutoUpdater from "@/components/auto-updater";
-import { Toaster } from "@/components/ui/toaster"
+import { Toaster } from "@/components/ui/toaster";
 import Loading from "@/components/common/loading";
 import { useState } from "react";
 import React from "react";
diff --git a/src/components/coins-amount-and-value-change.tsx b/src/components/coins-amount-and-value-change.tsx
index b42ca0b..30712e1 100644
--- a/src/components/coins-amount-and-value-change.tsx
+++ b/src/components/coins-amount-and-value-change.tsx
@@ -40,11 +40,11 @@ const App = ({
   const options = {
     maintainAspectRatio: false,
     responsive: false,
-    tooltips: {
+    hover: {
       mode: "index",
       intersect: false,
     },
-    hover: {
+    interaction: {
       mode: "index",
       intersect: false,
     },
@@ -108,7 +108,7 @@ const App = ({
       labels: current.timestamps.map((x) => timestampToDate(x)),
       datasets: [
         {
-          label: "Value In " + currency.currency,
+          label: `Value(${currency.currency})`,
           data: _(current.values)
             .map((v) => currencyWrapper(currency)(v))
             .value(),
diff --git a/src/components/pnl.tsx b/src/components/pnl.tsx
index 231bd77..74e9144 100644
--- a/src/components/pnl.tsx
+++ b/src/components/pnl.tsx
@@ -15,6 +15,14 @@ const App = ({
   const options = {
     maintainAspectRatio: false,
     responsive: false,
+    hover: {
+      mode: "index",
+      intersect: false,
+    },
+    interaction: {
+      mode: "index",
+      intersect: false,
+    },
     plugins: {
       title: {
         display: false,
diff --git a/src/components/top-coins-percentage-change.tsx b/src/components/top-coins-percentage-change.tsx
index 1367aa2..cefe3ee 100644
--- a/src/components/top-coins-percentage-change.tsx
+++ b/src/components/top-coins-percentage-change.tsx
@@ -27,6 +27,14 @@ const App = ({ data }: { data: TopCoinsPercentageChangeData }) => {
   const options = {
     maintainAspectRatio: false,
     responsive: false,
+    hover: {
+      mode: "nearest",
+      intersect: false,
+    },
+    interaction: {
+      mode: "nearest",
+      intersect: false,
+    },
     plugins: {
       title: {
         display: false,
diff --git a/src/components/top-coins-rank.tsx b/src/components/top-coins-rank.tsx
index f1e8394..63b465d 100644
--- a/src/components/top-coins-rank.tsx
+++ b/src/components/top-coins-rank.tsx
@@ -23,6 +23,14 @@ const App = ({ data }: { data: TopCoinsRankData }) => {
   const options = {
     maintainAspectRatio: false,
     responsive: false,
+    hover: {
+      mode: "nearest",
+      intersect: false,
+    },
+    interaction: {
+      mode: "nearest",
+      intersect: false,
+    },
     plugins: {
       title: {
         display: false,
diff --git a/src/components/total-value-and-change.tsx b/src/components/total-value-and-change.tsx
index 2dccc89..7b935a4 100644
--- a/src/components/total-value-and-change.tsx
+++ b/src/components/total-value-and-change.tsx
@@ -246,6 +246,14 @@ const App = ({
   const options = {
     maintainAspectRatio: false,
     responsive: false,
+    hover: {
+      mode: "index",
+      intersect: false,
+    },
+    interaction: {
+      mode: "index",
+      intersect: false,
+    },
     plugins: {
       title: {
         display: false,