Skip to content

Commit b3c3361

Browse files
committed
fix: remove permission from theme and change name to colorRoles
1 parent d21771f commit b3c3361

File tree

57 files changed

+214
-209
lines changed

Some content is hidden

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

57 files changed

+214
-209
lines changed

site/src/components/ActiveUserChart/ActiveUserChart.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -127,9 +127,9 @@ export const ActiveUserChart: FC<ActiveUserChartProps> = ({
127127
{
128128
label: `${interval === "day" ? "Daily" : "Weekly"} Active Users`,
129129
data: chartData,
130-
pointBackgroundColor: theme.roles.active.outline,
131-
pointBorderColor: theme.roles.active.outline,
132-
borderColor: theme.roles.active.outline,
130+
pointBackgroundColor: theme.colorRoles.active.outline,
131+
pointBorderColor: theme.colorRoles.active.outline,
132+
borderColor: theme.colorRoles.active.outline,
133133
},
134134
],
135135
}}

site/src/components/Badges/Badges.tsx

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -24,19 +24,19 @@ const styles = {
2424
},
2525

2626
enabledBadge: (theme) => ({
27-
border: `1px solid ${theme.roles.success.outline}`,
28-
backgroundColor: theme.roles.success.background,
29-
color: theme.roles.success.text,
27+
border: `1px solid ${theme.colorRoles.success.outline}`,
28+
backgroundColor: theme.colorRoles.success.background,
29+
color: theme.colorRoles.success.text,
3030
}),
3131
errorBadge: (theme) => ({
32-
border: `1px solid ${theme.roles.error.outline}`,
33-
backgroundColor: theme.roles.error.background,
34-
color: theme.roles.error.text,
32+
border: `1px solid ${theme.colorRoles.error.outline}`,
33+
backgroundColor: theme.colorRoles.error.background,
34+
color: theme.colorRoles.error.text,
3535
}),
3636
warnBadge: (theme) => ({
37-
border: `1px solid ${theme.roles.warning.outline}`,
38-
backgroundColor: theme.roles.warning.background,
39-
color: theme.roles.warning.text,
37+
border: `1px solid ${theme.colorRoles.warning.outline}`,
38+
backgroundColor: theme.colorRoles.warning.background,
39+
color: theme.colorRoles.warning.text,
4040
}),
4141
} satisfies Record<string, Interpolation<Theme>>;
4242

@@ -112,9 +112,9 @@ export const EnterpriseBadge: FC = () => {
112112
css={[
113113
styles.badge,
114114
(theme) => ({
115-
backgroundColor: theme.roles.info.background,
116-
border: `1px solid ${theme.roles.info.outline}`,
117-
color: theme.roles.info.text,
115+
backgroundColor: theme.colorRoles.info.background,
116+
border: `1px solid ${theme.colorRoles.info.outline}`,
117+
color: theme.colorRoles.info.text,
118118
}),
119119
]}
120120
>
@@ -129,9 +129,9 @@ export const PremiumBadge: FC = () => {
129129
css={[
130130
styles.badge,
131131
(theme) => ({
132-
backgroundColor: theme.roles.info.background,
133-
border: `1px solid ${theme.roles.info.outline}`,
134-
color: theme.roles.info.text,
132+
backgroundColor: theme.colorRoles.info.background,
133+
border: `1px solid ${theme.colorRoles.info.outline}`,
134+
color: theme.colorRoles.info.text,
135135
}),
136136
]}
137137
>
@@ -146,9 +146,9 @@ export const PreviewBadge: FC = () => {
146146
css={[
147147
styles.badge,
148148
(theme) => ({
149-
border: `1px solid ${theme.roles.preview.outline}`,
150-
backgroundColor: theme.roles.preview.background,
151-
color: theme.roles.preview.text,
149+
border: `1px solid ${theme.colorRoles.preview.outline}`,
150+
backgroundColor: theme.colorRoles.preview.background,
151+
color: theme.colorRoles.preview.text,
152152
}),
153153
]}
154154
>
@@ -163,9 +163,9 @@ export const AlphaBadge: FC = () => {
163163
css={[
164164
styles.badge,
165165
(theme) => ({
166-
border: `1px solid ${theme.roles.preview.outline}`,
167-
backgroundColor: theme.roles.preview.background,
168-
color: theme.roles.preview.text,
166+
border: `1px solid ${theme.colorRoles.preview.outline}`,
167+
backgroundColor: theme.colorRoles.preview.background,
168+
color: theme.colorRoles.preview.text,
169169
}),
170170
]}
171171
>
@@ -180,9 +180,9 @@ export const DeprecatedBadge: FC = () => {
180180
css={[
181181
styles.badge,
182182
(theme) => ({
183-
border: `1px solid ${theme.roles.danger.outline}`,
184-
backgroundColor: theme.roles.danger.background,
185-
color: theme.roles.danger.text,
183+
border: `1px solid ${theme.colorRoles.danger.outline}`,
184+
backgroundColor: theme.colorRoles.danger.background,
185+
color: theme.colorRoles.danger.text,
186186
}),
187187
]}
188188
>

site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -108,10 +108,10 @@ export const DeleteDialog: FC<DeleteDialogProps> = ({
108108

109109
const styles = {
110110
callout: (theme) => ({
111-
backgroundColor: theme.roles.danger.background,
112-
border: `1px solid ${theme.roles.danger.outline}`,
111+
backgroundColor: theme.colorRoles.danger.background,
112+
border: `1px solid ${theme.colorRoles.danger.outline}`,
113113
borderRadius: theme.shape.borderRadius,
114-
color: theme.roles.danger.text,
114+
color: theme.colorRoles.danger.text,
115115
padding: "8px 16px",
116116
}),
117117
} satisfies Record<string, Interpolation<Theme>>;

site/src/components/Dialogs/Dialog.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -74,24 +74,24 @@ export const DialogActionButtons: FC<DialogActionButtonsProps> = ({
7474
const styles = {
7575
dangerButton: (theme) => ({
7676
"&.MuiButton-contained": {
77-
backgroundColor: theme.roles.danger.fill.solid,
78-
borderColor: theme.roles.danger.fill.outline,
77+
backgroundColor: theme.colorRoles.danger.fill.solid,
78+
borderColor: theme.colorRoles.danger.fill.outline,
7979

8080
"&:not(.MuiLoadingButton-loading)": {
81-
color: theme.roles.danger.fill.text,
81+
color: theme.colorRoles.danger.fill.text,
8282
},
8383

8484
"&:hover:not(:disabled)": {
85-
backgroundColor: theme.roles.danger.hover.fill.solid,
86-
borderColor: theme.roles.danger.hover.fill.outline,
85+
backgroundColor: theme.colorRoles.danger.hover.fill.solid,
86+
borderColor: theme.colorRoles.danger.hover.fill.outline,
8787
},
8888

8989
"&.Mui-disabled": {
90-
backgroundColor: theme.roles.danger.disabled.background,
91-
borderColor: theme.roles.danger.disabled.outline,
90+
backgroundColor: theme.colorRoles.danger.disabled.background,
91+
borderColor: theme.colorRoles.danger.disabled.outline,
9292

9393
"&:not(.MuiLoadingButton-loading)": {
94-
color: theme.roles.danger.disabled.fill.text,
94+
color: theme.colorRoles.danger.disabled.fill.text,
9595
},
9696
},
9797
},

site/src/components/HelpTooltip/HelpTooltip.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -206,7 +206,7 @@ const styles = {
206206
display: "flex",
207207
alignItems: "center",
208208
...(theme.typography.body2 as CSSObject),
209-
color: theme.roles.active.fill.outline,
209+
color: theme.colorRoles.active.fill.outline,
210210
}),
211211

212212
linkIcon: {

site/src/components/InfoTooltip/InfoTooltip.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
HelpTooltipTrigger,
99
} from "components/HelpTooltip/HelpTooltip";
1010
import type { FC, ReactNode } from "react";
11-
import type { ThemeRole } from "theme/roles";
11+
import type { ThemeRole } from "theme/colorRoles";
1212

1313
interface InfoTooltipProps {
1414
type?: ThemeRole;
@@ -22,7 +22,7 @@ export const InfoTooltip: FC<InfoTooltipProps> = ({
2222
type = "info",
2323
}) => {
2424
const theme = useTheme();
25-
const iconColor = theme.roles[type].outline;
25+
const iconColor = theme.colorRoles[type].outline;
2626

2727
return (
2828
<HelpTooltip>

site/src/components/LastSeen/LastSeen.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,13 @@ export const LastSeen: FC<LastSeenProps> = ({ at, ...attrs }) => {
2323
// Since the agent reports on a 10m interval,
2424
// the last_used_at can be inaccurate when recent.
2525
message = "Now";
26-
color = theme.roles.success.fill.solid;
26+
color = theme.colorRoles.success.fill.solid;
2727
} else if (t.isAfter(now.subtract(3, "day"))) {
2828
color = theme.experimental.l2.text;
2929
} else if (t.isAfter(now.subtract(1, "month"))) {
30-
color = theme.roles.warning.fill.solid;
30+
color = theme.colorRoles.warning.fill.solid;
3131
} else if (t.isAfter(now.subtract(100, "year"))) {
32-
color = theme.roles.error.fill.solid;
32+
color = theme.colorRoles.error.fill.solid;
3333
} else {
3434
message = "Never";
3535
}

site/src/components/Logs/LogLine.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -43,29 +43,29 @@ const styles = {
4343
padding: `0 var(--log-line-side-padding, ${DEFAULT_LOG_LINE_SIDE_PADDING}px)`,
4444

4545
"&.error": {
46-
backgroundColor: theme.roles.error.background,
47-
color: theme.roles.error.text,
46+
backgroundColor: theme.colorRoles.error.background,
47+
color: theme.colorRoles.error.text,
4848

4949
"& .dashed-line": {
50-
backgroundColor: theme.roles.error.outline,
50+
backgroundColor: theme.colorRoles.error.outline,
5151
},
5252
},
5353

5454
"&.debug": {
55-
backgroundColor: theme.roles.info.background,
56-
color: theme.roles.info.text,
55+
backgroundColor: theme.colorRoles.info.background,
56+
color: theme.colorRoles.info.text,
5757

5858
"& .dashed-line": {
59-
backgroundColor: theme.roles.info.outline,
59+
backgroundColor: theme.colorRoles.info.outline,
6060
},
6161
},
6262

6363
"&.warn": {
64-
backgroundColor: theme.roles.warning.background,
65-
color: theme.roles.warning.text,
64+
backgroundColor: theme.colorRoles.warning.background,
65+
color: theme.colorRoles.warning.text,
6666

6767
"& .dashed-line": {
68-
backgroundColor: theme.roles.warning.outline,
68+
backgroundColor: theme.colorRoles.warning.outline,
6969
},
7070
},
7171
}),

site/src/components/PaginationWidget/PageButtons.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -74,14 +74,14 @@ const BasePageButton: FC<BasePageButtonProps> = ({
7474
<Button
7575
css={
7676
highlighted && {
77-
borderColor: theme.roles.active.outline,
78-
backgroundColor: theme.roles.active.background,
77+
borderColor: theme.colorRoles.active.outline,
78+
backgroundColor: theme.colorRoles.active.background,
7979

8080
// Override the hover state with active colors, but not hover
8181
// colors because clicking won't do anything.
8282
"&:hover": {
83-
borderColor: theme.roles.active.outline,
84-
backgroundColor: theme.roles.active.background,
83+
borderColor: theme.colorRoles.active.outline,
84+
backgroundColor: theme.colorRoles.active.background,
8585
},
8686
}
8787
}

site/src/components/Paywall/Paywall.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,8 @@ const styles = {
8181
maxWidth: 920,
8282
margin: "auto",
8383
padding: 24,
84-
backgroundImage: `linear-gradient(160deg, transparent, ${theme.roles.active.background})`,
85-
border: `1px solid ${theme.roles.active.fill.outline}`,
84+
backgroundImage: `linear-gradient(160deg, transparent, ${theme.colorRoles.active.background})`,
85+
border: `1px solid ${theme.colorRoles.active.fill.outline}`,
8686
borderRadius: 8,
8787
gap: 32,
8888
}),
@@ -115,7 +115,7 @@ const styles = {
115115
fontWeight: 500,
116116
},
117117
featureIcon: (theme) => ({
118-
color: theme.roles.active.fill.outline,
118+
color: theme.colorRoles.active.fill.outline,
119119
}),
120120
feature: {
121121
display: "flex",

site/src/components/Paywall/PopoverPaywall.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -85,8 +85,8 @@ const styles = {
8585
alignItems: "center",
8686
maxWidth: 600,
8787
padding: "24px 36px",
88-
backgroundImage: `linear-gradient(160deg, transparent, ${theme.roles.active.background})`,
89-
border: `1px solid ${theme.roles.active.fill.outline}`,
88+
backgroundImage: `linear-gradient(160deg, transparent, ${theme.colorRoles.active.background})`,
89+
border: `1px solid ${theme.colorRoles.active.fill.outline}`,
9090
borderRadius: 8,
9191
gap: 18,
9292
}),
@@ -119,7 +119,7 @@ const styles = {
119119
fontWeight: 500,
120120
},
121121
featureIcon: (theme) => ({
122-
color: theme.roles.active.fill.outline,
122+
color: theme.colorRoles.active.fill.outline,
123123
fontSize: "1.5em",
124124
}),
125125
feature: {

site/src/components/Pill/Pill.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,15 @@ import {
99
forwardRef,
1010
useMemo,
1111
} from "react";
12-
import type { ThemeRole } from "theme/roles";
12+
import type { ThemeRole } from "theme/colorRoles";
1313

1414
export type PillProps = HTMLAttributes<HTMLDivElement> & {
1515
icon?: ReactNode;
1616
type?: ThemeRole;
1717
};
1818

1919
const themeStyles = (type: ThemeRole) => (theme: Theme) => {
20-
const palette = theme.roles[type];
20+
const palette = theme.colorRoles[type];
2121
return {
2222
backgroundColor: palette.background,
2323
borderColor: palette.outline,

site/src/components/RichParameterInput/RichParameterInput.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ const styles = {
109109
},
110110
},
111111
suggestion: (theme) => ({
112-
color: theme.roles.info.fill.solid,
112+
color: theme.colorRoles.info.fill.solid,
113113
marginLeft: "-4px",
114114
padding: "4px 6px",
115115
lineHeight: "inherit",

site/src/components/StatusIndicator/StatusIndicator.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { useTheme } from "@emotion/react";
22
import type { FC } from "react";
3-
import type { ThemeRole } from "theme/roles";
3+
import type { ThemeRole } from "theme/colorRoles";
44

55
interface StatusIndicatorProps {
66
color: ThemeRole;
@@ -15,7 +15,7 @@ export const StatusIndicator: FC<StatusIndicatorProps> = ({ color }) => {
1515
height: 8,
1616
width: 8,
1717
borderRadius: 4,
18-
backgroundColor: theme.roles[color].fill.solid,
18+
backgroundColor: theme.colorRoles[color].fill.solid,
1919
}}
2020
/>
2121
);

site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -374,7 +374,7 @@ const HealthIssue: FC<PropsWithChildren> = ({ children }) => {
374374
<Stack direction="row" spacing={1} alignItems="center">
375375
<ErrorIcon
376376
css={{ width: 16, height: 16 }}
377-
htmlColor={theme.roles.error.outline}
377+
htmlColor={theme.colorRoles.error.outline}
378378
/>
379379
{children}
380380
</Stack>

site/src/modules/dashboard/LicenseBanner/LicenseBannerView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,10 @@ export const LicenseBannerView: FC<LicenseBannerViewProps> = ({
4747
display: flex;
4848
align-items: center;
4949
padding: 12px;
50-
background-color: ${theme.roles[type].background};
50+
background-color: ${theme.colorRoles[type].background};
5151
`;
5252

53-
const textColor = theme.roles[type].text;
53+
const textColor = theme.colorRoles[type].text;
5454

5555
if (messages.length === 1) {
5656
return (

site/src/modules/resources/AgentMetadata.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -238,7 +238,7 @@ const styles = {
238238
},
239239

240240
metadataValueSuccess: (theme) => ({
241-
color: theme.roles.success.fill.outline,
241+
color: theme.colorRoles.success.fill.outline,
242242
}),
243243

244244
metadataValueError: (theme) => ({

site/src/modules/resources/XRayScanAlert.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -98,13 +98,13 @@ const styles = {
9898
},
9999
},
100100
critical: (theme) => ({
101-
color: theme.roles.error.fill.solid,
101+
color: theme.colorRoles.error.fill.solid,
102102
}),
103103
high: (theme) => ({
104-
color: theme.roles.warning.fill.solid,
104+
color: theme.colorRoles.warning.fill.solid,
105105
}),
106106
medium: (theme) => ({
107-
color: theme.roles.notice.fill.solid,
107+
color: theme.colorRoles.notice.fill.solid,
108108
}),
109109
link: {
110110
marginLeft: "auto",

site/src/modules/templates/TemplateExampleCard/TemplateExampleCard.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -110,8 +110,8 @@ const styles = {
110110
}),
111111

112112
activeTag: (theme) => ({
113-
borderColor: theme.roles.active.outline,
114-
backgroundColor: theme.roles.active.background,
113+
borderColor: theme.colorRoles.active.outline,
114+
backgroundColor: theme.colorRoles.active.background,
115115
}),
116116

117117
description: (theme) => ({

0 commit comments

Comments
 (0)