Skip to content

Commit

Permalink
Updates material-ui and react npm libraries (#630)
Browse files Browse the repository at this point in the history 
* Updates material-ui and react npm libraries

* Update failing BusyButton snapshots

* Reduce material-ui version to 3.7.1 to avoid known issue with 3.8.1
  • Loading branch information
@rileyjbauer @k8s-ci-robot
rileyjbauer authored and k8s-ci-robot committed Jan 5, 2019
1 parent 5912488 commit 2158d23
Show file tree
Hide file tree
Showing 20 changed files with 5,745 additions and 6,093 deletions.
4,656 changes: 1,968 additions & 2,688 deletions frontend/package-lock.json
View file

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions frontend/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/core": "^3.1.0",
"@material-ui/core": "3.7.1",
"@material-ui/icons": "^3.0.1",
"@types/js-yaml": "^3.11.2",
"codemirror": "^5.40.2",
Expand All @@ -15,7 +15,7 @@
"js-yaml": "^3.12.0",
"portable-fetch": "^3.0.0",
"re-resizable": "^4.9.0",
"react": "^16.5.2",
"react": "^16.7.0",
"react-codemirror2": "^5.1.0",
"react-dom": "^16.5.2",
"react-dropzone": "^5.1.0",
Expand Down Expand Up @@ -60,7 +60,7 @@
"@types/js-yaml": "^3.11.2",
"@types/lodash": "^4.14.117",
"@types/node": "^10.10.1",
"@types/react": "^16.4.14",
"@types/react": "^16.7.18",
"@types/react-dom": "^16.0.7",
"@types/react-router-dom": "^4.3.1",
"@types/react-test-renderer": "^16.0.2",
Expand Down
6 changes: 3 additions & 3 deletions frontend/server/package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

15 changes: 8 additions & 7 deletions frontend/src/Css.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,6 @@ const palette = {
export const theme = createMuiTheme({
overrides: {
MuiButton: {
disabled: {
backgroundColor: 'initial',
},
flat: {
fontSize: fontsize.base,
fontWeight: 'bold',
Expand All @@ -105,6 +102,9 @@ export const theme = createMuiTheme({
color: color.theme,
},
root: {
'&$disabled': {
backgroundColor: 'initial',
},
color: color.theme,
marginRight: 10,
padding: '0 8px'
Expand All @@ -130,11 +130,11 @@ export const theme = createMuiTheme({
marginLeft: 0,
marginTop: 0,
},
focused: {
marginLeft: 0,
marginTop: 0,
},
root: {
'&$focused': {
marginLeft: 0,
marginTop: 0,
},
fontSize: fontsize.base,
marginLeft: 5,
marginTop: -8,
Expand Down Expand Up @@ -167,6 +167,7 @@ export const theme = createMuiTheme({
typography: {
fontFamily: fonts.main,
fontSize: fontsize.base + ' !important' as any,
useNextVariants: true,
},
});

Expand Down
4 changes: 2 additions & 2 deletions frontend/src/atoms/Input.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,12 @@ describe('Input', () => {
const value = 'some input value';

it('renders with the right styles by default', () => {
const tree = shallow(<Input onChange={handleChange('fieldname')} value={value} />);
const tree = shallow(<Input onChange={handleChange('fieldname')} value={value} variant='outlined' />);
expect(toJson(tree)).toMatchSnapshot();
});

it('accepts height and width as prop overrides', () => {
const tree = shallow(<Input height={123} width={456} onChange={handleChange('fieldname')} value={value} />);
const tree = shallow(<Input height={123} width={456} onChange={handleChange('fieldname')} value={value} variant='outlined' />);
expect(toJson(tree)).toMatchSnapshot();
});
});
8 changes: 4 additions & 4 deletions frontend/src/atoms/Input.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,18 +15,18 @@
*/

import * as React from 'react';
import TextField, { TextFieldProps } from '@material-ui/core/TextField';
import TextField, { OutlinedTextFieldProps } from '@material-ui/core/TextField';
import { commonCss } from '../Css';

interface InputProps extends TextFieldProps {
interface InputProps extends OutlinedTextFieldProps {
height?: number | string;
width?: number;
}

export default (props: InputProps) => {
const { height, width, ...rest } = props;
const { height, variant, width, ...rest } = props;
return (
<TextField variant='outlined' className={commonCss.textField} spellCheck={false}
<TextField variant={variant} className={commonCss.textField} spellCheck={false}
style={{
height: !!props.multiline ? 'auto' : (height || 40),
maxWidth: 600,
Expand Down
5 changes: 5 additions & 0 deletions frontend/src/atoms/__snapshots__/BusyButton.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ exports[`BusyButton renders a primary outlined buton 1`] = `
className="MuiButtonBase-root-27 MuiButton-root-1 MuiButton-text-3 MuiButton-textPrimary-4 MuiButton-flat-6 MuiButton-flatPrimary-7 root"
disabled={false}
onBlur={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand Down Expand Up @@ -35,6 +36,7 @@ exports[`BusyButton renders disabled 1`] = `
className="MuiButtonBase-root-27 MuiButtonBase-disabled-28 MuiButton-root-1 MuiButton-text-3 MuiButton-textSecondary-5 MuiButton-flat-6 MuiButton-flatSecondary-8 MuiButton-disabled-21 root"
disabled={true}
onBlur={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand Down Expand Up @@ -78,6 +80,7 @@ exports[`BusyButton renders with a title and icon 1`] = `
className="MuiButtonBase-root-27 MuiButton-root-1 MuiButton-text-3 MuiButton-textSecondary-5 MuiButton-flat-6 MuiButton-flatSecondary-8 root"
disabled={false}
onBlur={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand Down Expand Up @@ -124,6 +127,7 @@ exports[`BusyButton renders with a title and icon, and busy 1`] = `
className="MuiButtonBase-root-27 MuiButtonBase-disabled-28 MuiButton-root-1 MuiButton-text-3 MuiButton-textSecondary-5 MuiButton-flat-6 MuiButton-flatSecondary-8 MuiButton-disabled-21 root rootBusy"
disabled={true}
onBlur={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand Down Expand Up @@ -192,6 +196,7 @@ exports[`BusyButton renders with just a title 1`] = `
className="MuiButtonBase-root-27 MuiButton-root-1 MuiButton-text-3 MuiButton-textSecondary-5 MuiButton-flat-6 MuiButton-flatSecondary-8 root"
disabled={false}
onBlur={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand Down
116 changes: 64 additions & 52 deletions frontend/src/atoms/__snapshots__/MD2Tabs.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -111,6 +111,7 @@ exports[`Input gracefully handles an out of bound selectedTab value 1`] = `
disabled={false}
onBlur={[Function]}
onClick={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand All @@ -130,37 +131,42 @@ exports[`Input gracefully handles an out of bound selectedTab value 1`] = `
tab1
</span>
</span>
<WithStyles(TouchRipple)
center={false}
innerRef={[Function]}
<NoSsr
defer={false}
fallback={null}
>
<TouchRipple
<WithStyles(TouchRipple)
center={false}
classes={
Object {
"child": "MuiTouchRipple-child-34",
"childLeaving": "MuiTouchRipple-childLeaving-35",
"childPulsate": "MuiTouchRipple-childPulsate-36",
"ripple": "MuiTouchRipple-ripple-31",
"ripplePulsate": "MuiTouchRipple-ripplePulsate-33",
"rippleVisible": "MuiTouchRipple-rippleVisible-32",
"root": "MuiTouchRipple-root-30",
}
}
innerRef={[Function]}
>
<TransitionGroup
childFactory={[Function]}
className="MuiTouchRipple-root-30"
component="span"
enter={true}
exit={true}
<TouchRipple
center={false}
classes={
Object {
"child": "MuiTouchRipple-child-34",
"childLeaving": "MuiTouchRipple-childLeaving-35",
"childPulsate": "MuiTouchRipple-childPulsate-36",
"ripple": "MuiTouchRipple-ripple-31",
"ripplePulsate": "MuiTouchRipple-ripplePulsate-33",
"rippleVisible": "MuiTouchRipple-rippleVisible-32",
"root": "MuiTouchRipple-root-30",
}
}
>
<span
<TransitionGroup
childFactory={[Function]}
className="MuiTouchRipple-root-30"
/>
</TransitionGroup>
</TouchRipple>
</WithStyles(TouchRipple)>
component="span"
enter={true}
exit={true}
>
<span
className="MuiTouchRipple-root-30"
/>
</TransitionGroup>
</TouchRipple>
</WithStyles(TouchRipple)>
</NoSsr>
</button>
</ButtonBase>
</WithStyles(ButtonBase)>
Expand Down Expand Up @@ -248,6 +254,7 @@ exports[`Input gracefully handles an out of bound selectedTab value 1`] = `
disabled={false}
onBlur={[Function]}
onClick={[Function]}
onContextMenu={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
Expand All @@ -267,37 +274,42 @@ exports[`Input gracefully handles an out of bound selectedTab value 1`] = `
tab2
</span>
</span>
<WithStyles(TouchRipple)
center={false}
innerRef={[Function]}
<NoSsr
defer={false}
fallback={null}
>
<TouchRipple
<WithStyles(TouchRipple)
center={false}
classes={
Object {
"child": "MuiTouchRipple-child-34",
"childLeaving": "MuiTouchRipple-childLeaving-35",
"childPulsate": "MuiTouchRipple-childPulsate-36",
"ripple": "MuiTouchRipple-ripple-31",
"ripplePulsate": "MuiTouchRipple-ripplePulsate-33",
"rippleVisible": "MuiTouchRipple-rippleVisible-32",
"root": "MuiTouchRipple-root-30",
}
}
innerRef={[Function]}
>
<TransitionGroup
childFactory={[Function]}
className="MuiTouchRipple-root-30"
component="span"
enter={true}
exit={true}
<TouchRipple
center={false}
classes={
Object {
"child": "MuiTouchRipple-child-34",
"childLeaving": "MuiTouchRipple-childLeaving-35",
"childPulsate": "MuiTouchRipple-childPulsate-36",
"ripple": "MuiTouchRipple-ripple-31",
"ripplePulsate": "MuiTouchRipple-ripplePulsate-33",
"rippleVisible": "MuiTouchRipple-rippleVisible-32",
"root": "MuiTouchRipple-root-30",
}
}
>
<span
<TransitionGroup
childFactory={[Function]}
className="MuiTouchRipple-root-30"
/>
</TransitionGroup>
</TouchRipple>
</WithStyles(TouchRipple)>
component="span"
enter={true}
exit={true}
>
<span
className="MuiTouchRipple-root-30"
/>
</TransitionGroup>
</TouchRipple>
</WithStyles(TouchRipple)>
</NoSsr>
</button>
</ButtonBase>
</WithStyles(ButtonBase)>
Expand Down
Loading

0 comments on commit 2158d23

Please sign in to comment.