diff --git a/site/.storybook/preview.tsx b/site/.storybook/preview.tsx index 21b63e59bea45..13a875442db70 100644 --- a/site/.storybook/preview.tsx +++ b/site/.storybook/preview.tsx @@ -11,6 +11,7 @@ import isChromatic from "chromatic/isChromatic"; import { StrictMode } from "react"; import { QueryClient, QueryClientProvider } from "react-query"; import { withRouter } from "storybook-addon-remix-react-router"; +import { TooltipProvider } from "../src/components/Tooltip/Tooltip"; import "theme/globalFonts"; import type { Decorator, Loader, Parameters } from "@storybook/react-vite"; import themes from "../src/theme"; @@ -100,8 +101,10 @@ const withTheme: Decorator = (Story, context) => { - - + + + + diff --git a/site/src/App.tsx b/site/src/App.tsx index 57497b586f56d..a4fad65a3d265 100644 --- a/site/src/App.tsx +++ b/site/src/App.tsx @@ -1,5 +1,6 @@ import "./theme/globalFonts"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; +import { TooltipProvider } from "components/Tooltip/Tooltip"; import { type FC, type ReactNode, @@ -53,8 +54,10 @@ export const AppProviders: FC = ({ - {children} - + + {children} + + {showDevtools && } diff --git a/site/src/components/CodeExample/CodeExample.tsx b/site/src/components/CodeExample/CodeExample.tsx index b69a220550958..42759889fd1eb 100644 --- a/site/src/components/CodeExample/CodeExample.tsx +++ b/site/src/components/CodeExample/CodeExample.tsx @@ -3,7 +3,6 @@ import { Button } from "components/Button/Button"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { EyeIcon, EyeOffIcon } from "lucide-react"; @@ -77,21 +76,19 @@ export const CodeExample: FC = ({
{showRevealButton && redactPattern && !secret && ( - - - - - - {showButtonLabel} - - + + + + + {showButtonLabel} + )}
diff --git a/site/src/components/Combobox/Combobox.tsx b/site/src/components/Combobox/Combobox.tsx index 2d522d6e6397c..7793107544eed 100644 --- a/site/src/components/Combobox/Combobox.tsx +++ b/site/src/components/Combobox/Combobox.tsx @@ -15,7 +15,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { Check, ChevronDown, CornerDownLeft, Info } from "lucide-react"; @@ -138,21 +137,19 @@ export const Combobox: FC = ({ )} {option.description && ( - - - - e.stopPropagation()} - > - - - - - {option.description} - - - + + + e.stopPropagation()} + > + + + + + {option.description} + + )} diff --git a/site/src/components/CopyButton/CopyButton.tsx b/site/src/components/CopyButton/CopyButton.tsx index ab1b8d0dc6561..52f8cfa9e10de 100644 --- a/site/src/components/CopyButton/CopyButton.tsx +++ b/site/src/components/CopyButton/CopyButton.tsx @@ -2,7 +2,6 @@ import { Button, type ButtonProps } from "components/Button/Button"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useClipboard } from "hooks/useClipboard"; @@ -22,21 +21,19 @@ export const CopyButton: FC = ({ const { showCopiedSuccess, copyToClipboard } = useClipboard(); return ( - - - - - - {label} - - + + + + + {label} + ); }; diff --git a/site/src/components/CopyableValue/CopyableValue.tsx b/site/src/components/CopyableValue/CopyableValue.tsx index 89d98e43e0474..7c0373b8ddbae 100644 --- a/site/src/components/CopyableValue/CopyableValue.tsx +++ b/site/src/components/CopyableValue/CopyableValue.tsx @@ -1,7 +1,6 @@ import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useClickable } from "hooks/useClickable"; @@ -37,55 +36,53 @@ export const CopyableValue: FC = ({ }); return ( - - { - // Always keep the tooltip open when in focus to handle issues when onOpenChange is unexpectedly false - if (!shouldBeOpen && isFocused) return; - setTooltipOpen(shouldBeOpen); - }} - > - - { - clickableProps.onClick(event); - onClick?.(event); - }} - onKeyDown={(event) => { - clickableProps.onKeyDown(event); - onKeyDown?.(event); - }} - onKeyUp={(event) => { - clickableProps.onKeyUp(event); - onKeyUp?.(event); - }} - onMouseEnter={() => { - setIsFocused(true); - setTooltipOpen(true); - }} - onMouseLeave={() => { - setTooltipOpen(false); - }} - onFocus={() => { - setIsFocused(true); - }} - onBlur={() => { - setTooltipOpen(false); - }} - > - {children} - - - - {showCopiedSuccess ? "Copied!" : "Click to copy"} - - - + { + // Always keep the tooltip open when in focus to handle issues when onOpenChange is unexpectedly false + if (!shouldBeOpen && isFocused) return; + setTooltipOpen(shouldBeOpen); + }} + > + + { + clickableProps.onClick(event); + onClick?.(event); + }} + onKeyDown={(event) => { + clickableProps.onKeyDown(event); + onKeyDown?.(event); + }} + onKeyUp={(event) => { + clickableProps.onKeyUp(event); + onKeyUp?.(event); + }} + onMouseEnter={() => { + setIsFocused(true); + setTooltipOpen(true); + }} + onMouseLeave={() => { + setTooltipOpen(false); + }} + onFocus={() => { + setIsFocused(true); + }} + onBlur={() => { + setTooltipOpen(false); + }} + > + {children} + + + + {showCopiedSuccess ? "Copied!" : "Click to copy"} + + ); }; diff --git a/site/src/components/FeatureStageBadge/FeatureStageBadge.tsx b/site/src/components/FeatureStageBadge/FeatureStageBadge.tsx index 78ad6c0311c06..a6f43436b2d78 100644 --- a/site/src/components/FeatureStageBadge/FeatureStageBadge.tsx +++ b/site/src/components/FeatureStageBadge/FeatureStageBadge.tsx @@ -2,7 +2,6 @@ import { Link } from "components/Link/Link"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC, HTMLAttributes, ReactNode } from "react"; @@ -47,40 +46,38 @@ export const FeatureStageBadge: FC = ({ const sizeClasses = badgeSizeClasses[size]; return ( - - - - - (This is a - - {labelText && `${labelText} `} - {featureStageBadgeTypes[contentType]} - - feature) + + + + (This is a + + {labelText && `${labelText} `} + {featureStageBadgeTypes[contentType]} - - -

- This feature has not yet reached general availability (GA). -

+ feature) +
+
+ +

+ This feature has not yet reached general availability (GA). +

- - Learn about feature stages - (link opens in new tab) - -
-
-
+ + Learn about feature stages + (link opens in new tab) + + + ); }; diff --git a/site/src/components/HelpTooltip/HelpTooltip.tsx b/site/src/components/HelpTooltip/HelpTooltip.tsx index fbdc93e53dea8..7b73aec7067e4 100644 --- a/site/src/components/HelpTooltip/HelpTooltip.tsx +++ b/site/src/components/HelpTooltip/HelpTooltip.tsx @@ -11,7 +11,6 @@ import { TooltipContent, type TooltipContentProps, type TooltipProps, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { CircleHelpIcon, ExternalLinkIcon } from "lucide-react"; @@ -33,11 +32,7 @@ export const HelpTooltipTrigger = TooltipTrigger; export const HelpTooltipIcon = CircleHelpIcon; export const HelpTooltip: FC = (props) => { - return ( - - - - ); + return ; }; export const HelpTooltipContent: FC = ({ diff --git a/site/src/components/MultiSelectCombobox/MultiSelectCombobox.tsx b/site/src/components/MultiSelectCombobox/MultiSelectCombobox.tsx index ca9332e350641..1976cb790d951 100644 --- a/site/src/components/MultiSelectCombobox/MultiSelectCombobox.tsx +++ b/site/src/components/MultiSelectCombobox/MultiSelectCombobox.tsx @@ -14,7 +14,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useDebouncedValue } from "hooks/debounce"; @@ -684,21 +683,19 @@ export const MultiSelectCombobox = forwardRef< )} {option.label} {option.description && ( - - - - - - - - - {option.description} - - - + + + + + + + + {option.description} + + )} diff --git a/site/src/components/StatusPill/StatusPill.tsx b/site/src/components/StatusPill/StatusPill.tsx index d0199317dc2e7..7724dbb3740c0 100644 --- a/site/src/components/StatusPill/StatusPill.tsx +++ b/site/src/components/StatusPill/StatusPill.tsx @@ -2,7 +2,6 @@ import { Pill } from "components/Pill/Pill"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC } from "react"; @@ -33,11 +32,9 @@ export const StatusPill: FC = ({ return pill; } return ( - - - {pill} - {label} - - + + {pill} + {label} + ); }; diff --git a/site/src/modules/dashboard/Navbar/NavbarView.tsx b/site/src/modules/dashboard/Navbar/NavbarView.tsx index 533357c79bca0..26c77dfb8f6b0 100644 --- a/site/src/modules/dashboard/Navbar/NavbarView.tsx +++ b/site/src/modules/dashboard/Navbar/NavbarView.tsx @@ -7,7 +7,6 @@ import { CoderIcon } from "components/Icons/CoderIcon"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { ProxyContextValue } from "contexts/ProxyContext"; @@ -230,21 +229,19 @@ const TasksNavItem: FC = ({ user }) => { > Tasks {idleCount > 0 && ( - - - - - {idleCount} - - - {idleTasksLabel(idleCount)} - - + + + + {idleCount} + + + {idleTasksLabel(idleCount)} + )} ); diff --git a/site/src/modules/resources/AgentDevcontainerCard.tsx b/site/src/modules/resources/AgentDevcontainerCard.tsx index 25579c3c7803a..b17cbafec1a9c 100644 --- a/site/src/modules/resources/AgentDevcontainerCard.tsx +++ b/site/src/modules/resources/AgentDevcontainerCard.tsx @@ -14,7 +14,6 @@ import { Stack } from "components/Stack/Stack"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useProxy } from "contexts/ProxyContext"; @@ -346,19 +345,17 @@ export const AgentDevcontainerCard: FC = ({ ) : ""; return ( - - - - - - - {portLabel} - - - - {helperText} - - + + + + + + {portLabel} + + + + {helperText} + ); })} diff --git a/site/src/modules/resources/AgentLogs/AgentLogs.tsx b/site/src/modules/resources/AgentLogs/AgentLogs.tsx index 6c9ee75d690e5..e71576913219f 100644 --- a/site/src/modules/resources/AgentLogs/AgentLogs.tsx +++ b/site/src/modules/resources/AgentLogs/AgentLogs.tsx @@ -5,7 +5,6 @@ import type { Line } from "components/Logs/LogLine"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { type ComponentProps, forwardRef, type JSX } from "react"; @@ -148,33 +147,31 @@ export const AgentLogs = forwardRef( {overflowed && ( - - - - - Logs overflowed - - - + + -

- Startup logs exceeded the max size of{" "} - 1MB, and will - not continue to be written to the database. Logs will continue - to be written to the{" "} - - /tmp/coder-startup-script.log - {" "} - file in the workspace. -

-
-
-
+ Logs overflowed + + + +

+ Startup logs exceeded the max size of{" "} + 1MB, and will + not continue to be written to the database. Logs will continue + to be written to the{" "} + + /tmp/coder-startup-script.log + {" "} + file in the workspace. +

+
+
)} ); diff --git a/site/src/modules/resources/AppLink/AppLink.tsx b/site/src/modules/resources/AppLink/AppLink.tsx index 620ab384a7033..419148ed0914a 100644 --- a/site/src/modules/resources/AppLink/AppLink.tsx +++ b/site/src/modules/resources/AppLink/AppLink.tsx @@ -6,7 +6,6 @@ import { Spinner } from "components/Spinner/Spinner"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useProxy } from "contexts/ProxyContext"; @@ -137,20 +136,18 @@ export const AppLink: FC = ({ if (primaryTooltip || app.tooltip) { return ( - - - {button} - - {primaryTooltip ? ( - primaryTooltip - ) : app.tooltip ? ( - - {app.tooltip} - - ) : null} - - - + + {button} + + {primaryTooltip ? ( + primaryTooltip + ) : app.tooltip ? ( + + {app.tooltip} + + ) : null} + + ); } diff --git a/site/src/modules/resources/PortForwardButton.tsx b/site/src/modules/resources/PortForwardButton.tsx index 78d4e999b340c..b92218993d7e6 100644 --- a/site/src/modules/resources/PortForwardButton.tsx +++ b/site/src/modules/resources/PortForwardButton.tsx @@ -36,7 +36,6 @@ import { Spinner } from "components/Spinner/Spinner"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useFormik } from "formik"; @@ -218,40 +217,36 @@ export const PortForwardPopoverView: FC = ({ : "authenticated"; const disabledPublicMenuItem = ( - - - - {/* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */} -
- - Public - -
-
- - This workspace template does not allow sharing ports publicly. - -
-
+ + + {/* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */} +
+ + Public + +
+
+ + This workspace template does not allow sharing ports publicly. + +
); const disabledAuthenticatedMenuItem = ( - - - - {/* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */} -
- - Authenticated - -
-
- - This workspace template does not allow sharing ports outside of its - organization. - -
-
+ + + {/* Tooltips don't work directly on disabled MenuItem components so you must wrap in div. */} +
+ + Authenticated + +
+
+ + This workspace template does not allow sharing ports outside of its + organization. + +
); return ( @@ -338,19 +333,15 @@ export const PortForwardPopoverView: FC = ({ required css={styles.newPortInput} /> - - - - - - - Connect to port - - - + + + + + Connect to port + @@ -405,30 +396,28 @@ export const PortForwardPopoverView: FC = ({ alignItems="center" > {canSharePorts && ( - - - - - - - Share this port - - - + + + + + + Share this port + + )} diff --git a/site/src/modules/tasks/TaskPrompt/TaskPrompt.tsx b/site/src/modules/tasks/TaskPrompt/TaskPrompt.tsx index 77e338cd47038..57a567b40366b 100644 --- a/site/src/modules/tasks/TaskPrompt/TaskPrompt.tsx +++ b/site/src/modules/tasks/TaskPrompt/TaskPrompt.tsx @@ -24,7 +24,6 @@ import { Spinner } from "components/Spinner/Spinner"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useAuthenticated } from "hooks/useAuthenticated"; @@ -414,23 +413,21 @@ const ExternalAuthButtons: FC = ({ {shouldRetry && !auth.authenticated && ( - - - - - - - Retry connecting to {auth.display_name} - - - + + + + + + Retry connecting to {auth.display_name} + + )} ); diff --git a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx index 633a9fcbc1ad8..405e8c11ea2d9 100644 --- a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx +++ b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx @@ -2,7 +2,6 @@ import type { WorkspaceAppStatus as APIWorkspaceAppStatus } from "api/typesGener import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import capitalize from "lodash/capitalize"; @@ -28,23 +27,21 @@ export const WorkspaceAppStatus = ({ const message = status.message || capitalize(status.state); return (
- - - -
- - - {message} - -
-
- {message} -
-
+ + +
+ + + {message} + +
+
+ {message} +
{status.state} diff --git a/site/src/modules/workspaces/WorkspaceStatusIndicator/WorkspaceStatusIndicator.tsx b/site/src/modules/workspaces/WorkspaceStatusIndicator/WorkspaceStatusIndicator.tsx index c7e9e53ba8ff5..d8eb82659fe40 100644 --- a/site/src/modules/workspaces/WorkspaceStatusIndicator/WorkspaceStatusIndicator.tsx +++ b/site/src/modules/workspaces/WorkspaceStatusIndicator/WorkspaceStatusIndicator.tsx @@ -7,7 +7,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type React from "react"; @@ -60,19 +59,17 @@ export const WorkspaceStatusIndicator: FC = ({ } return ( - - - - - - Workspace status: {text} - {children} - - - - Your workspace is running but some agents are unhealthy. - - - + + + + + Workspace status: {text} + {children} + + + + Your workspace is running but some agents are unhealthy. + + ); }; diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx index 315c8f357db29..94ccf3b980187 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx @@ -14,7 +14,6 @@ import { Switch } from "components/Switch/Switch"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; @@ -386,26 +385,24 @@ export const CreateWorkspacePageViewExperimental: FC<

New workspace

- - - - - - - Dynamic Parameters enhances Coder's existing parameter system - with real-time validation, conditional parameter behavior, and - richer input types. -
- - View docs - -
-
-
+ + + + + + Dynamic Parameters enhances Coder's existing parameter system + with real-time validation, conditional parameter behavior, and + richer input types. +
+ + View docs + +
+
diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx index 65e2de6dce2be..e55fe1a60f13c 100644 --- a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx +++ b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx @@ -6,7 +6,6 @@ import { Spinner } from "components/Spinner/Spinner"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { Check, Redo } from "lucide-react"; @@ -77,19 +76,17 @@ export const ExternalAuthButton: FC = ({ )} {displayRetry && !auth.authenticated && ( - - - - - - - Retry login with {auth.display_name} - - - + + + + + + Retry login with {auth.display_name} + + )}
diff --git a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx index 950fd64f8359a..52f8f690de2e1 100644 --- a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx +++ b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx @@ -16,7 +16,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useFormik } from "formik"; @@ -67,31 +66,29 @@ export const AppearanceSettingsPageView: FC< - - - {isEntitled && !isPremium ? ( - - ) : ( - - - - - - )} + + {isEntitled && !isPremium ? ( + + ) : ( + + + + + + )} - - - - - + + + +
= ({
{idpOrg} {!exists && ( - - - - - - - This value has not be seen in the specified claim field - before. You might want to check your IdP configuration and - ensure that this value is not misspelled. - - - + + + + + + This value has not be seen in the specified claim field before. + You might want to check your IdP configuration and ensure that + this value is not misspelled. + + )}
diff --git a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/OrganizationPills.tsx b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/OrganizationPills.tsx index 3b73d0199a7c1..16c25c5bc8f39 100644 --- a/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/OrganizationPills.tsx +++ b/site/src/pages/DeploymentSettingsPage/IdpOrgSyncPage/OrganizationPills.tsx @@ -2,7 +2,6 @@ import { Pill } from "components/Pill/Pill"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC } from "react"; @@ -47,36 +46,34 @@ interface OverflowPillProps { const OverflowPillList: FC = ({ organizations }) => { return ( - - - - - +{organizations.length} - - + + + + +{organizations.length} + + - -
    - {organizations.map((organization) => ( -
  • - - {organization.name} - -
  • - ))} -
-
-
-
+ +
    + {organizations.map((organization) => ( +
  • + + {organization.name} + +
  • + ))} +
+
+ ); }; diff --git a/site/src/pages/DeploymentSettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx b/site/src/pages/DeploymentSettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx index 011db7f954912..728efbf33f2e5 100644 --- a/site/src/pages/DeploymentSettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx +++ b/site/src/pages/DeploymentSettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx @@ -15,7 +15,6 @@ import { Stack } from "components/Stack/Stack"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC } from "react"; @@ -53,31 +52,29 @@ export const ObservabilitySettingsPageView: FC< - - - {featureAuditLogEnabled && !isPremium ? ( - - ) : ( - - - - - - )} + + {featureAuditLogEnabled && !isPremium ? ( + + ) : ( + + + + + + )} - - - - - + + + + diff --git a/site/src/pages/OrganizationSettingsPage/CreateOrganizationPageView.tsx b/site/src/pages/OrganizationSettingsPage/CreateOrganizationPageView.tsx index 6b87ae2606fda..074019bb95689 100644 --- a/site/src/pages/OrganizationSettingsPage/CreateOrganizationPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/CreateOrganizationPageView.tsx @@ -12,7 +12,6 @@ import { Spinner } from "components/Spinner/Spinner"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useFormik } from "formik"; @@ -82,29 +81,27 @@ export const CreateOrganizationPageView: FC< )} - - - {isEntitled && ( - - - - - - )} + + {isEntitled && ( + + + + + + )} - - - - - + + + +
diff --git a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/PermissionPillsList.tsx b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/PermissionPillsList.tsx index fea0dff643966..9ff1a524a8d1e 100644 --- a/site/src/pages/OrganizationSettingsPage/CustomRolesPage/PermissionPillsList.tsx +++ b/site/src/pages/OrganizationSettingsPage/CustomRolesPage/PermissionPillsList.tsx @@ -5,7 +5,6 @@ import { Pill } from "components/Pill/Pill"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC } from "react"; @@ -77,34 +76,29 @@ const OverflowPermissionPill: FC = ({ const theme = useTheme(); return ( - - - - - +{resources.length} more - - + + + + +{resources.length} more + + - -
    - {resources.map((resource) => ( -
  • - -
  • - ))} -
-
-
-
+ +
    + {resources.map((resource) => ( +
  • + +
  • + ))} +
+
+ ); }; diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx index b3840e19a36ad..6f4cd9dc6630a 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpGroupSyncForm.tsx @@ -25,7 +25,6 @@ import { TableCell, TableRow } from "components/Table/Table"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useFormik } from "formik"; @@ -370,23 +369,21 @@ const GroupRow: FC = ({
{idpGroup} {!exists && ( - - - - - - - This value has not be seen in the specified claim field - before. You might want to check your IdP configuration and - ensure that this value is not misspelled. - - - + + + + + + This value has not be seen in the specified claim field before. + You might want to check your IdP configuration and ensure that + this value is not misspelled. + + )}
diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpPillList.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpPillList.tsx index 330cd6bfdc9ac..0269f8872ab7d 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpPillList.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpPillList.tsx @@ -4,7 +4,6 @@ import { Pill } from "components/Pill/Pill"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import type { FC } from "react"; @@ -36,25 +35,23 @@ interface OverflowPillProps { const OverflowPill: FC = ({ roles }) => { return ( - - - - +{roles.length} more - + + + +{roles.length} more + - -
    - {roles.map((role) => ( -
  • - - {role} - -
  • - ))} -
-
-
-
+ +
    + {roles.map((role) => ( +
  • + + {role} + +
  • + ))} +
+
+ ); }; diff --git a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx index 2efbf6f758393..e304b2d9e04f8 100644 --- a/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx +++ b/site/src/pages/OrganizationSettingsPage/IdpSyncPage/IdpRoleSyncForm.tsx @@ -12,7 +12,6 @@ import { TableCell, TableRow } from "components/Table/Table"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { useFormik } from "formik"; @@ -285,23 +284,21 @@ const RoleRow: FC = ({
{idpRole} {!exists && ( - - - - - - - This value has not be seen in the specified claim field - before. You might want to check your IdP configuration and - ensure that this value is not misspelled. - - - + + + + + + This value has not be seen in the specified claim field before. + You might want to check your IdP configuration and ensure that + this value is not misspelled. + + )}
diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionerJobsPage/CancelJobButton.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionerJobsPage/CancelJobButton.tsx index 4c024911ee23f..0e0067bcfe37e 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionerJobsPage/CancelJobButton.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionerJobsPage/CancelJobButton.tsx @@ -3,7 +3,6 @@ import { Button } from "components/Button/Button"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { BanIcon } from "lucide-react"; @@ -22,24 +21,22 @@ export const CancelJobButton: FC = ({ job }) => { return ( <> - - - - - - Cancel job - - + + + + + Cancel job +
- - - - - - Clear ID - - + + + + + Clear ID +
)} diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/LastConnectionHead.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/LastConnectionHead.tsx index 8ca1b66b72d97..081108976ee70 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/LastConnectionHead.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/LastConnectionHead.tsx @@ -1,7 +1,6 @@ import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { InfoIcon } from "lucide-react"; @@ -10,22 +9,20 @@ export const LastConnectionHead: FC = () => { return ( Last connection - - - - - More info - - - - - Last time the provisioner connected to the control plane - - - + + + + More info + + + + + Last time the provisioner connected to the control plane + + ); }; diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/OrganizationProvisionersPageView.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/OrganizationProvisionersPageView.tsx index 386d87d8c1324..0c12110b7ae40 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/OrganizationProvisionersPageView.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/OrganizationProvisionersPageView.tsx @@ -22,7 +22,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { XIcon } from "lucide-react"; @@ -75,23 +74,21 @@ export const OrganizationProvisionersPageView: FC< {filter.ids}
- - - - - - Clear ID - - + + + + + Clear ID +
diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerKey.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerKey.tsx index 0bccc8c0442fc..e736bcb42037d 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerKey.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerKey.tsx @@ -6,7 +6,6 @@ import { import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { InfoIcon } from "lucide-react"; @@ -63,22 +62,20 @@ export const ProvisionerKey: FC = ({ name }) => { {name} {info && ( - - - - - More info - - - - - {infoByType[type]} - - - + + + + More info + + + + + {infoByType[type]} + + )} ); diff --git a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerVersion.tsx b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerVersion.tsx index 44d0c1c19fd3e..be8cfc3913ead 100644 --- a/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerVersion.tsx +++ b/site/src/pages/OrganizationSettingsPage/OrganizationProvisionersPage/ProvisionerVersion.tsx @@ -2,7 +2,6 @@ import { StatusIndicator } from "components/StatusIndicator/StatusIndicator"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import { TriangleAlertIcon } from "lucide-react"; @@ -22,27 +21,25 @@ export const ProvisionerVersion: FC = ({ Up to date ) : ( - - - - - - Outdated - - - -

- This provisioner is out of date. You may experience issues when - using a provisioner version that doesn't match your Coder - deployment. Please upgrade to a newer version. -

-
-
-
+ + + + + Outdated + + + +

+ This provisioner is out of date. You may experience issues when using + a provisioner version that doesn't match your Coder deployment. Please + upgrade to a newer version. +

+
+
); }; diff --git a/site/src/pages/WorkspacePage/AppStatuses.tsx b/site/src/pages/WorkspacePage/AppStatuses.tsx index 2f1845db37031..48ae63813ea9f 100644 --- a/site/src/pages/WorkspacePage/AppStatuses.tsx +++ b/site/src/pages/WorkspacePage/AppStatuses.tsx @@ -10,7 +10,6 @@ import { ScrollArea } from "components/ScrollArea/ScrollArea"; import { Tooltip, TooltipContent, - TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; import capitalize from "lodash/capitalize"; @@ -99,19 +98,17 @@ export const AppStatuses: FC = ({ {latestStatus.uri && (latestStatus.uri.startsWith("file://") ? ( - - - - - - {truncateURI(latestStatus.uri)} - - - - This file is located in your workspace - - - + + + + + {truncateURI(latestStatus.uri)} + + + + This file is located in your workspace + + ) : ( )} - - - - - - - {displayStatuses ? "Hide statuses" : "Show statuses"} - - - + + + + + + {displayStatuses ? "Hide statuses" : "Show statuses"} + + diff --git a/site/src/testHelpers/renderHelpers.tsx b/site/src/testHelpers/renderHelpers.tsx index 8e20fef5d3e0d..660a8933c68cd 100644 --- a/site/src/testHelpers/renderHelpers.tsx +++ b/site/src/testHelpers/renderHelpers.tsx @@ -4,6 +4,7 @@ import { render as testingLibraryRender, waitFor, } from "@testing-library/react"; +import { TooltipProvider } from "components/Tooltip/Tooltip"; import { RequireAuth } from "contexts/auth/RequireAuth"; import type { ProxyProvider } from "contexts/ProxyContext"; import { ThemeOverride } from "contexts/ThemeProvider"; @@ -239,7 +240,9 @@ export const waitForLoaderToBeRemoved = async (): Promise => { export const renderComponent = (component: React.ReactNode) => { return testingLibraryRender(component, { wrapper: ({ children }) => ( - {children} + + {children} + ), }); };