Update consolidated and improved tooltips

src/App.tsx

@@ -19,6 +19,8 @@ import Settings from './components/settings';
 import LanguageSelector from './components/language-selector';
 import DisclaimerModal from './components/disclaimer-modal';
 import { Button } from './components/ui/button';
+import { TooltipProvider } from './components/ui/tooltip';
+import { IconButtonWithTooltip } from './components/ui/icon-button-with-tooltip';
 import { PROJECT_REPOSITORY_URL, APP_VERSION } from './constants/defaults';
 
 // Custom Hooks
@@ -100,19 +102,20 @@ const MedPlanAssistant = () => {
   } = useSimulation(appState);
 
   return (
-    <div className="min-h-screen bg-background p-4 sm:p-6 lg:p-8">
-      {/* Disclaimer Modal */}
-      <DisclaimerModal
-        isOpen={showDisclaimer}
-        onAccept={handleAcceptDisclaimer}
-        currentLanguage={currentLanguage}
-        onLanguageChange={changeLanguage}
-        t={t}
-      />
+    <TooltipProvider>
+      <div className="min-h-screen bg-background p-4 sm:p-6 lg:p-8">
+        {/* Disclaimer Modal */}
+        <DisclaimerModal
+          isOpen={showDisclaimer}
+          onAccept={handleAcceptDisclaimer}
+          currentLanguage={currentLanguage}
+          onLanguageChange={changeLanguage}
+          t={t}
+        />
 
-      <div className="max-w-7xl mx-auto">
-        <header className="mb-8">
-          <div className="flex justify-between items-start">
+        <div className="max-w-7xl mx-auto">
+          <header className="mb-8">
+            <div className="flex justify-between items-start">
             <div>
               <h1 className="text-3xl md:text-4xl font-bold tracking-tight">{t('appTitle')}</h1>
             </div>
@@ -147,15 +150,14 @@ const MedPlanAssistant = () => {
                   {t('both')}
                 </Button>
               </div>
-              <Button
+              <IconButtonWithTooltip
                 onClick={() => updateUiSetting('stickyChart', !uiSettings.stickyChart)}
+                icon={uiSettings.stickyChart ? <Pin size={16} /> : <PinOff size={16} />}
+                tooltip={uiSettings.stickyChart ? t('unpinChart') : t('pinChart')}
                 variant={uiSettings.stickyChart ? 'default' : 'outline'}
                 size="sm"
                 className="shrink-0"
-                title={uiSettings.stickyChart ? t('unpinChart') : t('pinChart')}
-              >
-                {uiSettings.stickyChart ? <Pin size={16} /> : <PinOff size={16} />}
-              </Button>
+              />
             </div>
 
             <SimulationChart
@@ -237,8 +239,9 @@ const MedPlanAssistant = () => {
             </div>
           </div>
         </footer>
+        </div>
       </div>
-    </div>
+    </TooltipProvider>
   );
 };