Skip to content

Commit 9f5a59d

Browse files
authored
feat(site): improve icon compatibility across themes (#11457)
1 parent 427afe1 commit 9f5a59d

File tree

45 files changed

+722
-196
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+722
-196
lines changed

examples/examples.gen.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"url": "",
66
"name": "AWS EC2 (Devcontainer)",
77
"description": "Provision AWS EC2 VMs with a devcontainer as Coder workspaces",
8-
"icon": "/icon/aws.png",
8+
"icon": "/icon/aws.svg",
99
"tags": [
1010
"vm",
1111
"linux",
@@ -20,7 +20,7 @@
2020
"url": "",
2121
"name": "AWS EC2 (Linux)",
2222
"description": "Provision AWS EC2 VMs as Coder workspaces",
23-
"icon": "/icon/aws.png",
23+
"icon": "/icon/aws.svg",
2424
"tags": [
2525
"vm",
2626
"linux",
@@ -34,7 +34,7 @@
3434
"url": "",
3535
"name": "AWS EC2 (Windows)",
3636
"description": "Provision AWS EC2 VMs as Coder workspaces",
37-
"icon": "/icon/aws.png",
37+
"icon": "/icon/aws.svg",
3838
"tags": [
3939
"vm",
4040
"windows",

examples/templates/aws-devcontainer/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
display_name: AWS EC2 (Devcontainer)
33
description: Provision AWS EC2 VMs with a devcontainer as Coder workspaces
4-
icon: ../../../site/static/icon/aws.png
4+
icon: ../../../site/static/icon/aws.svg
55
maintainer_github: coder
66
verified: true
77
tags: [vm, linux, aws, persistent, devcontainer]

examples/templates/aws-linux/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
display_name: AWS EC2 (Linux)
33
description: Provision AWS EC2 VMs as Coder workspaces
4-
icon: ../../../site/static/icon/aws.png
4+
icon: ../../../site/static/icon/aws.svg
55
maintainer_github: coder
66
verified: true
77
tags: [vm, linux, aws, persistent-vm]

examples/templates/aws-windows/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
display_name: AWS EC2 (Windows)
33
description: Provision AWS EC2 VMs as Coder workspaces
4-
icon: ../../../site/static/icon/aws.png
4+
icon: ../../../site/static/icon/aws.svg
55
maintainer_github: coder
66
verified: true
77
tags: [vm, windows, aws]

site/src/AppRouter.tsx

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,6 @@ import WorkspacesPage from "./pages/WorkspacesPage/WorkspacesPage";
2121
import UserSettingsLayout from "./pages/UserSettingsPage/Layout";
2222
import { TemplateSettingsLayout } from "./pages/TemplateSettingsPage/TemplateSettingsLayout";
2323
import { WorkspaceSettingsLayout } from "./pages/WorkspaceSettingsPage/WorkspaceSettingsLayout";
24-
import { ThemeOverride } from "contexts/ThemeProvider";
25-
import themes from "theme";
2624

2725
// Lazy load pages
2826
// - Pages that are secondary, not in the main navigation or not usually accessed
@@ -421,11 +419,7 @@ export const AppRouter: FC = () => {
421419
/>
422420
<Route
423421
path="/:username/:workspace/terminal"
424-
element={
425-
<ThemeOverride theme={themes.dark}>
426-
<TerminalPage />
427-
</ThemeOverride>
428-
}
422+
element={<TerminalPage />}
429423
/>
430424
<Route path="/cli-auth" element={<CliAuthenticationPage />} />
431425
<Route path="/icons" element={<IconsPage />} />

site/src/__mocks__/react-markdown.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { FC, PropsWithChildren } from "react";
22

3-
const ReactMarkdown: FC<PropsWithChildren<unknown>> = ({ children }) => {
3+
const ReactMarkdown: FC<PropsWithChildren> = ({ children }) => {
44
return <div data-testid="markdown">{children}</div>;
55
};
66

site/src/api/queries/users.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -131,6 +131,7 @@ export const me = (): UseQueryOptions<User> & {
131131
queryKey: meKey,
132132
initialData: initialUserData,
133133
queryFn: API.getAuthenticatedUser,
134+
refetchOnWindowFocus: true,
134135
};
135136
};
136137

site/src/components/Avatar/Avatar.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,9 @@ import MuiAvatar, {
44
type AvatarProps as MuiAvatarProps,
55
} from "@mui/material/Avatar";
66
import { type FC, useId } from "react";
7-
import { css, type Interpolation, type Theme } from "@emotion/react";
7+
import { css, type Interpolation, type Theme, useTheme } from "@emotion/react";
88
import { visuallyHidden } from "@mui/utils";
9+
import { getExternalImageStylesFromUrl } from "theme/externalImages";
910

1011
export type AvatarProps = MuiAvatarProps & {
1112
size?: "xs" | "sm" | "md" | "xl";
@@ -67,6 +68,17 @@ export const Avatar: FC<AvatarProps> = ({
6768
);
6869
};
6970

71+
export const ExternalAvatar: FC<AvatarProps> = (props) => {
72+
const theme = useTheme();
73+
74+
return (
75+
<Avatar
76+
css={getExternalImageStylesFromUrl(theme.externalImages, props.src)}
77+
{...props}
78+
/>
79+
);
80+
};
81+
7082
type AvatarIconProps = {
7183
src: string;
7284
alt: string;

site/src/components/AvatarCard/AvatarCard.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { type ReactNode } from "react";
1+
import { type FC, type ReactNode } from "react";
22
import { Avatar } from "components/Avatar/Avatar";
33
import { type CSSObject, useTheme } from "@emotion/react";
44

@@ -12,14 +12,14 @@ type AvatarCardProps = {
1212
maxWidth?: number | "none";
1313
};
1414

15-
export function AvatarCard({
15+
export const AvatarCard: FC<AvatarCardProps> = ({
1616
header,
1717
imgUrl,
1818
altText,
1919
background,
2020
subtitle,
2121
maxWidth = "none",
22-
}: AvatarCardProps) {
22+
}) => {
2323
const theme = useTheme();
2424

2525
return (
@@ -77,4 +77,4 @@ export function AvatarCard({
7777
</Avatar>
7878
</div>
7979
);
80-
}
80+
};

site/src/components/ExternalIcon/ExternalIcon.tsx

Lines changed: 0 additions & 36 deletions
This file was deleted.

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy