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

Commit1f7c63c

Browse files
fix(site): hide ws proxy on menu when disabled (#11101)
1 parent9d8578e commit1f7c63c

File tree

8 files changed

+100
-163
lines changed

8 files changed

+100
-163
lines changed

‎site/src/pages/HealthPage/AccessURLPage.stories.tsx‎

Lines changed: 5 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,13 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{AccessURLPage}from"./AccessURLPage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
9-
import{MockHealth}from"testHelpers/entities";
3+
import{generateMeta}from"./storybook";
104

115
constmeta:Meta={
126
title:"pages/Health/AccessURL",
13-
render:HealthLayout,
14-
parameters:{
15-
layout:"fullscreen",
16-
reactRouter:reactRouterParameters({
17-
routing:reactRouterOutlet(
18-
{path:"/health/access-url"},
19-
<AccessURLPage/>,
20-
),
21-
}),
22-
},
23-
decorators:[
24-
(Story)=>{
25-
constqueryClient=useQueryClient();
26-
queryClient.setQueryData(["health"],MockHealth);
27-
return<Story/>;
28-
},
29-
],
7+
...generateMeta({
8+
path:"/health/access-url",
9+
element:<AccessURLPage/>,
10+
}),
3011
};
3112

3213
exportdefaultmeta;

‎site/src/pages/HealthPage/DERPPage.stories.tsx‎

Lines changed: 5 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,13 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{DERPPage}from"./DERPPage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
9-
import{MockHealth}from"testHelpers/entities";
3+
import{generateMeta}from"./storybook";
104

115
constmeta:Meta={
126
title:"pages/Health/DERP",
13-
render:HealthLayout,
14-
parameters:{
15-
layout:"fullscreen",
16-
reactRouter:reactRouterParameters({
17-
routing:reactRouterOutlet({path:"/health/derp"},<DERPPage/>),
18-
}),
19-
},
20-
decorators:[
21-
(Story)=>{
22-
constqueryClient=useQueryClient();
23-
queryClient.setQueryData(["health"],MockHealth);
24-
return<Story/>;
25-
},
26-
],
7+
...generateMeta({
8+
path:"/health/derp",
9+
element:<DERPPage/>,
10+
}),
2711
};
2812

2913
exportdefaultmeta;

‎site/src/pages/HealthPage/DERPRegionPage.stories.tsx‎

Lines changed: 6 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,18 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{DERPRegionPage}from"./DERPRegionPage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
93
import{MockHealth}from"testHelpers/entities";
4+
import{generateMeta}from"./storybook";
105

116
constfirstRegionId=Object.values(MockHealth.derp.regions)[0].region
127
?.RegionID;
138

149
constmeta:Meta={
1510
title:"pages/Health/DERPRegion",
16-
render:HealthLayout,
17-
parameters:{
18-
layout:"fullscreen",
19-
reactRouter:reactRouterParameters({
20-
location:{pathParams:{regionId:firstRegionId}},
21-
routing:reactRouterOutlet(
22-
{path:`/health/derp/regions/:regionId`},
23-
<DERPRegionPage/>,
24-
),
25-
}),
26-
},
27-
decorators:[
28-
(Story)=>{
29-
constqueryClient=useQueryClient();
30-
queryClient.setQueryData(["health"],MockHealth);
31-
return<Story/>;
32-
},
33-
],
11+
...generateMeta({
12+
path:"/health/derp/regions/:regionId",
13+
element:<DERPRegionPage/>,
14+
params:{regionId:firstRegionId},
15+
}),
3416
};
3517

3618
exportdefaultmeta;

‎site/src/pages/HealthPage/DatabasePage.stories.tsx‎

Lines changed: 5 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,13 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{DatabasePage}from"./DatabasePage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
9-
import{MockHealth}from"testHelpers/entities";
3+
import{generateMeta}from"./storybook";
104

115
constmeta:Meta={
126
title:"pages/Health/Database",
13-
render:HealthLayout,
14-
parameters:{
15-
layout:"fullscreen",
16-
reactRouter:reactRouterParameters({
17-
routing:reactRouterOutlet(
18-
{path:"/health/database"},
19-
<DatabasePage/>,
20-
),
21-
}),
22-
},
23-
decorators:[
24-
(Story)=>{
25-
constqueryClient=useQueryClient();
26-
queryClient.setQueryData(["health"],MockHealth);
27-
return<Story/>;
28-
},
29-
],
7+
...generateMeta({
8+
path:"/health/database",
9+
element:<DatabasePage/>,
10+
}),
3011
};
3112

3213
exportdefaultmeta;

‎site/src/pages/HealthPage/HealthLayout.tsx‎

Lines changed: 42 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -12,22 +12,16 @@ import Tooltip from "@mui/material/Tooltip";
1212
importCircularProgressfrom"@mui/material/CircularProgress";
1313
import{NavLink,Outlet}from"react-router-dom";
1414
import{css}from"@emotion/css";
15-
import{kebabCase}from"lodash/fp";
15+
importkebabCasefrom"lodash/fp/kebabCase";
1616
import{Suspense}from"react";
1717
import{HealthIcon}from"./Content";
1818
import{HealthSeverity}from"api/typesGenerated";
1919
importNotificationsOffOutlinedfrom"@mui/icons-material/NotificationsOffOutlined";
20-
21-
constsections={
22-
derp:"DERP",
23-
access_url:"Access URL",
24-
websocket:"Websocket",
25-
database:"Database",
26-
workspace_proxy:"Workspace Proxy",
27-
}asconst;
20+
import{useDashboard}from"components/Dashboard/DashboardProvider";
2821

2922
exportfunctionHealthLayout(){
3023
consttheme=useTheme();
24+
constdashboard=useDashboard();
3125
constqueryClient=useQueryClient();
3226
const{data:healthStatus}=useQuery({
3327
...health(),
@@ -36,6 +30,16 @@ export function HealthLayout() {
3630
const{mutate:forceRefresh,isLoading:isRefreshing}=useMutation(
3731
refreshHealth(queryClient),
3832
);
33+
constsections={
34+
derp:"DERP",
35+
access_url:"Access URL",
36+
websocket:"Websocket",
37+
database:"Database",
38+
workspace_proxy:dashboard.experiments.includes("moons")
39+
?"Workspace Proxy"
40+
:undefined,
41+
}asconst;
42+
constvisibleSections=filterVisibleSections(sections);
3943

4044
return(
4145
<>
@@ -106,13 +110,13 @@ export function HealthLayout() {
106110
}}
107111
>
108112
{healthStatus.healthy
109-
?Object.keys(sections).some(
110-
(key)=>
111-
healthStatus[keyaskeyoftypeofsections]
112-
.warnings!==null&&
113-
healthStatus[keyaskeyoftypeofsections].warnings
114-
.length>0,
115-
)
113+
?Object.keys(visibleSections).some((key)=>{
114+
constsection=
115+
healthStatus[keyaskeyoftypeofvisibleSections];
116+
return(
117+
section.warnings&&section.warnings.length>0
118+
);
119+
})
116120
?"All systems operational, but performance might be degraded"
117121
:"All systems operational"
118122
:"Some issues have been detected"}
@@ -145,12 +149,13 @@ export function HealthLayout() {
145149
</div>
146150

147151
<navcss={{display:"flex",flexDirection:"column",gap:1}}>
148-
{Object.keys(sections)
152+
{Object.keys(visibleSections)
149153
.sort()
150154
.map((key)=>{
151-
constlabel=sections[keyaskeyoftypeofsections];
155+
constlabel=
156+
visibleSections[keyaskeyoftypeofvisibleSections];
152157
consthealthSection=
153-
healthStatus[keyaskeyoftypeofsections];
158+
healthStatus[keyaskeyoftypeofvisibleSections];
154159

155160
return(
156161
<NavLink
@@ -218,3 +223,21 @@ export function HealthLayout() {
218223
</>
219224
);
220225
}
226+
227+
constfilterVisibleSections=<Textendsobject>(sections:T)=>{
228+
returnObject.keys(sections).reduce(
229+
(visible,sectionName)=>{
230+
constsectionValue=sections[sectionNameaskeyoftypeofsections];
231+
232+
if(!sectionValue){
233+
returnvisible;
234+
}
235+
236+
return{
237+
...visible,
238+
[sectionName]:sectionValue,
239+
};
240+
},
241+
{}asPartial<typeofsections>,
242+
);
243+
};

‎site/src/pages/HealthPage/WebsocketPage.stories.tsx‎

Lines changed: 5 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,13 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{WebsocketPage}from"./WebsocketPage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
9-
import{MockHealth}from"testHelpers/entities";
3+
import{generateMeta}from"./storybook";
104

115
constmeta:Meta={
126
title:"pages/Health/Websocket",
13-
render:HealthLayout,
14-
parameters:{
15-
layout:"fullscreen",
16-
reactRouter:reactRouterParameters({
17-
routing:reactRouterOutlet(
18-
{path:"/health/derp/websocket"},
19-
<WebsocketPage/>,
20-
),
21-
}),
22-
},
23-
decorators:[
24-
(Story)=>{
25-
constqueryClient=useQueryClient();
26-
queryClient.setQueryData(["health"],MockHealth);
27-
return<Story/>;
28-
},
29-
],
7+
...generateMeta({
8+
path:"/health/websocket",
9+
element:<WebsocketPage/>,
10+
}),
3011
};
3112

3213
exportdefaultmeta;

‎site/src/pages/HealthPage/WebsocketProxyPage.stories.tsx‎

Lines changed: 5 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,13 @@
11
import{StoryObj,Meta}from"@storybook/react";
22
import{WorkspaceProxyPage}from"./WorkspaceProxyPage";
3-
import{HealthLayout}from"./HealthLayout";
4-
import{
5-
reactRouterOutlet,
6-
reactRouterParameters,
7-
}from"storybook-addon-react-router-v6";
8-
import{useQueryClient}from"react-query";
9-
import{MockHealth}from"testHelpers/entities";
3+
import{generateMeta}from"./storybook";
104

115
constmeta:Meta={
126
title:"pages/Health/WorkspaceProxy",
13-
render:HealthLayout,
14-
parameters:{
15-
layout:"fullscreen",
16-
reactRouter:reactRouterParameters({
17-
routing:reactRouterOutlet(
18-
{path:"/health/workspace-proxy"},
19-
<WorkspaceProxyPage/>,
20-
),
21-
}),
22-
},
23-
decorators:[
24-
(Story)=>{
25-
constqueryClient=useQueryClient();
26-
queryClient.setQueryData(["health"],MockHealth);
27-
return<Story/>;
28-
},
29-
],
7+
...generateMeta({
8+
path:"/health/workspace-proxy",
9+
element:<WorkspaceProxyPage/>,
10+
}),
3011
};
3112

3213
exportdefaultmeta;

‎site/src/pages/HealthPage/storybook.tsx‎

Lines changed: 27 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,32 @@ import {
44
reactRouterOutlet,
55
RouteDefinition,
66
}from"storybook-addon-react-router-v6";
7-
import{MockHealth,MockHealthSettings}from"testHelpers/entities";
7+
import{
8+
MockBuildInfo,
9+
MockEntitlements,
10+
MockExperiments,
11+
MockHealth,
12+
MockHealthSettings,
13+
}from"testHelpers/entities";
814
import{Meta}from"@storybook/react";
915
import{HEALTH_QUERY_KEY,HEALTH_QUERY_SETTINGS_KEY}from"api/queries/debug";
16+
import{DashboardProvider}from"components/Dashboard/DashboardProvider";
17+
import{HealthLayout}from"./HealthLayout";
1018

1119
typeMetaOptions={
1220
element:RouteDefinition;
1321
path:string;
22+
params?:Record<string,string>;
1423
};
1524

16-
exportconstgenerateMeta=({ element, path}:MetaOptions):Meta=>{
25+
exportconstgenerateMeta=({ element, path, params}:MetaOptions):Meta=>{
1726
return{
27+
render:HealthLayout,
1828
parameters:{
1929
layout:"fullscreen",
2030
reactRouter:reactRouterParameters({
21-
routing:reactRouterOutlet({path:`/health/${path}`},element),
31+
location:{pathParams:params},
32+
routing:reactRouterOutlet({ path},element),
2233
}),
2334
},
2435
decorators:[
@@ -28,6 +39,19 @@ export const generateMeta = ({ element, path }: MetaOptions): Meta => {
2839
queryClient.setQueryData(HEALTH_QUERY_SETTINGS_KEY,MockHealthSettings);
2940
return<Story/>;
3041
},
42+
(Story)=>{
43+
constqueryClient=useQueryClient();
44+
queryClient.setQueryData(["buildInfo"],MockBuildInfo);
45+
queryClient.setQueryData(["entitlements"],MockEntitlements);
46+
queryClient.setQueryData(["experiments"],MockExperiments);
47+
queryClient.setQueryData(["appearance"],MockExperiments);
48+
49+
return(
50+
<DashboardProvider>
51+
<Story/>
52+
</DashboardProvider>
53+
);
54+
},
3155
],
3256
};
3357
};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp