diff --git a/package-lock.json b/package-lock.json index bf22ab98e1..d93ba3995b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,7 +19,6 @@ "@hookform/resolvers": "^3.9.1", "@monaco-editor/react": "^4.6.0", "@netlify/edge-functions": "^2.11.1", - "@sentry/react": "^8.47.0", "@types/lodash": "^4.17.13", "@types/pako": "^2.0.3", "@uiw/react-json-view": "^2.0.0-alpha.30", @@ -4383,98 +4382,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/@sentry-internal/browser-utils": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry-internal/browser-utils/-/browser-utils-8.55.0.tgz", - "integrity": "sha512-ROgqtQfpH/82AQIpESPqPQe0UyWywKJsmVIqi3c5Fh+zkds5LUxnssTj3yNd1x+kxaPDVB023jAP+3ibNgeNDw==", - "license": "MIT", - "dependencies": { - "@sentry/core": "8.55.0" - }, - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry-internal/feedback": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-8.55.0.tgz", - "integrity": "sha512-cP3BD/Q6pquVQ+YL+rwCnorKuTXiS9KXW8HNKu4nmmBAyf7urjs+F6Hr1k9MXP5yQ8W3yK7jRWd09Yu6DHWOiw==", - "license": "MIT", - "dependencies": { - "@sentry/core": "8.55.0" - }, - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry-internal/replay": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry-internal/replay/-/replay-8.55.0.tgz", - "integrity": "sha512-roCDEGkORwolxBn8xAKedybY+Jlefq3xYmgN2fr3BTnsXjSYOPC7D1/mYqINBat99nDtvgFvNfRcZPiwwZ1hSw==", - "license": "MIT", - "dependencies": { - "@sentry-internal/browser-utils": "8.55.0", - "@sentry/core": "8.55.0" - }, - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry-internal/replay-canvas": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-8.55.0.tgz", - "integrity": "sha512-nIkfgRWk1091zHdu4NbocQsxZF1rv1f7bbp3tTIlZYbrH62XVZosx5iHAuZG0Zc48AETLE7K4AX9VGjvQj8i9w==", - "license": "MIT", - "dependencies": { - "@sentry-internal/replay": "8.55.0", - "@sentry/core": "8.55.0" - }, - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry/browser": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-8.55.0.tgz", - "integrity": "sha512-1A31mCEWCjaMxJt6qGUK+aDnLDcK6AwLAZnqpSchNysGni1pSn1RWSmk9TBF8qyTds5FH8B31H480uxMPUJ7Cw==", - "license": "MIT", - "dependencies": { - "@sentry-internal/browser-utils": "8.55.0", - "@sentry-internal/feedback": "8.55.0", - "@sentry-internal/replay": "8.55.0", - "@sentry-internal/replay-canvas": "8.55.0", - "@sentry/core": "8.55.0" - }, - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry/core": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry/core/-/core-8.55.0.tgz", - "integrity": "sha512-6g7jpbefjHYs821Z+EBJ8r4Z7LT5h80YSWRJaylGS4nW5W5Z2KXzpdnyFarv37O7QjauzVC2E+PABmpkw5/JGA==", - "license": "MIT", - "engines": { - "node": ">=14.18" - } - }, - "node_modules/@sentry/react": { - "version": "8.55.0", - "resolved": "https://registry.npmjs.org/@sentry/react/-/react-8.55.0.tgz", - "integrity": "sha512-/qNBvFLpvSa/Rmia0jpKfJdy16d4YZaAnH/TuKLAtm0BWlsPQzbXCU4h8C5Hsst0Do0zG613MEtEmWpWrVOqWA==", - "license": "MIT", - "dependencies": { - "@sentry/browser": "8.55.0", - "@sentry/core": "8.55.0", - "hoist-non-react-statics": "^3.3.2" - }, - "engines": { - "node": ">=14.18" - }, - "peerDependencies": { - "react": "^16.14.0 || 17.x || 18.x || 19.x" - } - }, "node_modules/@sindresorhus/is": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-4.6.0.tgz", diff --git a/src/autokitteh b/src/autokitteh index aac9625ed0..3a306a78be 160000 --- a/src/autokitteh +++ b/src/autokitteh @@ -1 +1 @@ -Subproject commit aac9625ed03416a48ebdc0d1dacb21011b3ff2e4 +Subproject commit 3a306a78beeb6ae12507d96cde9b4cf3a01fe7e9 diff --git a/src/components/molecules/connectionTableStatus.tsx b/src/components/molecules/connectionTableStatus.tsx index 6db233fb41..d001d332eb 100644 --- a/src/components/molecules/connectionTableStatus.tsx +++ b/src/components/molecules/connectionTableStatus.tsx @@ -9,12 +9,16 @@ import { ConnectionStatusType } from "@type/models"; export const ConnectionTableStatus = ({ status }: { status: ConnectionStatusType }) => { const { t } = useTranslation("tabs"); const connectionTableStatusClass = { - [ConnectionStatus.error]: "text-red", - [ConnectionStatus.ok]: "text-green-800", - [ConnectionStatus.unspecified]: "text-blue-500", - [ConnectionStatus.warning]: "text-yellow-500", + [ConnectionStatus.error]: "text-red hover:bg-red/10", + [ConnectionStatus.ok]: "text-green-800 hover:bg-green-800/10", + [ConnectionStatus.unspecified]: "text-blue-500 hover:bg-blue-500/10", + [ConnectionStatus.warning]: "text-yellow-500 hover:bg-yellow-500/10", + [ConnectionStatus.init_required]: "text-orange-500 hover:bg-orange-500/10", }; - const baseClass = cn("inline", connectionTableStatusClass[ConnectionStatus[status]]); + const baseClass = cn( + "flex w-[6.8rem] items-center justify-center rounded-md border border-gray-800 px-2 py-0.5 text-xs text-white", + connectionTableStatusClass[ConnectionStatus[status]] + ); const statusName = t(`connections.table.statuses.${status}`); return ( diff --git a/src/components/molecules/copyButton.tsx b/src/components/molecules/copyButton.tsx index 9a256a6b96..89ae343d63 100644 --- a/src/components/molecules/copyButton.tsx +++ b/src/components/molecules/copyButton.tsx @@ -20,9 +20,11 @@ export const CopyButton = forwardRef< { ariaLabel?: string; buttonText?: string; + buttonTextClassName?: string; className?: string; dataTestId?: string; iconClassName?: string; + id?: string; size?: Extract; successMessage?: string; tabIndex?: number; @@ -42,6 +44,8 @@ export const CopyButton = forwardRef< text, title, buttonText, + buttonTextClassName, + id, }, ref ) => { @@ -87,11 +91,13 @@ export const CopyButton = forwardRef< const ariaLabelText = ariaLabel || t("copyButtonText", { text: ariaLabel }) || ""; const titleText = t("copyButtonTextTitle", { text: title }) || ariaLabelText; + const buttonTextClass = cn("text-white", buttonTextClassName); return ( ); } diff --git a/src/components/organisms/configuration/connections/connections.tsx b/src/components/organisms/configuration/connections/connections.tsx index f4ec24ce96..e18c3f8da4 100644 --- a/src/components/organisms/configuration/connections/connections.tsx +++ b/src/components/organisms/configuration/connections/connections.tsx @@ -169,7 +169,8 @@ export const Connections = ({ isLoading }: ConnectionsProps) => { const items: ConnectionItem[] = (connections || []).map((connection) => ({ id: connection.connectionId, name: connection.name || connection.integrationId || "", - errorMessage: connection.status === "ok" ? undefined : connection.statusInfoMessage, + statusInfoMessage: connection.statusInfoMessage, + status: connection.status, icon: connection.logo, integration: connection.integrationUniqueName as (typeof Integrations)[keyof typeof Integrations], })); diff --git a/src/components/organisms/configuration/connectionsSectionList.tsx b/src/components/organisms/configuration/connectionsSectionList.tsx index ba24bfb60c..1af6fa205b 100644 --- a/src/components/organisms/configuration/connectionsSectionList.tsx +++ b/src/components/organisms/configuration/connectionsSectionList.tsx @@ -6,7 +6,7 @@ import { ConnectionsSectionListProps } from "@interfaces/components"; import { cn, generateItemIds } from "@src/utilities"; import { Button, IconSvg } from "@components/atoms"; -import { Accordion, AddButton } from "@components/molecules"; +import { Accordion, AddButton, ConnectionTableStatus } from "@components/molecules"; import { PopoverContent, PopoverTrigger, PopoverWrapper } from "@components/molecules/popover"; import { ChevronDownIcon, ChevronUpIcon, TrashIcon } from "@assets/image/icons"; @@ -53,8 +53,8 @@ export const ConnectionsSectionList = ({ {isLoading ? ( ) : items && items.length > 0 ? ( - items.map(({ id, icon, name, errorMessage, integration }) => { - const hasError = !!errorMessage; + items.map(({ id, icon, name, statusInfoMessage, status, integration }) => { + const shouldShowTooltip = status !== "ok" && statusInfoMessage; const configureButtonClass = cn( "group my-0.5 mr-1 size-5 border-none p-0 hover:bg-transparent" ); @@ -90,30 +90,25 @@ export const ConnectionsSectionList = ({ className="ml-2.5 flex w-2/5 text-white sm:w-1/4 xl:w-1/2 2xl:w-[65%]" id={connectionDisplayId} > - +
- {hasError ? ( + {shouldShowTooltip ? (
- +
- Initialize connection + {statusInfoMessage}
- ) : null} + ) : ( + + )}
{actions.showEvents ? ( @@ -121,7 +116,7 @@ export const ConnectionsSectionList = ({