highperfocused/danswer
1
0
Fork 0
mirror of https://github.com/danswer-ai/danswer.git synced 2025-05-07 18:30:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

Clean up tooltips (#3047)

Browse Source 
* clean up tooltips

* nit: fix delay duration
This commit is contained in:
pablodanswer 2024-11-05 08:48:19 -08:00 committed by GitHub
parent 9032fb4467
commit dea7a8f697
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
19 changed files with 446 additions and 763 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

479
web/package-lock.json generated
View File

@ -21,7 +21,7 @@
"@radix-ui/react-separator": "^1.1.0", "@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slot": "^1.1.0", "@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-tabs": "^1.1.1", "@radix-ui/react-tabs": "^1.1.1",
"@radix-ui/react-tooltip": "^1.0.7", "@radix-ui/react-tooltip": "^1.1.3",
"@sentry/nextjs": "^8.34.0", "@sentry/nextjs": "^8.34.0",
"@stripe/stripe-js": "^4.6.0", "@stripe/stripe-js": "^4.6.0",
"@types/js-cookie": "^3.0.3", "@types/js-cookie": "^3.0.3",
@ -3372,449 +3372,29 @@
} }
}, },
"node_modules/@radix-ui/react-tooltip": { "node_modules/@radix-ui/react-tooltip": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.0.7.tgz",
"integrity": "sha512-lPh5iKNFVQ/jav/j6ZrWq3blfDJ0OH9R6FlNUHPMqdLuQ9vwDgFsRxvl8b7Asuy5c8xmoojHUxKHQSOAvMHxyw==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/primitive": "1.0.1",
"@radix-ui/react-compose-refs": "1.0.1",
"@radix-ui/react-context": "1.0.1",
"@radix-ui/react-dismissable-layer": "1.0.5",
"@radix-ui/react-id": "1.0.1",
"@radix-ui/react-popper": "1.1.3",
"@radix-ui/react-portal": "1.0.4",
"@radix-ui/react-presence": "1.0.1",
"@radix-ui/react-primitive": "1.0.3",
"@radix-ui/react-slot": "1.0.2",
"@radix-ui/react-use-controllable-state": "1.0.1",
"@radix-ui/react-visually-hidden": "1.0.3"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-compose-refs": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz",
"integrity": "sha512-fDSBgd44FKHa1FRMU59qBMPFcl2PZE+2nmqunj+BWFyYYjnhIDWL2ItDs3rrbJDQOtzt5nIebLCQc4QRfz6LJw==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-context": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.0.1.tgz",
"integrity": "sha512-ebbrdFoYTcuZ0v4wG5tedGnp9tzcV8awzsxYph7gXUyvnNLuTIcCk1q17JEbnVhXAKG9oX3KtchwiMIAYp9NLg==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-dismissable-layer": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.5.tgz",
"integrity": "sha512-aJeDjQhywg9LBu2t/At58hCvr7pEm0o2Ke1x33B+MhjNmmZ17sy4KImo0KPLgsnc/zN7GPdce8Cnn0SWvwZO7g==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/primitive": "1.0.1",
"@radix-ui/react-compose-refs": "1.0.1",
"@radix-ui/react-primitive": "1.0.3",
"@radix-ui/react-use-callback-ref": "1.0.1",
"@radix-ui/react-use-escape-keydown": "1.0.3"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-dismissable-layer/node_modules/@radix-ui/react-use-callback-ref": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz",
"integrity": "sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-dismissable-layer/node_modules/@radix-ui/react-use-escape-keydown": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.3.tgz",
"integrity": "sha512-vyL82j40hcFicA+M4Ex7hVkB9vHgSse1ZWomAqV2Je3RleKGO5iM8KMOEtfoSB0PnIelMd2lATjTGMYqN5ylTg==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-use-callback-ref": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-id": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.0.1.tgz",
"integrity": "sha512-tI7sT/kqYp8p96yGWY1OAnLHrqDgzHefRBKQ2YAkBS5ja7QLcZ9Z/uY7bEjPUatf8RomoXM8/1sMj1IJaE5UzQ==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-use-layout-effect": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-id/node_modules/@radix-ui/react-use-layout-effect": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz",
"integrity": "sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper": {
"version": "1.1.3", "version": "1.1.3",
"resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.1.3.tgz", "resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.1.3.tgz",
"integrity": "sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==", "integrity": "sha512-Z4w1FIS0BqVFI2c1jZvb/uDVJijJjJ2ZMuPV81oVgTZ7g3BZxobplnMVvXtFWgtozdvYJ+MFWtwkM5S2HnAong==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@floating-ui/react-dom": "^2.0.0",
"@radix-ui/react-arrow": "1.0.3",
"@radix-ui/react-compose-refs": "1.0.1",
"@radix-ui/react-context": "1.0.1",
"@radix-ui/react-primitive": "1.0.3",
"@radix-ui/react-use-callback-ref": "1.0.1",
"@radix-ui/react-use-layout-effect": "1.0.1",
"@radix-ui/react-use-rect": "1.0.1",
"@radix-ui/react-use-size": "1.0.1",
"@radix-ui/rect": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper/node_modules/@radix-ui/react-arrow": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.0.3.tgz",
"integrity": "sha512-wSP+pHsB/jQRaL6voubsQ/ZlrGBHHrOjmBnr19hxYgtS0WvAFwZhK2WP/YY5yF9uKECCEEDGxuLxq1NBK51wFA==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-primitive": "1.0.3"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper/node_modules/@radix-ui/react-use-callback-ref": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz",
"integrity": "sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper/node_modules/@radix-ui/react-use-layout-effect": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz",
"integrity": "sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper/node_modules/@radix-ui/react-use-rect": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.0.1.tgz",
"integrity": "sha512-Cq5DLuSiuYVKNU8orzJMbl15TXilTnJKUCltMVQg53BQOF1/C5toAaGrowkgksdBQ9H+SRL23g0HDmg9tvmxXw==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/rect": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-popper/node_modules/@radix-ui/react-use-size": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.0.1.tgz",
"integrity": "sha512-ibay+VqrgcaI6veAojjofPATwledXiSmX+C0KrBk/xgpX9rBzPV3OsfwlhQdUOFbh+LKQorLYT+xTXW9V8yd0g==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-use-layout-effect": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-portal": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.0.4.tgz",
"integrity": "sha512-Qki+C/EuGUVCQTOTD5vzJzJuMUlewbzuKyUy+/iHM2uwGiru9gZeBJtHAPKAEkB5KWGi9mP/CHKcY0wt1aW45Q==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-primitive": "1.0.3"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-presence": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.0.1.tgz",
"integrity": "sha512-UXLW4UAbIY5ZjcvzjfRFo5gxva8QirC9hF7wRE4U5gz+TP0DbRk+//qyuAQ1McDxBt1xNMBTaciFGvEmJvAZCg==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-compose-refs": "1.0.1",
"@radix-ui/react-use-layout-effect": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-presence/node_modules/@radix-ui/react-use-layout-effect": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz",
"integrity": "sha512-v/5RegiJWYdoCvMnITBkNNx6bCj20fiaJnWtRkU18yITptraXjffz5Qbn05uOiQnOvi+dbkznkoaMltz1GnszQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-primitive": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz",
"integrity": "sha512-yi58uVyoAcK/Nq1inRY56ZSjKypBNKTa/1mcL8qdl6oJeEaDbOldlzrGn7P6Q3Id5d+SYNGc5AJgc4vGhjs5+g==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-slot": "1.0.2"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-slot": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.0.2.tgz",
"integrity": "sha512-YeTpuq4deV+6DusvVUW4ivBgnkHwECUu0BiN43L5UCDFgdhsRUWAghhTF5MbvNTPzmiFOx90asDSUjWuCNapwg==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@babel/runtime": "^7.13.10", "@radix-ui/primitive": "1.1.0",
"@radix-ui/react-compose-refs": "1.0.1" "@radix-ui/react-compose-refs": "1.1.0",
}, "@radix-ui/react-context": "1.1.1",
"peerDependencies": { "@radix-ui/react-dismissable-layer": "1.1.1",
"@types/react": "*", "@radix-ui/react-id": "1.1.0",
"react": "^16.8 || ^17.0 || ^18.0" "@radix-ui/react-popper": "1.2.0",
}, "@radix-ui/react-portal": "1.1.2",
"peerDependenciesMeta": { "@radix-ui/react-presence": "1.1.1",
"@types/react": { "@radix-ui/react-primitive": "2.0.0",
"optional": true "@radix-ui/react-slot": "1.1.0",
} "@radix-ui/react-use-controllable-state": "1.1.0",
} "@radix-ui/react-visually-hidden": "1.1.0"
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-use-controllable-state": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.1.tgz",
"integrity": "sha512-Svl5GY5FQeN758fWKrjM6Qb7asvXeiZltlT4U2gVfl8Gx5UAv2sMR0LWo8yhsIZh2oQ0eFdZ59aoOOMV7b47VA==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-use-callback-ref": "1.0.1"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-use-controllable-state/node_modules/@radix-ui/react-use-callback-ref": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz",
"integrity": "sha512-D94LjX4Sp0xJFVaoQOd3OO9k7tpBYNOXdVhkltUbGv2Qb9OXdrg/CpsjlZv7ia14Sylv398LswWBVVu5nqKzAQ==",
"dependencies": {
"@babel/runtime": "^7.13.10"
},
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
}
},
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-visually-hidden": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.0.3.tgz",
"integrity": "sha512-D4w41yN5YRKtu464TLnByKzMDG/JlMPHtfZgQAu9v6mNakUqGUI9vUrfQKz8NK41VMm/xbZbh76NUTVtIYqOMA==",
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/react-primitive": "1.0.3"
}, },
"peerDependencies": { "peerDependencies": {
"@types/react": "*", "@types/react": "*",
"@types/react-dom": "*", "@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0", "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
"react-dom": "^16.8 || ^17.0 || ^18.0" "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
}, },
"peerDependenciesMeta": { "peerDependenciesMeta": {
"@types/react": { "@types/react": {
@ -3825,12 +3405,25 @@
} }
} }
}, },
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/rect": { "node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/primitive": {
"version": "1.0.1", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.0.1.tgz", "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.0.tgz",
"integrity": "sha512-fyrgCaedtvMg9NK3en0pnOYJdtfwxUcNolezkNPUsoX57X8oQk+NkqcvzHXD2uKNij6GXmWU9NDru2IWjrO4BQ==", "integrity": "sha512-4Z8dn6Upk0qk4P74xBhZ6Hd/w0mPEzOOLxy4xiPXOXqjF7jZS0VAKk7/x/H6FyY2zCkYJqePf1G5KmkmNJ4RBA==",
"dependencies": { "license": "MIT"
"@babel/runtime": "^7.13.10" },
"node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/react-context": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.1.tgz",
"integrity": "sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==",
"license": "MIT",
"peerDependencies": {
"@types/react": "*",
"react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
} }
}, },
"node_modules/@radix-ui/react-use-callback-ref": { "node_modules/@radix-ui/react-use-callback-ref": {

2
web/package.json
View File

@ -22,7 +22,7 @@
"@radix-ui/react-separator": "^1.1.0", "@radix-ui/react-separator": "^1.1.0",
"@radix-ui/react-slot": "^1.1.0", "@radix-ui/react-slot": "^1.1.0",
"@radix-ui/react-tabs": "^1.1.1", "@radix-ui/react-tabs": "^1.1.1",
"@radix-ui/react-tooltip": "^1.0.7", "@radix-ui/react-tooltip": "^1.1.3",
"@sentry/nextjs": "^8.34.0", "@sentry/nextjs": "^8.34.0",
"@stripe/stripe-js": "^4.6.0", "@stripe/stripe-js": "^4.6.0",
"@types/js-cookie": "^3.0.3", "@types/js-cookie": "^3.0.3",

28
web/src/app/admin/assistants/AssistantEditor.tsx
View File

@ -36,7 +36,7 @@ import {
TooltipContent, TooltipContent,
TooltipProvider, TooltipProvider,
TooltipTrigger, TooltipTrigger,
} from "@radix-ui/react-tooltip"; } from "@/components/ui/tooltip";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
@ -565,15 +565,13 @@ export function AssistantEditor({
align="start" align="start"
side="bottom" side="bottom"
/> />
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<FiInfo size={12} /> <FiInfo size={12} />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="top" align="center"> <TooltipContent side="top" align="center">
<p className="bg-background-900 max-w-[200px] mb-1 text-sm rounded-lg p-1.5 text-white"> This icon will visually represent your Assistant
This icon will visually represent your Assistant
</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
</TooltipProvider> </TooltipProvider>
@ -609,16 +607,14 @@ export function AssistantEditor({
<div className="block font-medium text-base"> <div className="block font-medium text-base">
Default AI Model{" "} Default AI Model{" "}
</div> </div>
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<FiInfo size={12} /> <FiInfo size={12} />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="top" align="center"> <TooltipContent side="top" align="center">
<p className="bg-background-900 max-w-[200px] mb-1 text-sm rounded-lg p-1.5 text-white"> Select a Large Language Model (Generative AI model) to
Select a Large Language Model (Generative AI model) to power this Assistant
power this Assistant
</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
</TooltipProvider> </TooltipProvider>
@ -706,16 +702,14 @@ export function AssistantEditor({
<div className="block font-medium text-base"> <div className="block font-medium text-base">
Capabilities{" "} Capabilities{" "}
</div> </div>
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<FiInfo size={12} /> <FiInfo size={12} />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="top" align="center"> <TooltipContent side="top" align="center">
<p className="bg-background-900 max-w-[200px] mb-1 text-sm rounded-lg p-1.5 text-white"> You can give your assistant advanced capabilities like
You can give your assistant advanced capabilities like image generation
image generation
</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
</TooltipProvider> </TooltipProvider>
@ -726,7 +720,7 @@ export function AssistantEditor({
<div className="mt-4 flex flex-col gap-y-4 ml-1"> <div className="mt-4 flex flex-col gap-y-4 ml-1">
{imageGenerationTool && ( {imageGenerationTool && (
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<div <div
@ -774,7 +768,7 @@ export function AssistantEditor({
)} )}
{searchTool && ( {searchTool && (
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<div <div

30
web/src/app/admin/connector/[ccPairId]/IndexingAttemptsTable.tsx
View File

@ -23,7 +23,12 @@ import { InfoIcon, SearchIcon } from "@/components/icons/icons";
import Link from "next/link"; import Link from "next/link";
import ExceptionTraceModal from "@/components/modals/ExceptionTraceModal"; import ExceptionTraceModal from "@/components/modals/ExceptionTraceModal";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { FiInfo } from "react-icons/fi"; import { FiInfo } from "react-icons/fi";
// This is the number of index attempts to display per page // This is the number of index attempts to display per page
@ -237,15 +242,20 @@ export function IndexingAttemptsTable({ ccPair }: { ccPair: CCPairFullInfo }) {
<TableHead>New Doc Cnt</TableHead> <TableHead>New Doc Cnt</TableHead>
<TableHead> <TableHead>
<div className="w-fit"> <div className="w-fit">
<Tooltip <TooltipProvider>
width="max-w-sm" <Tooltip>
content="Total number of documents replaced in the index during this indexing attempt" <TooltipTrigger asChild>
> <span className="cursor-help flex items-center">
<span className="cursor-help flex items-center"> Total Doc Cnt
Total Doc Cnt <InfoIcon className="ml-1 w-4 h-4" />
<InfoIcon className="ml-1 w-4 h-4" /> </span>
</span> </TooltipTrigger>
</Tooltip> <TooltipContent>
Total number of documents replaced in the index during
this indexing attempt
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div> </div>
</TableHead> </TableHead>
<TableHead>Error Message</TableHead> <TableHead>Error Message</TableHead>

69
web/src/app/admin/documents/sets/page.tsx
View File

@ -35,6 +35,12 @@ import Link from "next/link";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { TableHeader } from "@/components/ui/table"; import { TableHeader } from "@/components/ui/table";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
const numToDisplay = 50; const numToDisplay = 50;
@ -47,8 +53,6 @@ const EditRow = ({
}) => { }) => {
const router = useRouter(); const router = useRouter();
const [isSyncingTooltipOpen, setIsSyncingTooltipOpen] = useState(false);
if (!isEditable) { if (!isEditable) {
return ( return (
<div className="text-emphasis font-medium my-auto p-1"> <div className="text-emphasis font-medium my-auto p-1">
@ -59,37 +63,36 @@ const EditRow = ({
return ( return (
<div className="relative flex"> <div className="relative flex">
{isSyncingTooltipOpen && ( <TooltipProvider>
<div className="flex flex-nowrap absolute w-64 top-0 left-0 mt-8 border border-border bg-background px-3 py-2 rounded shadow-lg break-words z-40"> <Tooltip>
<InfoIcon className="mt-1 flex flex-shrink-0 mr-2" /> Cannot update <TooltipTrigger asChild>
while syncing! Wait for the sync to finish, then try again. <div
</div> className={`
)} text-emphasis font-medium my-auto p-1 hover:bg-hover-light flex items-center select-none
<div ${documentSet.is_up_to_date ? "cursor-pointer" : "cursor-default"}
className={` `}
text-emphasis font-medium my-auto p-1 hover:bg-hover-light flex items-center select-none style={{ wordBreak: "normal", overflowWrap: "break-word" }}
${documentSet.is_up_to_date ? "cursor-pointer" : "cursor-default"} onClick={() => {
`} if (documentSet.is_up_to_date) {
style={{ wordBreak: "normal", overflowWrap: "break-word" }} router.push(`/admin/documents/sets/${documentSet.id}`);
onClick={() => { }
if (documentSet.is_up_to_date) { }}
router.push(`/admin/documents/sets/${documentSet.id}`); >
} <FiEdit2 className="mr-2 flex-shrink-0" />
}} <span className="font-medium">{documentSet.name}</span>
onMouseEnter={() => { </div>
if (!documentSet.is_up_to_date) { </TooltipTrigger>
setIsSyncingTooltipOpen(true); {!documentSet.is_up_to_date && (
} <TooltipContent maxWidth="max-w-sm">
}} <div className="flex break-words break-keep whitespace-pre-wrap items-start">
onMouseLeave={() => { <InfoIcon className="mr-2 mt-0.5" />
if (!documentSet.is_up_to_date) { Cannot update while syncing! Wait for the sync to finish, then
setIsSyncingTooltipOpen(false); try again.
} </div>
}} </TooltipContent>
> )}
<FiEdit2 className="mr-2 flex-shrink-0" /> </Tooltip>
<span className="font-medium">{documentSet.name}</span> </TooltipProvider>
</div>
</div> </div>
); );
}; };

42
web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx
View File

@ -27,7 +27,12 @@ import {
FiRefreshCw, FiRefreshCw,
FiPauseCircle, FiPauseCircle,
} from "react-icons/fi"; } from "react-icons/fi";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { SourceIcon } from "@/components/SourceIcon"; import { SourceIcon } from "@/components/SourceIcon";
import { getSourceDisplayName } from "@/lib/sources"; import { getSourceDisplayName } from "@/lib/sources";
import { CustomTooltip } from "@/components/tooltip/CustomTooltip"; import { CustomTooltip } from "@/components/tooltip/CustomTooltip";
@ -77,21 +82,26 @@ function SummaryRow({
<TableCell> <TableCell>
<div className="text-sm text-gray-500">Active Connectors</div> <div className="text-sm text-gray-500">Active Connectors</div>
<Tooltip <TooltipProvider>
content={`${summary.active} out of ${summary.count} connectors are active`} <Tooltip>
> <TooltipTrigger asChild>
<div className="flex items-center mt-1"> <div className="flex items-center mt-1">
<div className="w-full bg-gray-200 rounded-full h-2 mr-2"> <div className="w-full bg-gray-200 rounded-full h-2 mr-2">
<div <div
className="bg-green-500 h-2 rounded-full" className="bg-green-500 h-2 rounded-full"
style={{ width: `${activePercentage}%` }} style={{ width: `${activePercentage}%` }}
></div> ></div>
</div> </div>
<span className="text-sm font-medium whitespace-nowrap"> <span className="text-sm font-medium whitespace-nowrap">
{summary.active} ({activePercentage.toFixed(0)}%) {summary.active} ({activePercentage.toFixed(0)}%)
</span> </span>
</div> </div>
</Tooltip> </TooltipTrigger>
<TooltipContent>
{summary.active} out of {summary.count} connectors are active
</TooltipContent>
</Tooltip>
</TooltipProvider>
</TableCell> </TableCell>
{isPaidEnterpriseFeaturesEnabled && ( {isPaidEnterpriseFeaturesEnabled && (

30
web/src/app/chat/files/InputBarPreview.tsx
View File

@ -3,7 +3,12 @@ import { FileDescriptor } from "../interfaces";
import { FiX, FiLoader, FiFileText } from "react-icons/fi"; import { FiX, FiLoader, FiFileText } from "react-icons/fi";
import { InputBarPreviewImage } from "./images/InputBarPreviewImage"; import { InputBarPreviewImage } from "./images/InputBarPreviewImage";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
function DeleteButton({ onDelete }: { onDelete: () => void }) { function DeleteButton({ onDelete }: { onDelete: () => void }) {
return ( return (
@ -138,14 +143,21 @@ export function InputBarPreview({
</div> </div>
</div> </div>
<div className="ml-2 relative"> <div className="ml-2 relative">
<Tooltip content={file.name} side="top" align="start"> <TooltipProvider>
<div <Tooltip>
ref={fileNameRef} <TooltipTrigger asChild>
className={`font-medium text-sm line-clamp-1 break-all ellipses max-w-48`} <div
> ref={fileNameRef}
{file.name} className={`font-medium text-sm line-clamp-1 break-all ellipses max-w-48`}
</div> >
</Tooltip> {file.name}
</div>
</TooltipTrigger>
<TooltipContent side="top" align="start">
{file.name}
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div> </div>
<button <button
onClick={onDelete} onClick={onDelete}

61
web/src/app/chat/files/documents/DocumentPreview.tsx
View File

@ -1,6 +1,11 @@
import { FiFileText } from "react-icons/fi"; import { FiFileText } from "react-icons/fi";
import { useState, useRef, useEffect } from "react"; import { useState, useRef, useEffect } from "react";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { ExpandTwoIcon } from "@/components/icons/icons"; import { ExpandTwoIcon } from "@/components/icons/icons";
export function DocumentPreview({ export function DocumentPreview({
@ -52,16 +57,23 @@ export function DocumentPreview({
</div> </div>
</div> </div>
<div className="ml-4 flex-grow"> <div className="ml-4 flex-grow">
<Tooltip content={fileName} side="top" align="start"> <TooltipProvider>
<div <Tooltip>
ref={fileNameRef} <TooltipTrigger asChild>
className={`font-medium text-sm line-clamp-1 break-all ellipsis ${ <div
maxWidth ? maxWidth : "max-w-48" ref={fileNameRef}
}`} className={`font-medium text-sm line-clamp-1 break-all ellipsis ${
> maxWidth ? maxWidth : "max-w-48"
{fileName} }`}
</div> >
</Tooltip> {fileName}
</div>
</TooltipTrigger>
<TooltipContent side="top" align="start">
{fileName}
</TooltipContent>
</Tooltip>
</TooltipProvider>
<div className="text-subtle text-xs mt-1">Document</div> <div className="text-subtle text-xs mt-1">Document</div>
</div> </div>
{open && ( {open && (
@ -128,16 +140,23 @@ export function InputDocumentPreview({
</div> </div>
</div> </div>
<div className="ml-2 relative"> <div className="ml-2 relative">
<Tooltip content={fileName} side="top" align="start"> <TooltipProvider>
<div <Tooltip>
ref={fileNameRef} <TooltipTrigger asChild>
className={`font-medium text-sm line-clamp-1 break-all ellipses ${ <div
maxWidth ? maxWidth : "max-w-48" ref={fileNameRef}
}`} className={`font-medium text-sm line-clamp-1 break-all ellipses ${
> maxWidth ? maxWidth : "max-w-48"
{fileName} }`}
</div> >
</Tooltip> {fileName}
</div>
</TooltipTrigger>
<TooltipContent side="top" align="start">
{fileName}
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div> </div>
</div> </div>
); );

52
web/src/app/chat/input/ChatInputAssistant.tsx
View File

@ -2,7 +2,12 @@
import { Persona } from "@/app/admin/assistants/interfaces"; import { Persona } from "@/app/admin/assistants/interfaces";
import { AssistantIcon } from "@/components/assistants/AssistantIcon"; import { AssistantIcon } from "@/components/assistants/AssistantIcon";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { ForwardedRef, forwardRef, useState } from "react"; import { ForwardedRef, forwardRef, useState } from "react";
import { FiX } from "react-icons/fi"; import { FiX } from "react-icons/fi";
@ -23,27 +28,30 @@ export const ChatInputAssistant = forwardRef<
onMouseLeave={() => setIsHovered(false)} onMouseLeave={() => setIsHovered(false)}
className="flex-none h-10 duration-300 h-10 items-center rounded-lg bg-background-150" className="flex-none h-10 duration-300 h-10 items-center rounded-lg bg-background-150"
> >
<Tooltip <TooltipProvider>
content={ <Tooltip>
<p className="max-w-xs flex">{alternativeAssistant.description}</p> <TooltipTrigger asChild>
} <div
> ref={ref}
<div className="p-2 gap-x-1 relative rounded-t-lg items-center flex"
ref={ref} >
className="p-2 gap-x-1 relative rounded-t-lg items-center flex" <AssistantIcon assistant={alternativeAssistant} border />
> <p className="ml-1 line-clamp-1 ellipsis break-all my-auto">
<AssistantIcon assistant={alternativeAssistant} border /> {alternativeAssistant.name}
<p className="ml-1 line-clamp-1 ellipsis break-all my-auto"> </p>
{alternativeAssistant.name} <div
</p> className="rounded-lg rounded h-fit cursor-pointer"
<div onClick={unToggle}
className="rounded-lg rounded h-fit cursor-pointer" >
onClick={unToggle} <FiX />
> </div>
<FiX /> </div>
</div> </TooltipTrigger>
</div> <TooltipContent>
</Tooltip> <p className="max-w-xs flex">{alternativeAssistant.description}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
</div> </div>
); );
}); });

44
web/src/app/chat/input/ChatInputBar.tsx
View File

@ -29,7 +29,12 @@ import { LlmTab } from "../modal/configuration/LlmTab";
import { AssistantsTab } from "../modal/configuration/AssistantsTab"; import { AssistantsTab } from "../modal/configuration/AssistantsTab";
import { DanswerDocument } from "@/lib/search/interfaces"; import { DanswerDocument } from "@/lib/search/interfaces";
import { AssistantIcon } from "@/components/assistants/AssistantIcon"; import { AssistantIcon } from "@/components/assistants/AssistantIcon";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { Hoverable } from "@/components/Hoverable"; import { Hoverable } from "@/components/Hoverable";
import { SettingsContext } from "@/components/settings/SettingsProvider"; import { SettingsContext } from "@/components/settings/SettingsProvider";
import { ChatState } from "../types"; import { ChatState } from "../types";
@ -399,17 +404,20 @@ export function ChatInputBar({
{alternativeAssistant.name} {alternativeAssistant.name}
</p> </p>
<div className="flex gap-x-1 ml-auto"> <div className="flex gap-x-1 ml-auto">
<Tooltip <TooltipProvider>
content={ <Tooltip>
<p className="max-w-xs flex flex-wrap"> <TooltipTrigger asChild>
{alternativeAssistant.description} <button>
</p> <Hoverable icon={FiInfo} />
} </button>
> </TooltipTrigger>
<button> <TooltipContent>
<Hoverable icon={FiInfo} /> <p className="max-w-xs flex flex-wrap">
</button> {alternativeAssistant.description}
</Tooltip> </p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<Hoverable <Hoverable
icon={FiX} icon={FiX}
@ -613,7 +621,11 @@ export function ChatInputBar({
chatState == "toolBuilding" || chatState == "toolBuilding" ||
chatState == "loading" ? ( chatState == "loading" ? (
<button <button
className={`cursor-pointer ${chatState != "streaming" ? "bg-background-400" : "bg-background-800"} h-[28px] w-[28px] rounded-full`} className={`cursor-pointer ${
chatState != "streaming"
? "bg-background-400"
: "bg-background-800"
} h-[28px] w-[28px] rounded-full`}
onClick={stopGenerating} onClick={stopGenerating}
disabled={chatState != "streaming"} disabled={chatState != "streaming"}
> >
@ -635,7 +647,11 @@ export function ChatInputBar({
> >
<SendIcon <SendIcon
size={28} size={28}
className={`text-emphasis text-white p-1 rounded-full ${chatState == "input" && message ? "bg-submit-background" : "bg-disabled-submit-background"} `} className={`text-emphasis text-white p-1 rounded-full ${
chatState == "input" && message
? "bg-submit-background"
: "bg-disabled-submit-background"
} `}
/> />
</button> </button>
)} )}

34
web/src/app/chat/message/Messages.tsx
View File

@ -45,7 +45,12 @@ import {
TooltipGroup, TooltipGroup,
} from "@/components/tooltip/CustomTooltip"; } from "@/components/tooltip/CustomTooltip";
import { ValidSources } from "@/lib/types"; import { ValidSources } from "@/lib/types";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { useMouseTracking } from "./hooks"; import { useMouseTracking } from "./hooks";
import { InternetSearchIcon } from "@/components/InternetSearchIcon"; import { InternetSearchIcon } from "@/components/InternetSearchIcon";
import { SettingsContext } from "@/components/settings/SettingsProvider"; import { SettingsContext } from "@/components/settings/SettingsProvider";
@ -895,17 +900,22 @@ export const HumanMessage = ({
isHovered && isHovered &&
!isEditing && !isEditing &&
(!files || files.length === 0) ? ( (!files || files.length === 0) ? (
<Tooltip delayDuration={1000} content={"Edit message"}> <TooltipProvider delayDuration={1000}>
<button <Tooltip>
className="hover:bg-hover p-1.5 rounded" <TooltipTrigger>
onClick={() => { <button
setIsEditing(true); className="hover:bg-hover p-1.5 rounded"
setIsHovered(false); onClick={() => {
}} setIsEditing(true);
> setIsHovered(false);
<FiEdit2 className="!h-4 !w-4" /> }}
</button> >
</Tooltip> <FiEdit2 className="!h-4 !w-4" />
</button>
</TooltipTrigger>
<TooltipContent>Edit</TooltipContent>
</Tooltip>
</TooltipProvider>
) : ( ) : (
<div className="w-7" /> <div className="w-7" />
)} )}

32
web/src/app/chat/message/SearchSummary.tsx
View File

@ -4,7 +4,12 @@ import {
} from "@/components/BasicClickable"; } from "@/components/BasicClickable";
import { HoverPopup } from "@/components/HoverPopup"; import { HoverPopup } from "@/components/HoverPopup";
import { Hoverable } from "@/components/Hoverable"; import { Hoverable } from "@/components/Hoverable";
import { Tooltip } from "@/components/tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import { FiCheck, FiEdit2, FiSearch, FiX } from "react-icons/fi"; import { FiCheck, FiEdit2, FiSearch, FiX } from "react-icons/fi";
@ -169,16 +174,21 @@ export function SearchSummary({
)} )}
</div> </div>
{handleSearchQueryEdit && ( {handleSearchQueryEdit && (
<Tooltip delayDuration={1000} content={"Edit Search"}> <TooltipProvider delayDuration={1000}>
<button <Tooltip>
className="my-auto hover:bg-hover p-1.5 rounded" <TooltipTrigger asChild>
onClick={() => { <button
setIsEditing(true); className="my-auto hover:bg-hover p-1.5 rounded"
}} onClick={() => {
> setIsEditing(true);
<FiEdit2 /> }}
</button> >
</Tooltip> <FiEdit2 />
</button>
</TooltipTrigger>
<TooltipContent>Edit Search</TooltipContent>
</Tooltip>
</TooltipProvider>
)} )}
</> </>
)} )}

6
web/src/components/admin/connectors/AdminSidebar.tsx
View File

@ -13,7 +13,7 @@ import {
TooltipContent, TooltipContent,
TooltipProvider, TooltipProvider,
TooltipTrigger, TooltipTrigger,
} from "@radix-ui/react-tooltip"; } from "@/components/ui/tooltip";
interface Item { interface Item {
name: string | JSX.Element; name: string | JSX.Element;
@ -105,9 +105,7 @@ export function AdminSidebar({ collections }: { collections: Collection[] }) {
<WarningCircle size={18} className="text-error" /> <WarningCircle size={18} className="text-error" />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<p className="max-w-xs text-text-100 mb-1 p-2 rounded-lg bg-background-900"> Navigate here to update your search settings
Navigate here to update your search settings
</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
</TooltipProvider> </TooltipProvider>

8
web/src/components/admin/connectors/Field.tsx
View File

@ -22,7 +22,7 @@ import {
Tooltip, Tooltip,
TooltipContent, TooltipContent,
TooltipTrigger, TooltipTrigger,
} from "@radix-ui/react-tooltip"; } from "@/components/ui/tooltip";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
import { FaMarkdown } from "react-icons/fa"; import { FaMarkdown } from "react-icons/fa";
import { useRef, useState } from "react"; import { useRef, useState } from "react";
@ -107,15 +107,13 @@ export function ToolTipDetails({
children: string | JSX.Element; children: string | JSX.Element;
}) { }) {
return ( return (
<TooltipProvider delayDuration={50}> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<FiInfo size={12} /> <FiInfo size={12} />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent side="top" align="center"> <TooltipContent side="top" align="center">
<p className="bg-background-900 max-w-[200px] mb-1 text-sm rounded-lg p-1.5 text-inverted"> {children}
{children}
</p>
</TooltipContent> </TooltipContent>
</Tooltip> </Tooltip>
</TooltipProvider> </TooltipProvider>

1
web/src/components/assistants/AssistantIcon.tsx
View File

@ -1,6 +1,5 @@
import { Persona } from "@/app/admin/assistants/interfaces"; import { Persona } from "@/app/admin/assistants/interfaces";
import React from "react"; import React from "react";
import { Tooltip } from "../tooltip/Tooltip";
import { createSVG } from "@/lib/assistantIconUtils"; import { createSVG } from "@/lib/assistantIconUtils";
import { buildImgUrl } from "@/app/chat/files/images/utils"; import { buildImgUrl } from "@/app/chat/files/images/utils";
import { CustomTooltip } from "../tooltip/CustomTooltip"; import { CustomTooltip } from "../tooltip/CustomTooltip";

104
web/src/components/header/LogoType.tsx
View File

@ -7,7 +7,12 @@ import {
NEXT_PUBLIC_NEW_CHAT_DIRECTS_TO_SAME_PERSONA, NEXT_PUBLIC_NEW_CHAT_DIRECTS_TO_SAME_PERSONA,
} from "@/lib/constants"; } from "@/lib/constants";
import { LeftToLineIcon, NewChatIcon, RightToLineIcon } from "../icons/icons"; import { LeftToLineIcon, NewChatIcon, RightToLineIcon } from "../icons/icons";
import { Tooltip } from "../tooltip/Tooltip"; import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { pageType } from "@/app/chat/sessionSidebar/types"; import { pageType } from "@/app/chat/sessionSidebar/types";
import { Logo } from "../Logo"; import { Logo } from "../Logo";
import { HeaderTitle } from "./HeaderTitle"; import { HeaderTitle } from "./HeaderTitle";
@ -39,7 +44,7 @@ export default function LogoType({
<div <div
className={`${ className={`${
hideOnMobile && "mobile:hidden" hideOnMobile && "mobile:hidden"
} z-[100] mb-auto shrink-0 flex items-center text-xl font-bold`} } z-[100] mb-auto shrink-0 flex items-center text-xl`}
> >
{toggleSidebar && page == "chat" ? ( {toggleSidebar && page == "chat" ? (
<button <button
@ -76,51 +81,60 @@ export default function LogoType({
</div> </div>
{page == "chat" && !showArrow && ( {page == "chat" && !showArrow && (
<Tooltip delayDuration={1000} content="New Chat"> <TooltipProvider delayDuration={1000}>
<Link <Tooltip>
className="my-auto mobile:hidden" <TooltipTrigger asChild>
href={ <Link
`/${page}` + className="my-auto mobile:hidden"
(NEXT_PUBLIC_NEW_CHAT_DIRECTS_TO_SAME_PERSONA && assistantId href={
? `?assistantId=${assistantId}` `/${page}` +
: "") (NEXT_PUBLIC_NEW_CHAT_DIRECTS_TO_SAME_PERSONA && assistantId
} ? `?assistantId=${assistantId}`
onClick={(e) => { : "")
if (e.metaKey || e.ctrlKey) { }
return; onClick={(e) => {
} if (e.metaKey || e.ctrlKey) {
if (handleNewChat) { return;
handleNewChat(); }
} if (handleNewChat) {
}} handleNewChat();
> }
<div className="cursor-pointer ml-2 flex-none text-text-700 hover:text-text-600 transition-colors duration-300"> }}
<NewChatIcon size={20} /> >
</div> <div className="cursor-pointer ml-2 flex-none text-text-700 hover:text-text-600 transition-colors duration-300">
</Link> <NewChatIcon size={20} />
</Tooltip> </div>
</Link>
</TooltipTrigger>
<TooltipContent>New Chat</TooltipContent>
</Tooltip>
</TooltipProvider>
)} )}
{showArrow && toggleSidebar && ( {showArrow && toggleSidebar && (
<Tooltip <TooltipProvider delayDuration={0}>
delayDuration={0} <Tooltip>
content={toggled ? `Unpin sidebar` : "Pin sidebar"} <TooltipTrigger asChild>
> <button
<button className="mr-3 my-auto ml-auto"
className="mr-3 my-auto ml-auto" onClick={() => {
onClick={() => { toggleSidebar();
toggleSidebar(); if (toggled) {
if (toggled) { explicitlyUntoggle();
explicitlyUntoggle(); }
} }}
}} >
> {!toggled && !combinedSettings?.isMobile ? (
{!toggled && !combinedSettings?.isMobile ? ( <RightToLineIcon className="text-sidebar-toggle" />
<RightToLineIcon className="text-sidebar-toggle" /> ) : (
) : ( <LeftToLineIcon className="text-sidebar-toggle" />
<LeftToLineIcon className="text-sidebar-toggle" /> )}
)} </button>
</button> </TooltipTrigger>
</Tooltip> <TooltipContent>
{toggled ? `Unpin sidebar` : "Pin sidebar"}
</TooltipContent>
</Tooltip>
</TooltipProvider>
)} )}
</div> </div>
); );

102
web/src/components/search/SearchResultsDisplay.tsx
View File

@ -7,13 +7,17 @@ import {
SearchResponse, SearchResponse,
} from "@/lib/search/interfaces"; } from "@/lib/search/interfaces";
import { usePopup } from "../admin/connectors/Popup"; import { usePopup } from "../admin/connectors/Popup";
import { AlertIcon, BroomIcon, MagnifyingIcon, UndoIcon } from "../icons/icons"; import { AlertIcon, MagnifyingIcon, UndoIcon } from "../icons/icons";
import { AgenticDocumentDisplay, DocumentDisplay } from "./DocumentDisplay"; import { AgenticDocumentDisplay, DocumentDisplay } from "./DocumentDisplay";
import { searchState } from "./SearchSection"; import { searchState } from "./SearchSection";
import { useContext, useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Tooltip } from "../tooltip/Tooltip"; import {
Tooltip,
TooltipProvider,
TooltipContent,
TooltipTrigger,
} from "@/components/ui/tooltip";
import KeyboardSymbol from "@/lib/browserUtilities"; import KeyboardSymbol from "@/lib/browserUtilities";
import { SettingsContext } from "../settings/SettingsProvider";
import { DISABLE_LLM_DOC_RELEVANCE } from "@/lib/constants"; import { DISABLE_LLM_DOC_RELEVANCE } from "@/lib/constants";
const getSelectedDocumentIds = ( const getSelectedDocumentIds = (
@ -169,48 +173,56 @@ export const SearchResultsDisplay = ({
<p>Results</p> <p>Results</p>
{!DISABLE_LLM_DOC_RELEVANCE && {!DISABLE_LLM_DOC_RELEVANCE &&
(contentEnriched || searchResponse.additional_relevance) && ( (contentEnriched || searchResponse.additional_relevance) && (
<Tooltip <TooltipProvider delayDuration={1000}>
delayDuration={1000} <Tooltip>
content={<div className="flex">{commandSymbol}O</div>} <TooltipTrigger asChild>
> <button
<button onClick={() => {
onClick={() => { performSweep();
performSweep(); if (agenticResults) {
if (agenticResults) { setShowAll((showAll) => !showAll);
setShowAll((showAll) => !showAll); }
} }}
}} className={`flex items-center justify-center animate-fade-in-up rounded-lg p-1 text-xs transition-all duration-300 w-20 h-8 ${
className={`flex items-center justify-center animate-fade-in-up rounded-lg p-1 text-xs transition-all duration-300 w-20 h-8 ${ !sweep
!sweep ? "bg-background-agentic-toggled text-text-agentic-toggled"
? "bg-background-agentic-toggled text-text-agentic-toggled" : "bg-background-agentic-untoggled text-text-agentic-untoggled"
: "bg-background-agentic-untoggled text-text-agentic-untoggled" }`}
}`} style={{
style={{ transform: sweep
transform: sweep ? "rotateZ(180deg)" : "rotateZ(0deg)", ? "rotateZ(180deg)"
}} : "rotateZ(0deg)",
> }}
<div >
className={`flex items-center ${sweep ? "rotate-180" : ""}`} <div
> className={`flex items-center ${
<span></span> sweep ? "rotate-180" : ""
{!sweep }`}
? agenticResults >
? "Show All" <span></span>
: "Focus" {!sweep
: agenticResults ? agenticResults
? "Focus" ? "Show All"
: "Show All"} : "Focus"
: agenticResults
? "Focus"
: "Show All"}
<span className="ml-1"> <span className="ml-1">
{!sweep ? ( {!sweep ? (
<MagnifyingIcon className="h-4 w-4" /> <MagnifyingIcon className="h-4 w-4" />
) : ( ) : (
<UndoIcon className="h-4 w-4" /> <UndoIcon className="h-4 w-4" />
)} )}
</span> </span>
</div> </div>
</button> </button>
</Tooltip> </TooltipTrigger>
<TooltipContent>
<div className="flex">{commandSymbol}O</div>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)} )}
</div> </div>

54
web/src/components/tooltip/Tooltip.tsx
View File

@ -1,54 +0,0 @@
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
import { ReactNode } from "react";
interface TooltipProps {
children: ReactNode;
content: ReactNode;
side?: "top" | "right" | "bottom" | "left";
align?: "start" | "center" | "end";
}
export function Tooltip({
children,
content,
delayDuration = 200,
side = "top",
align = "center",
width,
}: {
children: ReactNode;
content: ReactNode;
delayDuration?: number;
side?: "top" | "right" | "bottom" | "left";
align?: "start" | "center" | "end";
width?: string;
}) {
return (
<TooltipPrimitive.Provider delayDuration={delayDuration}>
<TooltipPrimitive.Root>
<TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>
<TooltipPrimitive.Content
side={side}
align={align}
className={`
bg-background-inverted
text-inverted
text-sm
rounded
${width}
py-1
whitespace-normal
break-words
flex
px-2
z-10
shadow-lg
`}
>
{content}
<TooltipPrimitive.Arrow className="fill-black" />
</TooltipPrimitive.Content>
</TooltipPrimitive.Root>
</TooltipPrimitive.Provider>
);
}

31
web/src/components/ui/tooltip.tsx Normal file
View File

@ -0,0 +1,31 @@
"use client";
import * as React from "react";
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
import { cn } from "@/lib/utils";
const TooltipProvider = TooltipPrimitive.Provider;
const Tooltip = TooltipPrimitive.Root;
const TooltipTrigger = TooltipPrimitive.Trigger;
const TooltipContent = React.forwardRef<
React.ElementRef<typeof TooltipPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {
maxWidth?: string;
}
>(({ className, sideOffset = 4, maxWidth, ...props }, ref) => (
<TooltipPrimitive.Content
ref={ref}
sideOffset={sideOffset}
className={cn(
"z-50 overflow-hidden rounded-md border border-neutral-200 text-white bg-background-900 px-2 py-1.5 text-sm shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50 max-w-sm",
className
)}
{...props}
/>
));
TooltipContent.displayName = TooltipPrimitive.Content.displayName;
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };