Skip to content

Commit 11033a0

Browse files
joshrijoshri
committed
alert type error, update toastify for theme access
1 parent f55175f commit 11033a0

File tree

6 files changed

+89
-96
lines changed

6 files changed

+89
-96
lines changed

‎package-lock.json

Lines changed: 7 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@
6868
"react-query": "^3.34.7",
6969
"react-router-dom": "^5.2.0",
7070
"react-syntax-highlighter": "^15.5.0",
71-
"react-toastify": "^7.0.4",
71+
"react-toastify": "^9.1.2",
7272
"styled-components": "^5.3.0",
7373
"yaml": "^2.2.2"
7474
},

‎ui/App.tsx

Lines changed: 77 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -51,80 +51,85 @@ function withSearchParams(Cmp) {
5151
};
5252
}
5353

54-
const App = () => (
55-
<Layout>
56-
<PendoContainer />
57-
<ErrorBoundary>
58-
<Switch>
59-
<Route exact path={V2Routes.Automations} component={Automations} />
60-
<Route
61-
path={V2Routes.Kustomization}
62-
component={withSearchParams(KustomizationPage)}
63-
/>
64-
<Route path={V2Routes.Sources} component={Sources} />
65-
<Route
66-
path={V2Routes.ImageAutomation}
67-
component={ImageAutomationPage}
68-
/>
69-
<Route
70-
path={V2Routes.ImageAutomationUpdatesDetails}
71-
component={withSearchParams(ImageAutomationUpdatesDetails)}
72-
/>
73-
<Route
74-
path={V2Routes.ImageAutomationRepositoryDetails}
75-
component={withSearchParams(ImageAutomationRepoDetails)}
76-
/>
77-
<Route
78-
path={V2Routes.ImagePolicyDetails}
79-
component={withSearchParams(ImagePolicyDetails)}
80-
/>
81-
<Route path={V2Routes.FluxRuntime} component={FluxRuntime} />
82-
<Route
83-
path={V2Routes.GitRepo}
84-
component={withSearchParams(GitRepositoryDetail)}
85-
/>
86-
<Route
87-
path={V2Routes.HelmRepo}
88-
component={withSearchParams(HelmRepositoryDetail)}
89-
/>
90-
<Route
91-
path={V2Routes.Bucket}
92-
component={withSearchParams(BucketDetail)}
93-
/>
94-
<Route
95-
path={V2Routes.HelmRelease}
96-
component={withSearchParams(HelmReleasePage)}
97-
/>
98-
<Route
99-
path={V2Routes.HelmChart}
100-
component={withSearchParams(HelmChartDetail)}
101-
/>
102-
<Route
103-
path={V2Routes.OCIRepository}
104-
component={withSearchParams(OCIRepositoryPage)}
105-
/>
106-
<Route
107-
path={V2Routes.Notifications}
108-
component={withSearchParams(Notifications)}
109-
/>
110-
<Route
111-
path={V2Routes.Provider}
112-
component={withSearchParams(ProviderPage)}
113-
/>
114-
<Route path={V2Routes.UserInfo} component={UserInfo} />
54+
const App = () => {
55+
const { settings } = React.useContext(AppContext);
56+
const dark = settings.theme === "dark";
57+
return (
58+
<Layout>
59+
<PendoContainer />
60+
<ErrorBoundary>
61+
<Switch>
62+
<Route exact path={V2Routes.Automations} component={Automations} />
63+
<Route
64+
path={V2Routes.Kustomization}
65+
component={withSearchParams(KustomizationPage)}
66+
/>
67+
<Route path={V2Routes.Sources} component={Sources} />
68+
<Route
69+
path={V2Routes.ImageAutomation}
70+
component={ImageAutomationPage}
71+
/>
72+
<Route
73+
path={V2Routes.ImageAutomationUpdatesDetails}
74+
component={withSearchParams(ImageAutomationUpdatesDetails)}
75+
/>
76+
<Route
77+
path={V2Routes.ImageAutomationRepositoryDetails}
78+
component={withSearchParams(ImageAutomationRepoDetails)}
79+
/>
80+
<Route
81+
path={V2Routes.ImagePolicyDetails}
82+
component={withSearchParams(ImagePolicyDetails)}
83+
/>
84+
<Route path={V2Routes.FluxRuntime} component={FluxRuntime} />
85+
<Route
86+
path={V2Routes.GitRepo}
87+
component={withSearchParams(GitRepositoryDetail)}
88+
/>
89+
<Route
90+
path={V2Routes.HelmRepo}
91+
component={withSearchParams(HelmRepositoryDetail)}
92+
/>
93+
<Route
94+
path={V2Routes.Bucket}
95+
component={withSearchParams(BucketDetail)}
96+
/>
97+
<Route
98+
path={V2Routes.HelmRelease}
99+
component={withSearchParams(HelmReleasePage)}
100+
/>
101+
<Route
102+
path={V2Routes.HelmChart}
103+
component={withSearchParams(HelmChartDetail)}
104+
/>
105+
<Route
106+
path={V2Routes.OCIRepository}
107+
component={withSearchParams(OCIRepositoryPage)}
108+
/>
109+
<Route
110+
path={V2Routes.Notifications}
111+
component={withSearchParams(Notifications)}
112+
/>
113+
<Route
114+
path={V2Routes.Provider}
115+
component={withSearchParams(ProviderPage)}
116+
/>
117+
<Route path={V2Routes.UserInfo} component={UserInfo} />
115118

116-
<Redirect exact from="/" to={V2Routes.Automations} />
119+
<Redirect exact from="/" to={V2Routes.Automations} />
117120

118-
<Route exact path="*" component={Error} />
119-
</Switch>
120-
</ErrorBoundary>
121-
<ToastContainer
122-
position="top-center"
123-
autoClose={5000}
124-
newestOnTop={false}
125-
/>
126-
</Layout>
127-
);
121+
<Route exact path="*" component={Error} />
122+
</Switch>
123+
</ErrorBoundary>
124+
<ToastContainer
125+
position="top-center"
126+
autoClose={5000}
127+
newestOnTop={false}
128+
theme={dark ? "dark" : "light"}
129+
/>
130+
</Layout>
131+
);
132+
};
128133

129134
const StylesProvider = ({ children }) => {
130135
const { settings } = React.useContext(AppContext);

‎ui/components/Alert.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,4 @@
1-
import {
2-
AlertProps,
3-
AlertTitle,
4-
Alert as MaterialAlert,
5-
} from "@material-ui/lab";
1+
import { AlertTitle, Alert as MaterialAlert } from "@material-ui/lab";
62
import * as React from "react";
73
import styled from "styled-components";
84
import Flex from "./Flex";
@@ -11,7 +7,7 @@ import Text from "./Text";
117
/** Alert Properties */
128
export interface Props {
139
/** string of one of the colors from our `MuiTheme` - also sets the corresponding material icon - see /ui/lib/theme.ts and https://mui.com/customization/theming/ */
14-
severity?: AlertProps["severity"];
10+
severity?: "error" | "info" | "success" | "warning";
1511
/** Overrides `justify-content: flex-start` (left) to render the Alert in the center of it's 100% width `<Flex />` component */
1612
center?: boolean;
1713
/** text for Mui's `<AlertTitle />` component */

‎ui/components/__tests__/__snapshots__/YamlView.test.tsx.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@ exports[`YamlView snapshots renders 1`] = `
7575
}
7676
7777
.c3.MuiButton-outlinedPrimary {
78-
border: 1px solid #f5f5f5;
78+
margin-left: 4px;
7979
padding: 4px;
8080
}
8181
@@ -86,7 +86,7 @@ exports[`YamlView snapshots renders 1`] = `
8686
}
8787
8888
.c1 {
89-
background: #f5f5f5;
89+
background: #F6F7F9;
9090
padding: 12px;
9191
width: 100%;
9292
border-bottom: 1px solid #d8d8d8;

‎ui/lib/theme.ts

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -215,14 +215,6 @@ export const GlobalStyle = createGlobalStyle`
215215
background-color: ${(props) => props.theme.colors.primary};
216216
}
217217
}
218-
//toastify
219-
:root {
220-
${(props) =>
221-
`--toastify-color-info: ${props.theme.colors.primary};
222-
--toastify-color-success: ${props.theme.colors.successLight};
223-
--toastify-color-warning: ${props.theme.colors.feedbackLight};
224-
--toastify-color-error: ${props.theme.colors.alertLight};`}
225-
}
226218
`;
227219

228220
export const muiTheme = (colors) =>

0 commit comments

Comments
 (0)