From 909a8d9fb806e601cae050ea474d4c7826dbc169 Mon Sep 17 00:00:00 2001 From: Priscila Oliveira Date: Sun, 6 Oct 2019 17:17:36 +0200 Subject: [PATCH] fix: introduced forwardRef (#164) --- src/components/Header/Header.tsx | 2 +- src/components/Help/Help.tsx | 4 ++-- src/components/Help/__snapshots__/Help.test.tsx.snap | 2 +- src/components/Login/Login.tsx | 2 +- .../RegistryInfoDialog/RegistryInfoDialog.tsx | 2 +- src/muiComponents/Button/Button.tsx | 12 ++++++++++++ src/muiComponents/Button/index.ts | 1 + 7 files changed, 19 insertions(+), 6 deletions(-) create mode 100644 src/muiComponents/Button/Button.tsx create mode 100644 src/muiComponents/Button/index.ts diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index 0b35a7f..97b7ea6 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -2,7 +2,6 @@ import React, { SyntheticEvent, Component, Fragment, ReactElement } from 'react' import { Link } from 'react-router-dom'; import { css } from 'emotion'; -import Button from '@material-ui/core/Button'; import MenuItem from '@material-ui/core/MenuItem'; import Menu from '@material-ui/core/Menu'; import Info from '@material-ui/icons/Info'; @@ -19,6 +18,7 @@ import RegistryInfoContent from '../RegistryInfoContent/RegistryInfoContent'; import IconButton from '../../muiComponents/IconButton'; import Tooltip from '../../muiComponents/Tooltip'; +import Button from '../../muiComponents/Button'; import { Greetings, diff --git a/src/components/Help/Help.tsx b/src/components/Help/Help.tsx index 39eb1eb..a4deacd 100644 --- a/src/components/Help/Help.tsx +++ b/src/components/Help/Help.tsx @@ -1,4 +1,3 @@ -import Button from '@material-ui/core/Button'; import CardActions from '@material-ui/core/CardActions'; import CardContent from '@material-ui/core/CardContent'; import Typography from '@material-ui/core/Typography'; @@ -6,6 +5,7 @@ import React, { Fragment } from 'react'; import { getRegistryURL } from '../../utils/url'; import CopyToClipBoard from '../CopyToClipBoard'; +import Button from '../../muiComponents/Button'; import { CardStyled as Card, HelpTitle } from './styles'; @@ -35,7 +35,7 @@ const Help: React.FC = () => { {'3. Refresh this page.'} - diff --git a/src/components/Help/__snapshots__/Help.test.tsx.snap b/src/components/Help/__snapshots__/Help.test.tsx.snap index 1751a66..ec4515d 100644 --- a/src/components/Help/__snapshots__/Help.test.tsx.snap +++ b/src/components/Help/__snapshots__/Help.test.tsx.snap @@ -1,3 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[` component should render the component in default state 1`] = `"

No Package Published Yet.

To publish your first package just:

1. Login

npm adduser --registry http://localhost

2. Publish

npm publish --registry http://localhost

3. Refresh this page.

Learn More
"`; +exports[` component should render the component in default state 1`] = `"

No Package Published Yet.

To publish your first package just:

1. Login

npm adduser --registry http://localhost

2. Publish

npm publish --registry http://localhost

3. Refresh this page.

Learn More
"`; diff --git a/src/components/Login/Login.tsx b/src/components/Login/Login.tsx index 31f8775..d159f36 100644 --- a/src/components/Login/Login.tsx +++ b/src/components/Login/Login.tsx @@ -1,5 +1,4 @@ import React, { Component } from 'react'; -import Button from '@material-ui/core/Button'; import DialogTitle from '@material-ui/core/DialogTitle'; import Dialog from '@material-ui/core/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; @@ -13,6 +12,7 @@ import FormHelperText from '@material-ui/core/FormHelperText'; import { css } from 'emotion'; import * as classes from './styles'; +import Button from '../../muiComponents/Button'; interface FormFields { required: boolean; diff --git a/src/components/RegistryInfoDialog/RegistryInfoDialog.tsx b/src/components/RegistryInfoDialog/RegistryInfoDialog.tsx index 494fc7f..ae7ff84 100644 --- a/src/components/RegistryInfoDialog/RegistryInfoDialog.tsx +++ b/src/components/RegistryInfoDialog/RegistryInfoDialog.tsx @@ -1,10 +1,10 @@ import React from 'react'; import Dialog from '@material-ui/core/Dialog'; import DialogActions from '@material-ui/core/DialogActions'; -import Button from '@material-ui/core/Button'; import { Title, Content } from './styles'; import { Props } from './types'; +import Button from '../../muiComponents/Button'; const LABEL = 'CLOSE'; diff --git a/src/muiComponents/Button/Button.tsx b/src/muiComponents/Button/Button.tsx new file mode 100644 index 0000000..64c2c4f --- /dev/null +++ b/src/muiComponents/Button/Button.tsx @@ -0,0 +1,12 @@ +import React, { forwardRef } from 'react'; +import { default as MaterialUIButton, ButtonProps } from '@material-ui/core/Button'; + +type ButtonRef = HTMLElementTagNameMap['button']; + +/* eslint-disable verdaccio/jsx-spread */ +// eslint-disable-next-line react/display-name +const Button = forwardRef(function Button(props, ref) { + return ; +}); + +export default Button; diff --git a/src/muiComponents/Button/index.ts b/src/muiComponents/Button/index.ts new file mode 100644 index 0000000..efe8c80 --- /dev/null +++ b/src/muiComponents/Button/index.ts @@ -0,0 +1 @@ +export { default } from './Button';