Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit00b70ea

Browse files
committed
refactor: extract TooltipProvder to definition of HelpTooltip
1 parent4438af8 commit00b70ea

File tree

16 files changed

+282
-319
lines changed

16 files changed

+282
-319
lines changed

‎site/src/components/HelpTooltip/HelpTooltip.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
Tooltip,
1212
TooltipContent,
1313
typeTooltipContentProps,
14+
TooltipProvider,
1415
TooltipTrigger,
1516
}from"components/Tooltip/Tooltip";
1617
import{CircleHelpIcon,ExternalLinkIcon}from"lucide-react";
@@ -30,7 +31,11 @@ type Size = "small" | "medium";
3031
exportconstHelpTooltipIcon=CircleHelpIcon;
3132

3233
exportconstHelpTooltip:FC<TooltipProps>=(props)=>{
33-
return<TooltipdelayDuration={0}{...props}/>;
34+
return(
35+
<TooltipProvider>
36+
<TooltipdelayDuration={0}{...props}/>
37+
</TooltipProvider>
38+
);
3439
};
3540

3641
exportconstHelpTooltipContent:FC<TooltipContentProps>=({

‎site/src/modules/resources/AgentLatency.tsx‎

Lines changed: 38 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
HelpTooltipTitle,
88
}from"components/HelpTooltip/HelpTooltip";
99
import{Stack}from"components/Stack/Stack";
10-
import{TooltipProvider,TooltipTrigger}from"components/Tooltip/Tooltip";
10+
import{TooltipTrigger}from"components/Tooltip/Tooltip";
1111
importtype{FC}from"react";
1212
import{getLatencyColor}from"utils/latency";
1313

@@ -43,45 +43,43 @@ export const AgentLatency: FC<AgentLatencyProps> = ({ agent }) => {
4343
}
4444

4545
return(
46-
<TooltipProvider>
47-
<HelpTooltip>
48-
<TooltipTriggerasChild>
49-
<span
50-
role="presentation"
51-
aria-label="latency"
52-
css={{cursor:"pointer",color:latency.color}}
53-
>
54-
{Math.round(latency.latency_ms)}ms
55-
</span>
56-
</TooltipTrigger>
57-
<HelpTooltipContent>
58-
<HelpTooltipTitle>Latency</HelpTooltipTitle>
59-
<HelpTooltipText>
60-
This is the latency overhead on non peer to peer connections. The
61-
first row is the preferred relay.
62-
</HelpTooltipText>
63-
<Stackdirection="column"spacing={1}css={{marginTop:16}}>
64-
{Object.entries(agent.latency)
65-
.sort(([,a],[,b])=>a.latency_ms-b.latency_ms)
66-
.map(([regionName,region])=>(
67-
<Stack
68-
direction="row"
69-
key={regionName}
70-
spacing={0.5}
71-
justifyContent="space-between"
72-
css={
73-
region.preferred&&{
74-
color:theme.palette.text.primary,
75-
}
46+
<HelpTooltip>
47+
<TooltipTriggerasChild>
48+
<span
49+
role="presentation"
50+
aria-label="latency"
51+
css={{cursor:"pointer",color:latency.color}}
52+
>
53+
{Math.round(latency.latency_ms)}ms
54+
</span>
55+
</TooltipTrigger>
56+
<HelpTooltipContent>
57+
<HelpTooltipTitle>Latency</HelpTooltipTitle>
58+
<HelpTooltipText>
59+
This is the latency overhead on non peer to peer connections. The
60+
first row is the preferred relay.
61+
</HelpTooltipText>
62+
<Stackdirection="column"spacing={1}css={{marginTop:16}}>
63+
{Object.entries(agent.latency)
64+
.sort(([,a],[,b])=>a.latency_ms-b.latency_ms)
65+
.map(([regionName,region])=>(
66+
<Stack
67+
direction="row"
68+
key={regionName}
69+
spacing={0.5}
70+
justifyContent="space-between"
71+
css={
72+
region.preferred&&{
73+
color:theme.palette.text.primary,
7674
}
77-
>
78-
<strong>{regionName}</strong>
79-
{Math.round(region.latency_ms)}ms
80-
</Stack>
81-
))}
82-
</Stack>
83-
</HelpTooltipContent>
84-
</HelpTooltip>
85-
</TooltipProvider>
75+
}
76+
>
77+
<strong>{regionName}</strong>
78+
{Math.round(region.latency_ms)}ms
79+
</Stack>
80+
))}
81+
</Stack>
82+
</HelpTooltipContent>
83+
</HelpTooltip>
8684
);
8785
};

‎site/src/modules/resources/AgentOutdatedTooltip.tsx‎

Lines changed: 41 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { Stack } from "components/Stack/Stack";
1212
import{RotateCcwIcon}from"lucide-react";
1313
import{useState,typeFC}from"react";
1414
import{agentVersionStatus}from"../../utils/workspace";
15-
import{TooltipProvider,TooltipTrigger}from"components/Tooltip/Tooltip";
15+
import{TooltipTrigger}from"components/Tooltip/Tooltip";
1616

1717
typeAgentOutdatedTooltipProps={
1818
agent:WorkspaceAgent;
@@ -40,50 +40,48 @@ export const AgentOutdatedTooltip: FC<AgentOutdatedTooltipProps> = ({
4040
consttext=`${opener} This can happen after you update Coder with running workspaces. To fix this, you can stop and start the workspace.`;
4141

4242
return(
43-
<TooltipProvider>
44-
<HelpTooltipopen={isOpen}onOpenChange={setIsOpen}>
45-
<TooltipTriggerasChild>
46-
<spanrole="status"className="cursor-pointer">
47-
{status===agentVersionStatus.Outdated ?"Outdated" :"Deprecated"}
48-
</span>
49-
</TooltipTrigger>
50-
<HelpTooltipContent>
51-
<Stackspacing={1}>
52-
<div>
53-
<HelpTooltipTitle>{title}</HelpTooltipTitle>
54-
<HelpTooltipText>{text}</HelpTooltipText>
55-
</div>
43+
<HelpTooltipopen={isOpen}onOpenChange={setIsOpen}>
44+
<TooltipTriggerasChild>
45+
<spanrole="status"className="cursor-pointer">
46+
{status===agentVersionStatus.Outdated ?"Outdated" :"Deprecated"}
47+
</span>
48+
</TooltipTrigger>
49+
<HelpTooltipContent>
50+
<Stackspacing={1}>
51+
<div>
52+
<HelpTooltipTitle>{title}</HelpTooltipTitle>
53+
<HelpTooltipText>{text}</HelpTooltipText>
54+
</div>
5655

57-
<Stackspacing={0.5}>
58-
<spanclassName="font-semibold text-content-primary">
59-
Agent version
60-
</span>
61-
<span>{agent.version}</span>
62-
</Stack>
63-
64-
<Stackspacing={0.5}>
65-
<spanclassName="font-semibold text-content-primary">
66-
Server version
67-
</span>
68-
<span>{serverVersion}</span>
69-
</Stack>
56+
<Stackspacing={0.5}>
57+
<spanclassName="font-semibold text-content-primary">
58+
Agent version
59+
</span>
60+
<span>{agent.version}</span>
61+
</Stack>
7062

71-
<HelpTooltipLinksGroup>
72-
<HelpTooltipAction
73-
icon={RotateCcwIcon}
74-
onClick={()=>{
75-
onUpdate();
76-
// TODO can we move this tooltip-closing logic to the definition of HelpTooltipAction?
77-
setIsOpen(false);
78-
}}
79-
ariaLabel="Update workspace"
80-
>
81-
Update workspace
82-
</HelpTooltipAction>
83-
</HelpTooltipLinksGroup>
63+
<Stackspacing={0.5}>
64+
<spanclassName="font-semibold text-content-primary">
65+
Server version
66+
</span>
67+
<span>{serverVersion}</span>
8468
</Stack>
85-
</HelpTooltipContent>
86-
</HelpTooltip>
87-
</TooltipProvider>
69+
70+
<HelpTooltipLinksGroup>
71+
<HelpTooltipAction
72+
icon={RotateCcwIcon}
73+
onClick={()=>{
74+
onUpdate();
75+
// TODO can we move this tooltip-closing logic to the definition of HelpTooltipAction?
76+
setIsOpen(false);
77+
}}
78+
ariaLabel="Update workspace"
79+
>
80+
Update workspace
81+
</HelpTooltipAction>
82+
</HelpTooltipLinksGroup>
83+
</Stack>
84+
</HelpTooltipContent>
85+
</HelpTooltip>
8886
);
8987
};

‎site/src/modules/resources/AgentStatus.tsx‎

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -266,22 +266,20 @@ const TimeoutStatus: FC<AgentStatusProps> = ({ agent }) => {
266266

267267
exportconstAgentStatus:FC<AgentStatusProps>=({ agent})=>{
268268
return(
269-
<TooltipProvider>
270-
<ChooseOne>
271-
<Condcondition={agent.status==="connected"}>
272-
<ConnectedStatusagent={agent}/>
273-
</Cond>
274-
<Condcondition={agent.status==="disconnected"}>
275-
<DisconnectedStatus/>
276-
</Cond>
277-
<Condcondition={agent.status==="timeout"}>
278-
<TimeoutStatusagent={agent}/>
279-
</Cond>
280-
<Cond>
281-
<ConnectingStatus/>
282-
</Cond>
283-
</ChooseOne>
284-
</TooltipProvider>
269+
<ChooseOne>
270+
<Condcondition={agent.status==="connected"}>
271+
<ConnectedStatusagent={agent}/>
272+
</Cond>
273+
<Condcondition={agent.status==="disconnected"}>
274+
<DisconnectedStatus/>
275+
</Cond>
276+
<Condcondition={agent.status==="timeout"}>
277+
<TimeoutStatusagent={agent}/>
278+
</Cond>
279+
<Cond>
280+
<ConnectingStatus/>
281+
</Cond>
282+
</ChooseOne>
285283
);
286284
};
287285

‎site/src/modules/resources/SubAgentOutdatedTooltip.tsx‎

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ import {
1212
HelpTooltipTrigger,
1313
}from"components/HelpTooltip/HelpTooltip";
1414
import{Stack}from"components/Stack/Stack";
15-
import{TooltipProvider}from"components/Tooltip/Tooltip";
1615
import{RotateCcwIcon}from"lucide-react";
1716
importtype{FC}from"react";
1817

@@ -39,32 +38,30 @@ export const SubAgentOutdatedTooltip: FC<SubAgentOutdatedTooltipProps> = ({
3938
consttext=`${opener} This can happen if you modify your devcontainer.json file after the Dev Container has been created. To fix this, you can rebuild the Dev Container.`;
4039

4140
return(
42-
<TooltipProvider>
43-
<HelpTooltip>
44-
<HelpTooltipTrigger>
45-
<spanrole="status"className="cursor-pointer">
46-
Outdated
47-
</span>
48-
</HelpTooltipTrigger>
49-
<HelpTooltipContent>
50-
<Stackspacing={1}>
51-
<div>
52-
<HelpTooltipTitle>{title}</HelpTooltipTitle>
53-
<HelpTooltipText>{text}</HelpTooltipText>
54-
</div>
41+
<HelpTooltip>
42+
<HelpTooltipTrigger>
43+
<spanrole="status"className="cursor-pointer">
44+
Outdated
45+
</span>
46+
</HelpTooltipTrigger>
47+
<HelpTooltipContent>
48+
<Stackspacing={1}>
49+
<div>
50+
<HelpTooltipTitle>{title}</HelpTooltipTitle>
51+
<HelpTooltipText>{text}</HelpTooltipText>
52+
</div>
5553

56-
<HelpTooltipLinksGroup>
57-
<HelpTooltipAction
58-
icon={RotateCcwIcon}
59-
onClick={onUpdate}
60-
ariaLabel="Rebuild Dev Container"
61-
>
62-
Rebuild Dev Container
63-
</HelpTooltipAction>
64-
</HelpTooltipLinksGroup>
65-
</Stack>
66-
</HelpTooltipContent>
67-
</HelpTooltip>
68-
</TooltipProvider>
54+
<HelpTooltipLinksGroup>
55+
<HelpTooltipAction
56+
icon={RotateCcwIcon}
57+
onClick={onUpdate}
58+
ariaLabel="Rebuild Dev Container"
59+
>
60+
Rebuild Dev Container
61+
</HelpTooltipAction>
62+
</HelpTooltipLinksGroup>
63+
</Stack>
64+
</HelpTooltipContent>
65+
</HelpTooltip>
6966
);
7067
};

‎site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx‎

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ import {
2222
useWorkspaceUpdate,
2323
WorkspaceUpdateDialogs,
2424
}from"../WorkspaceUpdateDialogs";
25-
import{TooltipProvider}from"components/Tooltip/Tooltip";
2625

2726
interfaceTooltipProps{
2827
workspace:Workspace;
@@ -32,15 +31,13 @@ export const WorkspaceOutdatedTooltip: FC<TooltipProps> = (props) => {
3231
const[isOpen,setIsOpen]=useState(false);
3332

3433
return(
35-
<TooltipProvider>
36-
<HelpTooltipopen={isOpen}onOpenChange={setIsOpen}>
37-
<HelpTooltipTriggersize="small"hoverEffect={false}>
38-
<InfoIconcss={styles.icon}/>
39-
<spanclassName="sr-only">Outdated info</span>
40-
</HelpTooltipTrigger>
41-
<WorkspaceOutdatedTooltipContentisOpen={isOpen}{...props}/>
42-
</HelpTooltip>
43-
</TooltipProvider>
34+
<HelpTooltipopen={isOpen}onOpenChange={setIsOpen}>
35+
<HelpTooltipTriggersize="small"hoverEffect={false}>
36+
<InfoIconcss={styles.icon}/>
37+
<spanclassName="sr-only">Outdated info</span>
38+
</HelpTooltipTrigger>
39+
<WorkspaceOutdatedTooltipContentisOpen={isOpen}{...props}/>
40+
</HelpTooltip>
4441
);
4542
};
4643

‎site/src/pages/AuditPage/AuditHelpTooltip.tsx‎

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {
77
HelpTooltipTitle,
88
HelpTooltipTrigger,
99
}from"components/HelpTooltip/HelpTooltip";
10-
import{TooltipProvider}from"components/Tooltip/Tooltip";
1110
importtype{FC}from"react";
1211
import{docs}from"utils/docs";
1312

@@ -19,20 +18,18 @@ const Language = {
1918

2019
exportconstAuditHelpTooltip:FC=()=>{
2120
return(
22-
<TooltipProvider>
23-
<HelpTooltip>
24-
<HelpTooltipTrigger/>
21+
<HelpTooltip>
22+
<HelpTooltipTrigger/>
2523

26-
<HelpTooltipContent>
27-
<HelpTooltipTitle>{Language.title}</HelpTooltipTitle>
28-
<HelpTooltipText>{Language.body}</HelpTooltipText>
29-
<HelpTooltipLinksGroup>
30-
<HelpTooltipLinkhref={docs("/admin/security/audit-logs")}>
31-
{Language.docs}
32-
</HelpTooltipLink>
33-
</HelpTooltipLinksGroup>
34-
</HelpTooltipContent>
35-
</HelpTooltip>
36-
</TooltipProvider>
24+
<HelpTooltipContent>
25+
<HelpTooltipTitle>{Language.title}</HelpTooltipTitle>
26+
<HelpTooltipText>{Language.body}</HelpTooltipText>
27+
<HelpTooltipLinksGroup>
28+
<HelpTooltipLinkhref={docs("/admin/security/audit-logs")}>
29+
{Language.docs}
30+
</HelpTooltipLink>
31+
</HelpTooltipLinksGroup>
32+
</HelpTooltipContent>
33+
</HelpTooltip>
3734
);
3835
};

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp