From dea7a8f697794cf56430fc40f5dcb61e526fd600 Mon Sep 17 00:00:00 2001 From: pablodanswer Date: Tue, 5 Nov 2024 08:48:19 -0800 Subject: [PATCH] Clean up tooltips (#3047) * clean up tooltips * nit: fix delay duration --- web/package-lock.json | 463 ++---------------- web/package.json | 2 +- .../app/admin/assistants/AssistantEditor.tsx | 28 +- .../[ccPairId]/IndexingAttemptsTable.tsx | 30 +- web/src/app/admin/documents/sets/page.tsx | 69 +-- .../status/CCPairIndexingStatusTable.tsx | 42 +- web/src/app/chat/files/InputBarPreview.tsx | 30 +- .../chat/files/documents/DocumentPreview.tsx | 61 ++- web/src/app/chat/input/ChatInputAssistant.tsx | 52 +- web/src/app/chat/input/ChatInputBar.tsx | 44 +- web/src/app/chat/message/Messages.tsx | 34 +- web/src/app/chat/message/SearchSummary.tsx | 32 +- .../admin/connectors/AdminSidebar.tsx | 6 +- web/src/components/admin/connectors/Field.tsx | 8 +- .../components/assistants/AssistantIcon.tsx | 1 - web/src/components/header/LogoType.tsx | 104 ++-- .../search/SearchResultsDisplay.tsx | 102 ++-- web/src/components/tooltip/Tooltip.tsx | 54 -- web/src/components/ui/tooltip.tsx | 31 ++ 19 files changed, 438 insertions(+), 755 deletions(-) delete mode 100644 web/src/components/tooltip/Tooltip.tsx create mode 100644 web/src/components/ui/tooltip.tsx diff --git a/web/package-lock.json b/web/package-lock.json index 2b02ef81659..e8c0cd86f15 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -21,7 +21,7 @@ "@radix-ui/react-separator": "^1.1.0", "@radix-ui/react-slot": "^1.1.0", "@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", "@stripe/stripe-js": "^4.6.0", "@types/js-cookie": "^3.0.3", @@ -3372,332 +3372,29 @@ } }, "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", - "resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.1.3.tgz", - "integrity": "sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==", - "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==", + "resolved": "https://registry.npmjs.org/@radix-ui/react-tooltip/-/react-tooltip-1.1.3.tgz", + "integrity": "sha512-Z4w1FIS0BqVFI2c1jZvb/uDVJijJjJ2ZMuPV81oVgTZ7g3BZxobplnMVvXtFWgtozdvYJ+MFWtwkM5S2HnAong==", + "license": "MIT", "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/react-compose-refs": "1.0.1", - "@radix-ui/react-use-layout-effect": "1.0.1" + "@radix-ui/primitive": "1.1.0", + "@radix-ui/react-compose-refs": "1.1.0", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-dismissable-layer": "1.1.1", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-popper": "1.2.0", + "@radix-ui/react-portal": "1.1.2", + "@radix-ui/react-presence": "1.1.1", + "@radix-ui/react-primitive": "2.0.0", + "@radix-ui/react-slot": "1.1.0", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-visually-hidden": "1.1.0" }, "peerDependencies": { "@types/react": "*", "@types/react-dom": "*", - "react": "^16.8 || ^17.0 || ^18.0", - "react-dom": "^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 || ^19.0 || ^19.0.0-rc" }, "peerDependenciesMeta": { "@types/react": { @@ -3708,131 +3405,27 @@ } } }, - "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/primitive": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.0.tgz", + "integrity": "sha512-4Z8dn6Upk0qk4P74xBhZ6Hd/w0mPEzOOLxy4xiPXOXqjF7jZS0VAKk7/x/H6FyY2zCkYJqePf1G5KmkmNJ4RBA==", + "license": "MIT" }, - "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==", + "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", - "dependencies": { - "@babel/runtime": "^7.13.10", - "@radix-ui/react-compose-refs": "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": { - "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": { - "@types/react": "*", - "@types/react-dom": "*", - "react": "^16.8 || ^17.0 || ^18.0", - "react-dom": "^16.8 || ^17.0 || ^18.0" + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" }, "peerDependenciesMeta": { "@types/react": { "optional": true - }, - "@types/react-dom": { - "optional": true } } }, - "node_modules/@radix-ui/react-tooltip/node_modules/@radix-ui/rect": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.0.1.tgz", - "integrity": "sha512-fyrgCaedtvMg9NK3en0pnOYJdtfwxUcNolezkNPUsoX57X8oQk+NkqcvzHXD2uKNij6GXmWU9NDru2IWjrO4BQ==", - "dependencies": { - "@babel/runtime": "^7.13.10" - } - }, "node_modules/@radix-ui/react-use-callback-ref": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.0.tgz", diff --git a/web/package.json b/web/package.json index 6fb1a3b2903..6f8aed2e738 100644 --- a/web/package.json +++ b/web/package.json @@ -22,7 +22,7 @@ "@radix-ui/react-separator": "^1.1.0", "@radix-ui/react-slot": "^1.1.0", "@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", "@stripe/stripe-js": "^4.6.0", "@types/js-cookie": "^3.0.3", diff --git a/web/src/app/admin/assistants/AssistantEditor.tsx b/web/src/app/admin/assistants/AssistantEditor.tsx index 51c2cb4c3ed..b01b6f32588 100644 --- a/web/src/app/admin/assistants/AssistantEditor.tsx +++ b/web/src/app/admin/assistants/AssistantEditor.tsx @@ -36,7 +36,7 @@ import { TooltipContent, TooltipProvider, TooltipTrigger, -} from "@radix-ui/react-tooltip"; +} from "@/components/ui/tooltip"; import Link from "next/link"; import { useRouter } from "next/navigation"; import { useEffect, useState } from "react"; @@ -565,15 +565,13 @@ export function AssistantEditor({ align="start" side="bottom" /> - + -

- This icon will visually represent your Assistant -

+ This icon will visually represent your Assistant @@ -609,16 +607,14 @@ export function AssistantEditor({
Default AI Model{" "}
- + -

- Select a Large Language Model (Generative AI model) to - power this Assistant -

+ Select a Large Language Model (Generative AI model) to + power this Assistant @@ -706,16 +702,14 @@ export function AssistantEditor({
Capabilities{" "}
- + -

- You can give your assistant advanced capabilities like - image generation -

+ You can give your assistant advanced capabilities like + image generation @@ -726,7 +720,7 @@ export function AssistantEditor({
{imageGenerationTool && ( - +
+
New Doc Cnt
- - - Total Doc Cnt - - - + + + + + Total Doc Cnt + + + + + Total number of documents replaced in the index during + this indexing attempt + + +
Error Message diff --git a/web/src/app/admin/documents/sets/page.tsx b/web/src/app/admin/documents/sets/page.tsx index 2d5296d33f2..5d443cd01ce 100644 --- a/web/src/app/admin/documents/sets/page.tsx +++ b/web/src/app/admin/documents/sets/page.tsx @@ -35,6 +35,12 @@ import Link from "next/link"; import { useRouter } from "next/navigation"; import { TableHeader } from "@/components/ui/table"; import { Badge } from "@/components/ui/badge"; +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from "@/components/ui/tooltip"; const numToDisplay = 50; @@ -47,8 +53,6 @@ const EditRow = ({ }) => { const router = useRouter(); - const [isSyncingTooltipOpen, setIsSyncingTooltipOpen] = useState(false); - if (!isEditable) { return (
@@ -59,37 +63,36 @@ const EditRow = ({ return (
- {isSyncingTooltipOpen && ( -
- Cannot update - while syncing! Wait for the sync to finish, then try again. -
- )} -
{ - if (documentSet.is_up_to_date) { - router.push(`/admin/documents/sets/${documentSet.id}`); - } - }} - onMouseEnter={() => { - if (!documentSet.is_up_to_date) { - setIsSyncingTooltipOpen(true); - } - }} - onMouseLeave={() => { - if (!documentSet.is_up_to_date) { - setIsSyncingTooltipOpen(false); - } - }} - > - - {documentSet.name} -
+ + + +
{ + if (documentSet.is_up_to_date) { + router.push(`/admin/documents/sets/${documentSet.id}`); + } + }} + > + + {documentSet.name} +
+ + {!documentSet.is_up_to_date && ( + +
+ + Cannot update while syncing! Wait for the sync to finish, then + try again. +
+ + )} + +
); }; diff --git a/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx b/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx index 833f1de674e..3b04e4a65d7 100644 --- a/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx +++ b/web/src/app/admin/indexing/status/CCPairIndexingStatusTable.tsx @@ -27,7 +27,12 @@ import { FiRefreshCw, FiPauseCircle, } 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 { getSourceDisplayName } from "@/lib/sources"; import { CustomTooltip } from "@/components/tooltip/CustomTooltip"; @@ -77,21 +82,26 @@ function SummaryRow({
Active Connectors
- -
-
-
-
- - {summary.active} ({activePercentage.toFixed(0)}%) - -
- + + + +
+
+
+
+ + {summary.active} ({activePercentage.toFixed(0)}%) + +
+ + + {summary.active} out of {summary.count} connectors are active + + + {isPaidEnterpriseFeaturesEnabled && ( diff --git a/web/src/app/chat/files/InputBarPreview.tsx b/web/src/app/chat/files/InputBarPreview.tsx index d218db04f51..6cd9478ec07 100644 --- a/web/src/app/chat/files/InputBarPreview.tsx +++ b/web/src/app/chat/files/InputBarPreview.tsx @@ -3,7 +3,12 @@ import { FileDescriptor } from "../interfaces"; import { FiX, FiLoader, FiFileText } from "react-icons/fi"; 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 }) { return ( @@ -138,14 +143,21 @@ export function InputBarPreview({
- -
- {file.name} -
- + + + +
+ {file.name} +
+ + + {file.name} + + +
- -
- {fileName} -
- + + + +
+ {fileName} +
+ + + {fileName} + + +
Document
{open && ( @@ -128,16 +140,23 @@ export function InputDocumentPreview({
- -
- {fileName} -
- + + + +
+ {fileName} +
+ + + {fileName} + + +
); diff --git a/web/src/app/chat/input/ChatInputAssistant.tsx b/web/src/app/chat/input/ChatInputAssistant.tsx index d2d062eb2f1..26c0894f5bb 100644 --- a/web/src/app/chat/input/ChatInputAssistant.tsx +++ b/web/src/app/chat/input/ChatInputAssistant.tsx @@ -2,7 +2,12 @@ import { Persona } from "@/app/admin/assistants/interfaces"; 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 { FiX } from "react-icons/fi"; @@ -23,27 +28,30 @@ export const ChatInputAssistant = forwardRef< onMouseLeave={() => setIsHovered(false)} className="flex-none h-10 duration-300 h-10 items-center rounded-lg bg-background-150" > - {alternativeAssistant.description}

- } - > -
- -

- {alternativeAssistant.name} -

-
- -
-
- + + + +
+ +

+ {alternativeAssistant.name} +

+
+ +
+
+ + +

{alternativeAssistant.description}

+ + + ); }); diff --git a/web/src/app/chat/input/ChatInputBar.tsx b/web/src/app/chat/input/ChatInputBar.tsx index 78afa5381d6..9dd3d5274c4 100644 --- a/web/src/app/chat/input/ChatInputBar.tsx +++ b/web/src/app/chat/input/ChatInputBar.tsx @@ -29,7 +29,12 @@ import { LlmTab } from "../modal/configuration/LlmTab"; import { AssistantsTab } from "../modal/configuration/AssistantsTab"; import { DanswerDocument } from "@/lib/search/interfaces"; 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 { SettingsContext } from "@/components/settings/SettingsProvider"; import { ChatState } from "../types"; @@ -399,17 +404,20 @@ export function ChatInputBar({ {alternativeAssistant.name}

- - {alternativeAssistant.description} -

- } - > - - + + + + + + +

+ {alternativeAssistant.description} +

+ + + @@ -635,7 +647,11 @@ export function ChatInputBar({ > )} diff --git a/web/src/app/chat/message/Messages.tsx b/web/src/app/chat/message/Messages.tsx index 2939c74d3f4..c420a3f53e9 100644 --- a/web/src/app/chat/message/Messages.tsx +++ b/web/src/app/chat/message/Messages.tsx @@ -45,7 +45,12 @@ import { TooltipGroup, } from "@/components/tooltip/CustomTooltip"; 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 { InternetSearchIcon } from "@/components/InternetSearchIcon"; import { SettingsContext } from "@/components/settings/SettingsProvider"; @@ -895,17 +900,22 @@ export const HumanMessage = ({ isHovered && !isEditing && (!files || files.length === 0) ? ( - - - + + + + + + Edit + + ) : (
)} diff --git a/web/src/app/chat/message/SearchSummary.tsx b/web/src/app/chat/message/SearchSummary.tsx index 6b7ea248e82..f86212fd290 100644 --- a/web/src/app/chat/message/SearchSummary.tsx +++ b/web/src/app/chat/message/SearchSummary.tsx @@ -4,7 +4,12 @@ import { } from "@/components/BasicClickable"; import { HoverPopup } from "@/components/HoverPopup"; 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 { FiCheck, FiEdit2, FiSearch, FiX } from "react-icons/fi"; @@ -169,16 +174,21 @@ export function SearchSummary({ )}
{handleSearchQueryEdit && ( - - - + + + + + + Edit Search + + )} )} diff --git a/web/src/components/admin/connectors/AdminSidebar.tsx b/web/src/components/admin/connectors/AdminSidebar.tsx index e07ca690fbc..b4010d36496 100644 --- a/web/src/components/admin/connectors/AdminSidebar.tsx +++ b/web/src/components/admin/connectors/AdminSidebar.tsx @@ -13,7 +13,7 @@ import { TooltipContent, TooltipProvider, TooltipTrigger, -} from "@radix-ui/react-tooltip"; +} from "@/components/ui/tooltip"; interface Item { name: string | JSX.Element; @@ -105,9 +105,7 @@ export function AdminSidebar({ collections }: { collections: Collection[] }) { -

- Navigate here to update your search settings -

+ Navigate here to update your search settings diff --git a/web/src/components/admin/connectors/Field.tsx b/web/src/components/admin/connectors/Field.tsx index 271a7447f3d..106478869e3 100644 --- a/web/src/components/admin/connectors/Field.tsx +++ b/web/src/components/admin/connectors/Field.tsx @@ -22,7 +22,7 @@ import { Tooltip, TooltipContent, TooltipTrigger, -} from "@radix-ui/react-tooltip"; +} from "@/components/ui/tooltip"; import ReactMarkdown from "react-markdown"; import { FaMarkdown } from "react-icons/fa"; import { useRef, useState } from "react"; @@ -107,15 +107,13 @@ export function ToolTipDetails({ children: string | JSX.Element; }) { return ( - + -

- {children} -

+ {children} diff --git a/web/src/components/assistants/AssistantIcon.tsx b/web/src/components/assistants/AssistantIcon.tsx index 4126fdfca2f..9586528d0c8 100644 --- a/web/src/components/assistants/AssistantIcon.tsx +++ b/web/src/components/assistants/AssistantIcon.tsx @@ -1,6 +1,5 @@ import { Persona } from "@/app/admin/assistants/interfaces"; import React from "react"; -import { Tooltip } from "../tooltip/Tooltip"; import { createSVG } from "@/lib/assistantIconUtils"; import { buildImgUrl } from "@/app/chat/files/images/utils"; import { CustomTooltip } from "../tooltip/CustomTooltip"; diff --git a/web/src/components/header/LogoType.tsx b/web/src/components/header/LogoType.tsx index 32981bbe26c..365c734ade9 100644 --- a/web/src/components/header/LogoType.tsx +++ b/web/src/components/header/LogoType.tsx @@ -7,7 +7,12 @@ import { NEXT_PUBLIC_NEW_CHAT_DIRECTS_TO_SAME_PERSONA, } from "@/lib/constants"; 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 { Logo } from "../Logo"; import { HeaderTitle } from "./HeaderTitle"; @@ -39,7 +44,7 @@ export default function LogoType({
{toggleSidebar && page == "chat" ? ( - + + + + + + + {toggled ? `Unpin sidebar` : "Pin sidebar"} + + + )}
); diff --git a/web/src/components/search/SearchResultsDisplay.tsx b/web/src/components/search/SearchResultsDisplay.tsx index 7f1036050ec..e0ef9edff60 100644 --- a/web/src/components/search/SearchResultsDisplay.tsx +++ b/web/src/components/search/SearchResultsDisplay.tsx @@ -7,13 +7,17 @@ import { SearchResponse, } from "@/lib/search/interfaces"; 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 { searchState } from "./SearchSection"; -import { useContext, useEffect, useState } from "react"; -import { Tooltip } from "../tooltip/Tooltip"; +import { useEffect, useState } from "react"; +import { + Tooltip, + TooltipProvider, + TooltipContent, + TooltipTrigger, +} from "@/components/ui/tooltip"; import KeyboardSymbol from "@/lib/browserUtilities"; -import { SettingsContext } from "../settings/SettingsProvider"; import { DISABLE_LLM_DOC_RELEVANCE } from "@/lib/constants"; const getSelectedDocumentIds = ( @@ -169,48 +173,56 @@ export const SearchResultsDisplay = ({

Results

{!DISABLE_LLM_DOC_RELEVANCE && (contentEnriched || searchResponse.additional_relevance) && ( - {commandSymbol}O
} - > - - + + {!sweep ? ( + + ) : ( + + )} + + + + + +
{commandSymbol}O
+ + + )} diff --git a/web/src/components/tooltip/Tooltip.tsx b/web/src/components/tooltip/Tooltip.tsx deleted file mode 100644 index d72c13dd16c..00000000000 --- a/web/src/components/tooltip/Tooltip.tsx +++ /dev/null @@ -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 ( - - - {children} - - {content} - - - - - ); -} diff --git a/web/src/components/ui/tooltip.tsx b/web/src/components/ui/tooltip.tsx new file mode 100644 index 00000000000..f52eaa7d997 --- /dev/null +++ b/web/src/components/ui/tooltip.tsx @@ -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, + React.ComponentPropsWithoutRef & { + maxWidth?: string; + } +>(({ className, sideOffset = 4, maxWidth, ...props }, ref) => ( + +)); +TooltipContent.displayName = TooltipPrimitive.Content.displayName; + +export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };