From 1c95a1d03324183ae46a891c02feba8d862a110b Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Sun, 10 Mar 2019 10:29:15 +0100 Subject: [PATCH 1/6] Migrate ra-ui-materialui to TypeScript - [x] auth --- packages/ra-core/src/i18n/index.ts | 6 +- packages/ra-core/src/index.ts | 1 + packages/ra-core/src/types.ts | 1 + .../src/{Link.js => Link.tsx} | 14 ++- .../src/auth/{Login.js => Login.tsx} | 108 +++++++++--------- .../src/auth/{LoginForm.js => LoginForm.tsx} | 91 ++++++++++----- .../src/auth/{Logout.js => Logout.tsx} | 91 +++++++++------ .../src/auth/{index.js => index.ts} | 0 .../src/{defaultTheme.js => defaultTheme.ts} | 0 9 files changed, 183 insertions(+), 129 deletions(-) rename packages/ra-ui-materialui/src/{Link.js => Link.tsx} (80%) rename packages/ra-ui-materialui/src/auth/{Login.js => Login.tsx} (69%) rename packages/ra-ui-materialui/src/auth/{LoginForm.js => LoginForm.tsx} (64%) rename packages/ra-ui-materialui/src/auth/{Logout.js => Logout.tsx} (54%) rename packages/ra-ui-materialui/src/auth/{index.js => index.ts} (100%) rename packages/ra-ui-materialui/src/{defaultTheme.js => defaultTheme.ts} (100%) diff --git a/packages/ra-core/src/i18n/index.ts b/packages/ra-core/src/i18n/index.ts index 932ea3efb9f..8f02471aa23 100644 --- a/packages/ra-core/src/i18n/index.ts +++ b/packages/ra-core/src/i18n/index.ts @@ -2,7 +2,11 @@ import defaultI18nProvider from './defaultI18nProvider'; import translate from './translate'; import TranslationProvider from './TranslationProvider'; -export { defaultI18nProvider, translate, TranslationProvider }; +// Alias to translate to avoid shadowed variable names error with tsling +const withTranslate = translate; + +export { defaultI18nProvider, translate, withTranslate, TranslationProvider }; export const DEFAULT_LOCALE = 'en'; export * from './TranslationUtils'; +export * from './TranslationContext'; diff --git a/packages/ra-core/src/index.ts b/packages/ra-core/src/index.ts index 1fdbc54f5bd..0422262ee4e 100644 --- a/packages/ra-core/src/index.ts +++ b/packages/ra-core/src/index.ts @@ -44,3 +44,4 @@ export { } from './reducer/admin/references/oneToMany'; export * from './sideEffect'; +export * from './types'; diff --git a/packages/ra-core/src/types.ts b/packages/ra-core/src/types.ts index b6cd11fd768..b406242d64c 100644 --- a/packages/ra-core/src/types.ts +++ b/packages/ra-core/src/types.ts @@ -57,6 +57,7 @@ export interface ReduxState { [relatedTo: string]: { ids: Identifier[]; total: number }; }; }; + loading: number; }; i18n: { locale: string; diff --git a/packages/ra-ui-materialui/src/Link.js b/packages/ra-ui-materialui/src/Link.tsx similarity index 80% rename from packages/ra-ui-materialui/src/Link.js rename to packages/ra-ui-materialui/src/Link.tsx index 2cea8130035..97d573e929c 100644 --- a/packages/ra-ui-materialui/src/Link.js +++ b/packages/ra-ui-materialui/src/Link.tsx @@ -4,12 +4,14 @@ import classNames from 'classnames'; import { Link as RRLink } from 'react-router-dom'; import { withStyles, createStyles } from '@material-ui/core/styles'; -const styles = theme => createStyles({ - link: { - textDecoration: 'none', - color: theme.palette.primary.main, - }, -}); +const styles = theme => + createStyles({ + link: { + textDecoration: 'none', + color: theme.palette.primary.main, + }, + }); + /** * @deprecated Use react-router-dom's Link instead */ diff --git a/packages/ra-ui-materialui/src/auth/Login.js b/packages/ra-ui-materialui/src/auth/Login.tsx similarity index 69% rename from packages/ra-ui-materialui/src/auth/Login.js rename to packages/ra-ui-materialui/src/auth/Login.tsx index 49fd471238c..533b2b45fa8 100644 --- a/packages/ra-ui-materialui/src/auth/Login.js +++ b/packages/ra-ui-materialui/src/auth/Login.tsx @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React, { Component, ReactElement, ComponentType } from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; import Card from '@material-ui/core/Card'; @@ -8,6 +8,7 @@ import { createMuiTheme, withStyles, createStyles, + WithStyles, } from '@material-ui/core/styles'; import LockIcon from '@material-ui/icons/Lock'; @@ -15,42 +16,38 @@ import defaultTheme from '../defaultTheme'; import Notification from '../layout/Notification'; import DefaultLoginForm from './LoginForm'; -const styles = theme => createStyles({ - main: { - display: 'flex', - flexDirection: 'column', - minHeight: '100vh', - height: '1px', - alignItems: 'center', - justifyContent: 'flex-start', - backgroundRepeat: 'no-repeat', - backgroundSize: 'cover', - }, - card: { - minWidth: 300, - marginTop: '6em', - }, - avatar: { - margin: '1em', - display: 'flex', - justifyContent: 'center', - }, - icon: { - backgroundColor: theme.palette.secondary[500], - }, -}); +interface Props { + backgroundImage: string; + className: string; + loginForm: ReactElement; + theme: object; +} -const sanitizeRestProps = ({ - array, - backgroundImage, - classes, - className, - location, - staticContext, - theme, - title, - ...rest -}) => rest; +const styles = theme => + createStyles({ + main: { + display: 'flex', + flexDirection: 'column', + minHeight: '100vh', + height: '1px', + alignItems: 'center', + justifyContent: 'flex-start', + backgroundRepeat: 'no-repeat', + backgroundSize: 'cover', + }, + card: { + minWidth: 300, + marginTop: '6em', + }, + avatar: { + margin: '1em', + display: 'flex', + justifyContent: 'center', + }, + icon: { + backgroundColor: theme.palette.secondary[500], + }, + }); /** * A standalone login page, to serve as authentication gate to the admin @@ -70,13 +67,10 @@ const sanitizeRestProps = ({ * * ); */ -class Login extends Component { - constructor(props) { - super(props); - this.theme = createMuiTheme(props.theme); - this.containerRef = React.createRef(); - this.backgroundImageLoaded = false; - } +class LoginView extends Component> { + theme = createMuiTheme(this.props.theme); + containerRef = React.createRef(); + backgroundImageLoaded = false; // Even though the React doc ensure the ref creation is done before the // componentDidMount, it can happen that the ref is set to null until the @@ -85,16 +79,12 @@ class Login extends Component { // the componentDidMount, but if the ref doesn't exist, it will try again // on the following componentDidUpdate. The try will be done only once. // @see https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element - updateBackgroundImage = (lastTry = false) => { + updateBackgroundImage = () => { if (!this.backgroundImageLoaded && this.containerRef.current) { const { backgroundImage } = this.props; this.containerRef.current.style.backgroundImage = `url(${backgroundImage})`; this.backgroundImageLoaded = true; } - - if (lastTry) { - this.backgroundImageLoaded = true; - } }; // Load background image asynchronously to speed up time to interactive @@ -114,18 +104,24 @@ class Login extends Component { componentDidUpdate() { if (!this.backgroundImageLoaded) { - this.lazyLoadBackgroundImage(true); + this.lazyLoadBackgroundImage(); } } render() { - const { classes, className, loginForm, ...rest } = this.props; + const { + backgroundImage, + classes, + className, + loginForm, + ...rest + } = this.props; return (
@@ -143,15 +139,13 @@ class Login extends Component { } } +const Login = withStyles(styles)(LoginView) as ComponentType; + Login.propTypes = { - authProvider: PropTypes.func, backgroundImage: PropTypes.string, - classes: PropTypes.object, className: PropTypes.string, - input: PropTypes.object, loginForm: PropTypes.element, - meta: PropTypes.object, - previousRoute: PropTypes.string, + theme: PropTypes.object, }; Login.defaultProps = { @@ -160,4 +154,4 @@ Login.defaultProps = { loginForm: , }; -export default withStyles(styles)(Login); +export default Login; diff --git a/packages/ra-ui-materialui/src/auth/LoginForm.js b/packages/ra-ui-materialui/src/auth/LoginForm.tsx similarity index 64% rename from packages/ra-ui-materialui/src/auth/LoginForm.js rename to packages/ra-ui-materialui/src/auth/LoginForm.tsx index 45921804797..25c574bac3f 100644 --- a/packages/ra-ui-materialui/src/auth/LoginForm.js +++ b/packages/ra-ui-materialui/src/auth/LoginForm.tsx @@ -1,26 +1,48 @@ -import React from 'react'; +import React, { SFC } from 'react'; import PropTypes from 'prop-types'; -import { Field, propTypes, reduxForm } from 'redux-form'; +import { Field, reduxForm, InjectedFormProps } from 'redux-form'; import { connect } from 'react-redux'; import compose from 'recompose/compose'; import CardActions from '@material-ui/core/CardActions'; import Button from '@material-ui/core/Button'; import TextField from '@material-ui/core/TextField'; import CircularProgress from '@material-ui/core/CircularProgress'; -import { withStyles, createStyles } from '@material-ui/core/styles'; -import { translate, userLogin } from 'ra-core'; +import { withStyles, createStyles, WithStyles } from '@material-ui/core/styles'; +import { + withTranslate, + userLogin, + TranslationContextProps, + ReduxState, +} from 'ra-core'; -const styles = () => createStyles({ - form: { - padding: '0 1em 1em 1em', - }, - input: { - marginTop: '1em', - }, - button: { - width: '100%', - }, -}); +interface Props { + redirectTo?: string; +} + +interface FormData { + username: string; + password: string; +} + +interface EnhancedProps + extends TranslationContextProps, + InjectedFormProps, + WithStyles { + isLoading: boolean; +} + +const styles = () => + createStyles({ + form: { + padding: '0 1em 1em 1em', + }, + input: { + marginTop: '1em', + }, + button: { + width: '100%', + }, + }); // see http://redux-form.com/6.4.3/examples/material-ui/ const renderInput = ({ @@ -39,7 +61,13 @@ const renderInput = ({ const login = (auth, dispatch, { redirectTo }) => dispatch(userLogin(auth, redirectTo)); -const LoginForm = ({ classes, isLoading, handleSubmit, translate }) => ( +const LoginFormView: SFC = ({ + classes, + isLoading, + handleSubmit, + translate, + ...rest +}) => (
@@ -77,30 +105,35 @@ const LoginForm = ({ classes, isLoading, handleSubmit, translate }) => ( ); -LoginForm.propTypes = { - ...propTypes, - classes: PropTypes.object, - redirectTo: PropTypes.string, -}; -const mapStateToProps = state => ({ isLoading: state.admin.loading > 0 }); +const mapStateToProps = (state: ReduxState) => ({ + isLoading: state.admin.loading > 0, +}); -const enhance = compose( +const enhance = compose( withStyles(styles), - translate, + withTranslate, connect(mapStateToProps), reduxForm({ form: 'signIn', - validate: (values, props) => { - const errors = {}; + validate: (values: FormData, props: TranslationContextProps) => { + const errors = { username: '', password: '' }; const { translate } = props; - if (!values.username) + if (!values.username) { errors.username = translate('ra.validation.required'); - if (!values.password) + } + if (!values.password) { errors.password = translate('ra.validation.required'); + } return errors; }, }) ); -export default enhance(LoginForm); +const LoginForm = enhance(LoginFormView); + +LoginForm.propTypes = { + redirectTo: PropTypes.string, +}; + +export default LoginForm; diff --git a/packages/ra-ui-materialui/src/auth/Logout.js b/packages/ra-ui-materialui/src/auth/Logout.tsx similarity index 54% rename from packages/ra-ui-materialui/src/auth/Logout.js rename to packages/ra-ui-materialui/src/auth/Logout.tsx index a5bb21d8e15..d0ecc1f3ca8 100644 --- a/packages/ra-ui-materialui/src/auth/Logout.js +++ b/packages/ra-ui-materialui/src/auth/Logout.tsx @@ -1,44 +1,64 @@ -import React from 'react'; +import React, { SFC } from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import compose from 'recompose/compose'; import MenuItem from '@material-ui/core/MenuItem'; -import { withStyles, createStyles } from '@material-ui/core/styles'; +import { + withStyles, + createStyles, + Theme, + WithStyles, +} from '@material-ui/core/styles'; import ExitIcon from '@material-ui/icons/PowerSettingsNew'; import classnames from 'classnames'; -import { translate, userLogout as userLogoutAction } from 'ra-core'; +import { + withTranslate, + userLogout as userLogoutAction, + TranslationContextProps, +} from 'ra-core'; -const styles = theme => createStyles({ - menuItem: { - color: theme.palette.text.secondary, - }, - iconMenuPaddingStyle: { - paddingRight: '1.2em', - }, - iconPaddingStyle: { - paddingRight: theme.spacing.unit, - }, -}); +interface Props { + className?: string; + redirectTo?: string; +} + +interface EnhancedProps + extends TranslationContextProps, + WithStyles { + userLogout: () => void; +} + +const styles = (theme: Theme) => + createStyles({ + menuItem: { + color: theme.palette.text.secondary, + }, + iconMenuPaddingStyle: { + paddingRight: '1.2em', + }, + iconPaddingStyle: { + paddingRight: theme.spacing.unit, + }, + }); -const sanitizeRestProps = ({ - classes, - className, - translate, - userLogout, - locale, - redirectTo, - ...rest -}) => rest; /** * Logout button component, to be passed to the Admin component * * Used for the Logout Menu item in the sidebar */ -const Logout = ({ classes, className, translate, userLogout, ...rest }) => ( +const LogoutView: SFC = ({ + classes, + className, + locale, + redirectTo, + translate, + userLogout, + ...rest +}) => ( @@ -47,14 +67,6 @@ const Logout = ({ classes, className, translate, userLogout, ...rest }) => ( ); -Logout.propTypes = { - classes: PropTypes.object, - className: PropTypes.string, - translate: PropTypes.func, - userLogout: PropTypes.func, - redirectTo: PropTypes.string, -}; - const mapStateToProps = state => ({ theme: state.theme, }); @@ -63,8 +75,8 @@ const mapDispatchToProps = (dispatch, { redirectTo }) => ({ userLogout: () => dispatch(userLogoutAction(redirectTo)), }); -const enhance = compose( - translate, +const enhance = compose( + withTranslate, connect( mapStateToProps, mapDispatchToProps @@ -72,4 +84,11 @@ const enhance = compose( withStyles(styles) ); -export default enhance(Logout); +const Logout = enhance(LogoutView); + +Logout.propTypes = { + className: PropTypes.string, + redirectTo: PropTypes.string, +}; + +export default Logout; diff --git a/packages/ra-ui-materialui/src/auth/index.js b/packages/ra-ui-materialui/src/auth/index.ts similarity index 100% rename from packages/ra-ui-materialui/src/auth/index.js rename to packages/ra-ui-materialui/src/auth/index.ts diff --git a/packages/ra-ui-materialui/src/defaultTheme.js b/packages/ra-ui-materialui/src/defaultTheme.ts similarity index 100% rename from packages/ra-ui-materialui/src/defaultTheme.js rename to packages/ra-ui-materialui/src/defaultTheme.ts From 5f8cf0765baa21e63ec9d0e360806fd712f52a84 Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Wed, 27 Mar 2019 16:40:03 +0100 Subject: [PATCH 2/6] Review + fix warnings --- packages/ra-ui-materialui/src/auth/Login.tsx | 31 ++++++++++--------- .../ra-ui-materialui/src/auth/LoginForm.tsx | 1 - 2 files changed, 17 insertions(+), 15 deletions(-) diff --git a/packages/ra-ui-materialui/src/auth/Login.tsx b/packages/ra-ui-materialui/src/auth/Login.tsx index 533b2b45fa8..5becaae1f24 100644 --- a/packages/ra-ui-materialui/src/auth/Login.tsx +++ b/packages/ra-ui-materialui/src/auth/Login.tsx @@ -15,12 +15,14 @@ import LockIcon from '@material-ui/icons/Lock'; import defaultTheme from '../defaultTheme'; import Notification from '../layout/Notification'; import DefaultLoginForm from './LoginForm'; +import { StaticContext } from 'react-router'; interface Props { - backgroundImage: string; + backgroundImage?: string; className: string; loginForm: ReactElement; theme: object; + staticContext: StaticContext; } const styles = theme => @@ -68,6 +70,19 @@ const styles = theme => * ); */ class LoginView extends Component> { + static propTypes = { + backgroundImage: PropTypes.string, + className: PropTypes.string, + loginForm: PropTypes.element, + theme: PropTypes.object, + }; + + static defaultProps = { + backgroundImage: 'https://source.unsplash.com/random/1600x900/daily', + theme: defaultTheme, + loginForm: , + }; + theme = createMuiTheme(this.props.theme); containerRef = React.createRef(); backgroundImageLoaded = false; @@ -114,6 +129,7 @@ class LoginView extends Component> { classes, className, loginForm, + staticContext, ...rest } = this.props; @@ -141,17 +157,4 @@ class LoginView extends Component> { const Login = withStyles(styles)(LoginView) as ComponentType; -Login.propTypes = { - backgroundImage: PropTypes.string, - className: PropTypes.string, - loginForm: PropTypes.element, - theme: PropTypes.object, -}; - -Login.defaultProps = { - backgroundImage: 'https://source.unsplash.com/random/1600x900/daily', - theme: defaultTheme, - loginForm: , -}; - export default Login; diff --git a/packages/ra-ui-materialui/src/auth/LoginForm.tsx b/packages/ra-ui-materialui/src/auth/LoginForm.tsx index 25c574bac3f..231ec2903c5 100644 --- a/packages/ra-ui-materialui/src/auth/LoginForm.tsx +++ b/packages/ra-ui-materialui/src/auth/LoginForm.tsx @@ -66,7 +66,6 @@ const LoginFormView: SFC = ({ isLoading, handleSubmit, translate, - ...rest }) => (
From 46ca99b9ad9489e5a71ad84dd47e4e5661085934 Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Thu, 28 Mar 2019 07:00:38 +0100 Subject: [PATCH 3/6] review 2 --- packages/ra-ui-materialui/src/auth/Login.tsx | 16 ++++++++++------ packages/ra-ui-materialui/src/auth/Logout.tsx | 11 +++-------- 2 files changed, 13 insertions(+), 14 deletions(-) diff --git a/packages/ra-ui-materialui/src/auth/Login.tsx b/packages/ra-ui-materialui/src/auth/Login.tsx index 5becaae1f24..9a611d05b05 100644 --- a/packages/ra-ui-materialui/src/auth/Login.tsx +++ b/packages/ra-ui-materialui/src/auth/Login.tsx @@ -1,4 +1,9 @@ -import React, { Component, ReactElement, ComponentType } from 'react'; +import React, { + Component, + ReactElement, + ComponentType, + HtmlHTMLAttributes, +} from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; import Card from '@material-ui/core/Card'; @@ -9,23 +14,23 @@ import { withStyles, createStyles, WithStyles, + Theme, } from '@material-ui/core/styles'; import LockIcon from '@material-ui/icons/Lock'; +import { StaticContext } from 'react-router'; import defaultTheme from '../defaultTheme'; import Notification from '../layout/Notification'; import DefaultLoginForm from './LoginForm'; -import { StaticContext } from 'react-router'; -interface Props { +interface Props extends HtmlHTMLAttributes { backgroundImage?: string; - className: string; loginForm: ReactElement; theme: object; staticContext: StaticContext; } -const styles = theme => +const styles = (theme: Theme) => createStyles({ main: { display: 'flex', @@ -72,7 +77,6 @@ const styles = theme => class LoginView extends Component> { static propTypes = { backgroundImage: PropTypes.string, - className: PropTypes.string, loginForm: PropTypes.element, theme: PropTypes.object, }; diff --git a/packages/ra-ui-materialui/src/auth/Logout.tsx b/packages/ra-ui-materialui/src/auth/Logout.tsx index d0ecc1f3ca8..584d99dbf06 100644 --- a/packages/ra-ui-materialui/src/auth/Logout.tsx +++ b/packages/ra-ui-materialui/src/auth/Logout.tsx @@ -2,7 +2,7 @@ import React, { SFC } from 'react'; import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import compose from 'recompose/compose'; -import MenuItem from '@material-ui/core/MenuItem'; +import MenuItem, { MenuItemProps } from '@material-ui/core/MenuItem'; import { withStyles, createStyles, @@ -17,8 +17,7 @@ import { TranslationContextProps, } from 'ra-core'; -interface Props { - className?: string; +interface Props extends MenuItemProps { redirectTo?: string; } @@ -67,10 +66,6 @@ const LogoutView: SFC = ({ ); -const mapStateToProps = state => ({ - theme: state.theme, -}); - const mapDispatchToProps = (dispatch, { redirectTo }) => ({ userLogout: () => dispatch(userLogoutAction(redirectTo)), }); @@ -78,7 +73,7 @@ const mapDispatchToProps = (dispatch, { redirectTo }) => ({ const enhance = compose( withTranslate, connect( - mapStateToProps, + undefined, mapDispatchToProps ), withStyles(styles) From 0f25f6ce43ed166207134a302c461560f47dfe5d Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Wed, 17 Apr 2019 10:44:38 +0200 Subject: [PATCH 4/6] Review --- packages/ra-ui-materialui/src/auth/Login.tsx | 13 ++++--------- packages/ra-ui-materialui/src/auth/Logout.tsx | 4 ++-- 2 files changed, 6 insertions(+), 11 deletions(-) diff --git a/packages/ra-ui-materialui/src/auth/Login.tsx b/packages/ra-ui-materialui/src/auth/Login.tsx index 9a611d05b05..d37f0838b65 100644 --- a/packages/ra-ui-materialui/src/auth/Login.tsx +++ b/packages/ra-ui-materialui/src/auth/Login.tsx @@ -23,7 +23,7 @@ import defaultTheme from '../defaultTheme'; import Notification from '../layout/Notification'; import DefaultLoginForm from './LoginForm'; -interface Props extends HtmlHTMLAttributes { +interface Props { backgroundImage?: string; loginForm: ReactElement; theme: object; @@ -74,7 +74,9 @@ const styles = (theme: Theme) => * * ); */ -class LoginView extends Component> { +class LoginView extends Component< + Props & WithStyles & HtmlHTMLAttributes +> { static propTypes = { backgroundImage: PropTypes.string, loginForm: PropTypes.element, @@ -91,13 +93,6 @@ class LoginView extends Component> { containerRef = React.createRef(); backgroundImageLoaded = false; - // Even though the React doc ensure the ref creation is done before the - // componentDidMount, it can happen that the ref is set to null until the - // next render. - // So, to handle this case the component will now try to load the image on - // the componentDidMount, but if the ref doesn't exist, it will try again - // on the following componentDidUpdate. The try will be done only once. - // @see https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element updateBackgroundImage = () => { if (!this.backgroundImageLoaded && this.containerRef.current) { const { backgroundImage } = this.props; diff --git a/packages/ra-ui-materialui/src/auth/Logout.tsx b/packages/ra-ui-materialui/src/auth/Logout.tsx index 584d99dbf06..3174960a7e1 100644 --- a/packages/ra-ui-materialui/src/auth/Logout.tsx +++ b/packages/ra-ui-materialui/src/auth/Logout.tsx @@ -17,7 +17,7 @@ import { TranslationContextProps, } from 'ra-core'; -interface Props extends MenuItemProps { +interface Props { redirectTo?: string; } @@ -45,7 +45,7 @@ const styles = (theme: Theme) => * * Used for the Logout Menu item in the sidebar */ -const LogoutView: SFC = ({ +const LogoutView: SFC = ({ classes, className, locale, From 3298d4222e553f4ebe4a2435b09d6d502892ac71 Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Wed, 17 Apr 2019 10:53:13 +0200 Subject: [PATCH 5/6] Renaming --- packages/ra-ui-materialui/src/auth/Login.tsx | 6 +++--- packages/ra-ui-materialui/src/auth/LoginForm.tsx | 8 ++++---- packages/ra-ui-materialui/src/auth/Logout.tsx | 8 ++++---- 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/packages/ra-ui-materialui/src/auth/Login.tsx b/packages/ra-ui-materialui/src/auth/Login.tsx index d37f0838b65..16939e709d9 100644 --- a/packages/ra-ui-materialui/src/auth/Login.tsx +++ b/packages/ra-ui-materialui/src/auth/Login.tsx @@ -74,7 +74,7 @@ const styles = (theme: Theme) => * * ); */ -class LoginView extends Component< +class Login extends Component< Props & WithStyles & HtmlHTMLAttributes > { static propTypes = { @@ -154,6 +154,6 @@ class LoginView extends Component< } } -const Login = withStyles(styles)(LoginView) as ComponentType; +const EnhancedLogin = withStyles(styles)(Login) as ComponentType; -export default Login; +export default EnhancedLogin; diff --git a/packages/ra-ui-materialui/src/auth/LoginForm.tsx b/packages/ra-ui-materialui/src/auth/LoginForm.tsx index 231ec2903c5..1e728d1a963 100644 --- a/packages/ra-ui-materialui/src/auth/LoginForm.tsx +++ b/packages/ra-ui-materialui/src/auth/LoginForm.tsx @@ -61,7 +61,7 @@ const renderInput = ({ const login = (auth, dispatch, { redirectTo }) => dispatch(userLogin(auth, redirectTo)); -const LoginFormView: SFC = ({ +const LoginForm: SFC = ({ classes, isLoading, handleSubmit, @@ -129,10 +129,10 @@ const enhance = compose( }) ); -const LoginForm = enhance(LoginFormView); +const EnhancedLoginForm = enhance(LoginForm); -LoginForm.propTypes = { +EnhancedLoginForm.propTypes = { redirectTo: PropTypes.string, }; -export default LoginForm; +export default EnhancedLoginForm; diff --git a/packages/ra-ui-materialui/src/auth/Logout.tsx b/packages/ra-ui-materialui/src/auth/Logout.tsx index 3174960a7e1..8f1260a0fc7 100644 --- a/packages/ra-ui-materialui/src/auth/Logout.tsx +++ b/packages/ra-ui-materialui/src/auth/Logout.tsx @@ -45,7 +45,7 @@ const styles = (theme: Theme) => * * Used for the Logout Menu item in the sidebar */ -const LogoutView: SFC = ({ +const Logout: SFC = ({ classes, className, locale, @@ -79,11 +79,11 @@ const enhance = compose( withStyles(styles) ); -const Logout = enhance(LogoutView); +const EnhancedLogout = enhance(Logout); -Logout.propTypes = { +EnhancedLogout.propTypes = { className: PropTypes.string, redirectTo: PropTypes.string, }; -export default Logout; +export default EnhancedLogout; From a891d9cfb70272f157b81ef2a8f1146d3a6481ca Mon Sep 17 00:00:00 2001 From: Gildas Garcia Date: Wed, 17 Apr 2019 10:55:25 +0200 Subject: [PATCH 6/6] Fix TypeScript --- packages/ra-ui-materialui/src/auth/Logout.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/ra-ui-materialui/src/auth/Logout.tsx b/packages/ra-ui-materialui/src/auth/Logout.tsx index 8f1260a0fc7..05d143d7b8f 100644 --- a/packages/ra-ui-materialui/src/auth/Logout.tsx +++ b/packages/ra-ui-materialui/src/auth/Logout.tsx @@ -70,7 +70,10 @@ const mapDispatchToProps = (dispatch, { redirectTo }) => ({ userLogout: () => dispatch(userLogoutAction(redirectTo)), }); -const enhance = compose( +const enhance = compose< + Props & EnhancedProps & MenuItemProps, + Props & MenuItemProps +>( withTranslate, connect( undefined,