diff --git a/src/components/AutoComplete/AutoComplete.tsx b/src/components/AutoComplete/AutoComplete.tsx index 7fc2eb7..64c298c 100644 --- a/src/components/AutoComplete/AutoComplete.tsx +++ b/src/components/AutoComplete/AutoComplete.tsx @@ -1,4 +1,5 @@ import React, { KeyboardEvent } from 'react'; +import { css } from 'emotion'; import Autosuggest from 'react-autosuggest'; import match from 'autosuggest-highlight/match'; import parse from 'autosuggest-highlight/parse'; @@ -53,12 +54,14 @@ const renderSuggestion = (suggestion, { query, isHighlighted }): JSX.Element =>
{parts.map((part, index) => { - return part.highlight ? ( - - {part.text} - - ) : ( - + const fw = part.highlight ? fontWeight.semiBold : fontWeight.light; + return ( + {part.text} ); diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index 4a1b30a..7c8d5b8 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -1,5 +1,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 IconButton from '@material-ui/core/IconButton'; @@ -141,7 +142,11 @@ class Header extends Component { const { withoutSearch = false } = this.props; return ( - + {this.renderLogo()} {!withoutSearch && ( diff --git a/src/components/Header/__snapshots__/Header.test.tsx.snap b/src/components/Header/__snapshots__/Header.test.tsx.snap index bc66191..91511b7 100644 --- a/src/components/Header/__snapshots__/Header.test.tsx.snap +++ b/src/components/Header/__snapshots__/Header.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`
component with logged in state should load the component in logged in state 1`] = `"
"`; +exports[`
component with logged in state should load the component in logged in state 1`] = `"
"`; -exports[`
component with logged out state should load the component in logged out state 1`] = `"
"`; +exports[`
component with logged out state should load the component in logged out state 1`] = `"
"`; diff --git a/src/components/Login/Login.tsx b/src/components/Login/Login.tsx index 9f56969..0c3f8f4 100644 --- a/src/components/Login/Login.tsx +++ b/src/components/Login/Login.tsx @@ -10,6 +10,7 @@ import InputLabel from '@material-ui/core/InputLabel'; import Input from '@material-ui/core/Input'; import FormControl from '@material-ui/core/FormControl'; import FormHelperText from '@material-ui/core/FormHelperText'; +import { css } from 'emotion'; // @ts-ignore import classes from './login.scss'; @@ -192,7 +193,13 @@ export default class LoginModal extends Component, Logi form: { password }, } = this.state; return ( - + {'Password'} {!password.value && !password.pristine && {password.helperText}} diff --git a/src/components/Login/__snapshots__/Login.test.tsx.snap b/src/components/Login/__snapshots__/Login.test.tsx.snap index 946152a..f6d361f 100644 --- a/src/components/Login/__snapshots__/Login.test.tsx.snap +++ b/src/components/Login/__snapshots__/Login.test.tsx.snap @@ -1,5 +1,5 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[` should load the component in default state 1`] = `"

Login

"`; +exports[` should load the component in default state 1`] = `"

Login

"`; -exports[` should load the component with props 1`] = `"

Login

Error Title
Error Description
"`; +exports[` should load the component with props 1`] = `"

Login

Error Title
Error Description
"`; diff --git a/src/components/Logo/Logo.tsx b/src/components/Logo/Logo.tsx index 86858da..75c52ae 100644 --- a/src/components/Logo/Logo.tsx +++ b/src/components/Logo/Logo.tsx @@ -3,7 +3,7 @@ import React from 'react'; import styled from 'react-emotion'; import logo from './img/logo.svg'; -const StyledLogo = styled.div` +const StyledLogo = styled('div')` && { display: inline-block; vertical-align: middle; diff --git a/src/components/RegistryInfoContent/RegistryInfoContent.tsx b/src/components/RegistryInfoContent/RegistryInfoContent.tsx index 2333fab..e151baf 100644 --- a/src/components/RegistryInfoContent/RegistryInfoContent.tsx +++ b/src/components/RegistryInfoContent/RegistryInfoContent.tsx @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import { css } from 'emotion'; import { Props, State } from './types'; import { CommandContainer } from './styles'; @@ -14,7 +15,12 @@ import { NODE_MANAGER } from '../../utils/constants'; function TabContainer({ children }): JSX.Element { return ( - + {children} diff --git a/src/components/Search/Search.tsx b/src/components/Search/Search.tsx index ec11715..3cf2b15 100644 --- a/src/components/Search/Search.tsx +++ b/src/components/Search/Search.tsx @@ -1,5 +1,6 @@ import React, { KeyboardEvent, Component, ReactElement } from 'react'; import { withRouter, RouteComponentProps } from 'react-router-dom'; +import { css } from 'emotion'; import { default as IconSearch } from '@material-ui/icons/Search'; import InputAdornment from '@material-ui/core/InputAdornment'; @@ -50,6 +51,28 @@ export class Search extends Component, State> { this.requestList = []; } + public render(): ReactElement { + const { suggestions, search, loaded, loading, error } = this.state; + + return ( + + ); + } + /** * Cancel all the requests which are in pending state. */ @@ -146,33 +169,15 @@ export class Search extends Component, State> { } }; - public render(): ReactElement { - const { suggestions, search, loaded, loading, error } = this.state; - - return ( - - ); - } - private requestList: AbortControllerInterface[]; public getAdorment(): JSX.Element { return ( - + ); diff --git a/src/components/Search/__snapshots__/Search.test.tsx.snap b/src/components/Search/__snapshots__/Search.test.tsx.snap index 13ad8ea..d85a010 100644 --- a/src/components/Search/__snapshots__/Search.test.tsx.snap +++ b/src/components/Search/__snapshots__/Search.test.tsx.snap @@ -1,3 +1,3 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[` component test should load the component in default state 1`] = `"
"`; +exports[` component test should load the component in default state 1`] = `"
"`;