Skip to content

Commit 0d4ad6b

Browse files
committed
feat: external icon settings
1 parent da7859c commit 0d4ad6b

File tree

22 files changed

+479
-39
lines changed

22 files changed

+479
-39
lines changed

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
@@ -414,11 +412,7 @@ export const AppRouter: FC = () => {
414412
/>
415413
<Route
416414
path="/:username/:workspace/terminal"
417-
element={
418-
<ThemeOverride theme={themes.dark}>
419-
<TerminalPage />
420-
</ThemeOverride>
421-
}
415+
element={<TerminalPage />}
422416
/>
423417
<Route path="/cli-auth" element={<CliAuthenticationPage />} />
424418
<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/RichParameterInput/RichParameterInput.stories.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ export const Options: Story = {
9696
name: "Third option",
9797
value: "third_option",
9898
description: "",
99-
icon: "/icon/aws.png",
99+
icon: "/icon/aws.svg",
100100
},
101101
],
102102
}),
@@ -138,7 +138,7 @@ Very big.
138138
139139
> Wow, that description is straight up large. –Some guy, probably
140140
`,
141-
icon: "/icon/aws.png",
141+
icon: "/icon/aws.svg",
142142
},
143143
],
144144
}),
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import type { Meta, StoryObj } from "@storybook/react";
2+
import { chromatic } from "testHelpers/chromatic";
3+
import { IconsPage } from "./IconsPage";
4+
5+
const meta: Meta<typeof IconsPage> = {
6+
title: "pages/IconsPage",
7+
parameters: { chromatic },
8+
component: IconsPage,
9+
args: {},
10+
};
11+
12+
export default meta;
13+
type Story = StoryObj<typeof IconsPage>;
14+
15+
const Example: Story = {};
16+
17+
export { Example as IconsPage };

site/src/pages/IconsPage/IconsPage.tsx

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,10 @@ import {
1919
} from "components/PageHeader/PageHeader";
2020
import { Stack } from "components/Stack/Stack";
2121
import icons from "theme/icons.json";
22+
import {
23+
defaultParametersForBuiltinIcons,
24+
parseImageParameters,
25+
} from "theme/externalImages";
2226
import { pageTitle } from "utils/page";
2327

2428
const iconsWithoutSuffix = icons.map((icon) => icon.split(".")[0]);
@@ -163,13 +167,19 @@ export const IconsPage: FC = () => {
163167
<img
164168
alt={icon.url}
165169
src={icon.url}
166-
css={{
167-
width: 60,
168-
height: 60,
169-
objectFit: "contain",
170-
pointerEvents: "none",
171-
padding: 12,
172-
}}
170+
css={[
171+
{
172+
width: 60,
173+
height: 60,
174+
objectFit: "contain",
175+
pointerEvents: "none",
176+
padding: 12,
177+
},
178+
parseImageParameters(
179+
theme.externalImages,
180+
defaultParametersForBuiltinIcons.get(icon.url) ?? "",
181+
),
182+
]}
173183
/>
174184
<figcaption
175185
css={{

site/src/pages/TerminalPage/TerminalPage.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ import {
3333
PopoverContent,
3434
PopoverTrigger,
3535
} from "components/Popover/Popover";
36+
import { ThemeOverride } from "contexts/ThemeProvider";
37+
import themes from "theme";
3638

3739
export const Language = {
3840
workspaceErrorMessagePrefix: "Unable to fetch workspace: ",
@@ -293,7 +295,7 @@ const TerminalPage: FC = () => {
293295
]);
294296

295297
return (
296-
<>
298+
<ThemeOverride theme={themes.dark}>
297299
<Helmet>
298300
<title>
299301
{workspace.data
@@ -314,7 +316,7 @@ const TerminalPage: FC = () => {
314316
<BottomBar proxy={selectedProxy} latency={latency.latencyMS} />
315317
)}
316318
</div>
317-
</>
319+
</ThemeOverride>
318320
);
319321
};
320322

0 commit comments

Comments
 (0)