Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 215dd7b

Browse files
aslilacaslilac
authored
feat: show version on login page (#13033)
1 parent a69fc65 commit 215dd7b

File tree

19 files changed

+101
-83
lines changed

19 files changed

+101
-83
lines changed

‎site/src/api/queries/appearance.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,12 @@ const initialAppearanceData = getMetadataAsJSON<AppearanceConfig>("appearance");
88
const appearanceConfigKey = ["appearance"] as const;
99

1010
export const appearance = (): UseQueryOptions<AppearanceConfig> => {
11-
return {
12-
// We either have our initial data or should immediately
13-
// fetch and never again!
14-
...cachedQuery(initialAppearanceData),
11+
// We either have our initial data or should immediately fetch and never again!
12+
return cachedQuery({
13+
initialData: initialAppearanceData,
1514
queryKey: ["appearance"],
1615
queryFn: () => API.getAppearance(),
17-
};
16+
});
1817
};
1918

2019
export const updateAppearance = (queryClient: QueryClient) => {

‎site/src/api/queries/buildInfo.ts

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,10 @@ const initialBuildInfoData = getMetadataAsJSON<BuildInfoResponse>("build-info");
88
const buildInfoKey = ["buildInfo"] as const;
99

1010
export const buildInfo = (): UseQueryOptions<BuildInfoResponse> => {
11-
return {
12-
// We either have our initial data or should immediately
13-
// fetch and never again!
14-
...cachedQuery(initialBuildInfoData),
11+
// The version of the app can't change without reloading the page.
12+
return cachedQuery({
13+
initialData: initialBuildInfoData,
1514
queryKey: buildInfoKey,
1615
queryFn: () => API.getBuildInfo(),
17-
};
16+
});
1817
};

‎site/src/api/queries/entitlements.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ const initialEntitlementsData = getMetadataAsJSON<Entitlements>("entitlements");
88
const entitlementsQueryKey = ["entitlements"] as const;
99

1010
export const entitlements = (): UseQueryOptions<Entitlements> => {
11-
return {
12-
...cachedQuery(initialEntitlementsData),
11+
return cachedQuery({
12+
initialData: initialEntitlementsData,
1313
queryKey: entitlementsQueryKey,
1414
queryFn: () => API.getEntitlements(),
15-
};
15+
});
1616
};
1717

1818
export const refreshEntitlements = (queryClient: QueryClient) => {

‎site/src/api/queries/experiments.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ const initialExperimentsData = getMetadataAsJSON<Experiments>("experiments");
88
const experimentsKey = ["experiments"] as const;
99

1010
export const experiments = (): UseQueryOptions<Experiments> => {
11-
return {
12-
...cachedQuery(initialExperimentsData),
11+
return cachedQuery({
12+
initialData: initialExperimentsData,
1313
queryKey: experimentsKey,
1414
queryFn: () => API.getExperiments(),
15-
} satisfies UseQueryOptions<Experiments>;
15+
});
1616
};
1717

1818
export const availableExperiments = () => {

‎site/src/api/queries/users.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -129,11 +129,11 @@ const meKey = ["me"];
129129
export const me = (): UseQueryOptions<User> & {
130130
queryKey: QueryKey;
131131
} => {
132-
return {
133-
...cachedQuery(initialUserData),
132+
return cachedQuery({
133+
initialData: initialUserData,
134134
queryKey: meKey,
135135
queryFn: API.getAuthenticatedUser,
136-
};
136+
});
137137
};
138138

139139
export function apiKey(): UseQueryOptions<GenerateAPIKeyResponse> {
@@ -144,12 +144,12 @@ export function apiKey(): UseQueryOptions<GenerateAPIKeyResponse> {
144144
}
145145

146146
export const hasFirstUser = (): UseQueryOptions<boolean> => {
147-
return {
147+
return cachedQuery({
148148
// This cannot be false otherwise it will not fetch!
149-
...cachedQuery(typeof initialUserData !== "undefined" ? true : undefined),
149+
initialData: Boolean(initialUserData) || undefined,
150150
queryKey: ["hasFirstUser"],
151151
queryFn: API.hasFirstUser,
152-
};
152+
});
153153
};
154154

155155
export const login = (

‎site/src/api/queries/util.ts

Lines changed: 25 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,27 @@
11
import type { UseQueryOptions } from "react-query";
22

3-
// cachedQuery allows the caller to only make a request
4-
// a single time, and use `initialData` if it is provided.
5-
//
6-
// This is particularly helpful for passing values injected
7-
// via metadata. We do this for the initial user fetch, buildinfo,
8-
// and a few others to reduce page load time.
9-
export const cachedQuery = <T>(initialData?: T): Partial<UseQueryOptions<T>> =>
10-
// Only do this if there is initial data,
11-
// otherwise it can conflict with tests.
12-
initialData
13-
? {
14-
cacheTime: Infinity,
15-
staleTime: Infinity,
16-
refetchOnMount: false,
17-
refetchOnReconnect: false,
18-
refetchOnWindowFocus: false,
19-
initialData,
20-
}
21-
: {
22-
initialData,
23-
};
3+
/**
4+
* cachedQuery allows the caller to only make a request a single time, and use
5+
* `initialData` if it is provided. This is particularly helpful for passing
6+
* values injected via metadata. We do this for the initial user fetch,
7+
* buildinfo, and a few others to reduce page load time.
8+
*/
9+
export const cachedQuery = <
10+
TQueryOptions extends UseQueryOptions<TData>,
11+
TData,
12+
>(
13+
options: TQueryOptions,
14+
): TQueryOptions =>
15+
// Only do this if there is initial data, otherwise it can conflict with tests.
16+
({
17+
...(options.initialData
18+
? {
19+
cacheTime: Infinity,
20+
staleTime: Infinity,
21+
refetchOnMount: false,
22+
refetchOnReconnect: false,
23+
refetchOnWindowFocus: false,
24+
}
25+
: {}),
26+
...options,
27+
});

‎site/src/contexts/ProxyContext.tsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
useEffect,
88
useState,
99
} from "react";
10-
import { type UseQueryOptions, useQuery } from "react-query";
10+
import { useQuery } from "react-query";
1111
import { getWorkspaceProxies, getWorkspaceProxyRegions } from "api/api";
1212
import { cachedQuery } from "api/queries/util";
1313
import type { Region, WorkspaceProxy } from "api/typesGenerated";
@@ -131,11 +131,13 @@ export const ProxyProvider: FC<PropsWithChildren> = ({ children }) => {
131131
error: proxiesError,
132132
isLoading: proxiesLoading,
133133
isFetched: proxiesFetched,
134-
} = useQuery({
135-
...cachedQuery(initialData),
136-
queryKey,
137-
queryFn: query,
138-
} as UseQueryOptions<readonly Region[]>);
134+
} = useQuery(
135+
cachedQuery({
136+
initialData,
137+
queryKey,
138+
queryFn: query,
139+
}),
140+
);
139141

140142
// Every time we get a new proxiesResponse, update the latency check
141143
// to each workspace proxy.

‎site/src/modules/dashboard/DashboardProvider.tsx

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,10 @@ import {
77
} from "react";
88
import { useQuery } from "react-query";
99
import { appearance } from "api/queries/appearance";
10-
import { buildInfo } from "api/queries/buildInfo";
1110
import { entitlements } from "api/queries/entitlements";
1211
import { experiments } from "api/queries/experiments";
1312
import type {
1413
AppearanceConfig,
15-
BuildInfoResponse,
1614
Entitlements,
1715
Experiments,
1816
} from "api/typesGenerated";
@@ -27,7 +25,6 @@ interface Appearance {
2725
}
2826

2927
export interface DashboardValue {
30-
buildInfo: BuildInfoResponse;
3128
entitlements: Entitlements;
3229
experiments: Experiments;
3330
appearance: Appearance;
@@ -38,16 +35,12 @@ export const DashboardContext = createContext<DashboardValue | undefined>(
3835
);
3936

4037
export const DashboardProvider: FC<PropsWithChildren> = ({ children }) => {
41-
const buildInfoQuery = useQuery(buildInfo());
4238
const entitlementsQuery = useQuery(entitlements());
4339
const experimentsQuery = useQuery(experiments());
4440
const appearanceQuery = useQuery(appearance());
4541

4642
const isLoading =
47-
!buildInfoQuery.data ||
48-
!entitlementsQuery.data ||
49-
!appearanceQuery.data ||
50-
!experimentsQuery.data;
43+
!entitlementsQuery.data || !appearanceQuery.data || !experimentsQuery.data;
5144

5245
const [configPreview, setConfigPreview] = useState<AppearanceConfig>();
5346

@@ -84,7 +77,6 @@ export const DashboardProvider: FC<PropsWithChildren> = ({ children }) => {
8477
return (
8578
<DashboardContext.Provider
8679
value={{
87-
buildInfo: buildInfoQuery.data,
8880
entitlements: entitlementsQuery.data,
8981
experiments: experimentsQuery.data,
9082
appearance: {

‎site/src/modules/dashboard/Navbar/Navbar.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
11
import type { FC } from "react";
2+
import { useQuery } from "react-query";
3+
import { buildInfo } from "api/queries/buildInfo";
24
import { useAuthenticated } from "contexts/auth/RequireAuth";
35
import { useProxy } from "contexts/ProxyContext";
46
import { useDashboard } from "modules/dashboard/useDashboard";
57
import { useFeatureVisibility } from "../useFeatureVisibility";
68
import { NavbarView } from "./NavbarView";
79

810
export const Navbar: FC = () => {
9-
const { appearance, buildInfo } = useDashboard();
11+
const { appearance } = useDashboard();
12+
const buildInfoQuery = useQuery(buildInfo());
1013
const { user: me, permissions, signOut } = useAuthenticated();
1114
const featureVisibility = useFeatureVisibility();
1215
const canViewAuditLog =
@@ -19,7 +22,7 @@ export const Navbar: FC = () => {
1922
<NavbarView
2023
user={me}
2124
logo_url={appearance.config.logo_url}
22-
buildInfo={buildInfo}
25+
buildInfo={buildInfoQuery.data}
2326
supportLinks={appearance.config.support_links}
2427
onSignOut={signOut}
2528
canViewAuditLog={canViewAuditLog}

‎site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { css, type Interpolation, type Theme, useTheme } from "@emotion/react";
22
import Badge from "@mui/material/Badge";
3-
import type { FC, ReactNode } from "react";
3+
import type { FC } from "react";
44
import type * as TypesGen from "api/typesGenerated";
55
import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
66
import {
@@ -17,7 +17,6 @@ export interface UserDropdownProps {
1717
buildInfo?: TypesGen.BuildInfoResponse;
1818
supportLinks?: readonly TypesGen.LinkConfig[];
1919
onSignOut: () => void;
20-
children?: ReactNode;
2120
}
2221

2322
export const UserDropdown: FC<UserDropdownProps> = ({

0 commit comments

Comments
 (0)