sombochea/verdaccio-ui
1
0
Fork 1
mirror of https://github.com/SomboChea/ui synced 2026-01-18 00:56:00 +07:00
Code Issues Releases Wiki Activity

chore: migrate eslint@6.6.0 (#227)

Browse Source 
* chore: migrate to eslint6

* chore: migrate to eslint6
This commit is contained in:
Juan Picado @jotadeveloper
2019-10-27 15:49:30 +01:00
committed by GitHub
parent 2a2784ba39
commit e6b53c0479
31 changed files with 409 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/ActionBar/ActionBar.tsx
View File

@@ -20,7 +20,8 @@ export interface Action {
export async function downloadHandler(link: string): Promise<void> {
const fileStream: Blob = await api.request(link, 'GET', {
headers: {
['accept']: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
['accept']:
'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
},
credentials: 'include',
});

7
src/components/AutoComplete/AutoComplete.tsx
View File

@@ -140,7 +140,12 @@ const AutoComplete = ({
return (
<Wrapper>
<Autosuggest {...autosuggestProps} inputProps={inputProps} onSuggestionSelected={onClick} renderSuggestionsContainer={renderSuggestionsContainer} />
<Autosuggest
{...autosuggestProps}
inputProps={inputProps}
onSuggestionSelected={onClick}
renderSuggestionsContainer={renderSuggestionsContainer}
/>
</Wrapper>
);
};

7
src/components/AvatarTooltip/AvatarTooltip.tsx
View File

@@ -14,7 +14,12 @@ export interface AvatarDeveloper {
const AvatarTooltip: FC<AvatarDeveloper> = ({ name, packageName, version, avatar, email }) => {
const avatarComponent = <Avatar aria-label={name} src={avatar} />;
function renderLinkForMail(email: string, avatarComponent: JSX.Element, packageName: string, version: string): JSX.Element {
function renderLinkForMail(
email: string,
avatarComponent: JSX.Element,
packageName: string,
version: string
): JSX.Element {
if (!email || isEmail(email) === false) {
return avatarComponent;
}

10
src/components/DetailContainer/DetailContainerTabs.tsx
View File

@@ -14,7 +14,8 @@ const Tabs = styled(MuiTabs)({
marginBottom: 16,
});
const getTabIndex = (tabPosition: TabPosition): number => Object.keys(TabPosition).findIndex(position => position === String(tabPosition).toUpperCase());
const getTabIndex = (tabPosition: TabPosition): number =>
Object.keys(TabPosition).findIndex(position => position === String(tabPosition).toUpperCase());
const DetailContainerTabs: React.FC<Props> = ({ tabPosition, onChangeTabPosition }) => {
const [tabPositionIndex, setTabPositionIndex] = useState(0);
@@ -25,7 +26,12 @@ const DetailContainerTabs: React.FC<Props> = ({ tabPosition, onChangeTabPosition
}, [tabPosition]);
return (
<Tabs indicatorColor={'primary'} onChange={onChangeTabPosition} textColor={'primary'} value={tabPositionIndex} variant={'fullWidth'}>
<Tabs
indicatorColor={'primary'}
onChange={onChangeTabPosition}
textColor={'primary'}
value={tabPositionIndex}
variant={'fullWidth'}>
<Tab data-testid={'readme-tab'} id={'readme-tab'} label={TabPosition.README} />
<Tab data-testid={'dependencies-tab'} id={'dependencies-tab'} label={TabPosition.DEPENDENCIES} />
<Tab data-testid={'versions-tab'} id={'versions-tab'} label={TabPosition.VERSIONS} />

7
src/components/DetailSidebar/DetailSidebar.tsx
View File

@@ -14,7 +14,7 @@ import Card from '../../muiComponents/Card';
import { TitleListItem, TitleListItemText, PackageDescription, PackageVersion } from './styles';
const renderLatestDescription = (description, version, isLatest: boolean = true): JSX.Element => {
const renderLatestDescription = (description, version, isLatest = true): JSX.Element => {
return (
<>
<PackageDescription>{description}</PackageDescription>
@@ -42,7 +42,10 @@ const renderTitle = (packageName, packageVersion, packageMeta): JSX.Element => {
return (
<List className="detail-info">
<TitleListItem alignItems="flex-start" button={true}>
<TitleListItemText primary={<b>{packageName}</b>} secondary={renderLatestDescription(packageMeta.latest.description, version, isLatest)} />
<TitleListItemText
primary={<b>{packageName}</b>}
secondary={renderLatestDescription(packageMeta.latest.description, version, isLatest)}
/>
</TitleListItem>
</List>
);

16
src/components/Header/Header.test.tsx
View File

@@ -17,7 +17,11 @@ describe('<Header /> component with logged in state', () => {
test('should load the component in logged out state', () => {
const { container, queryByTestId, getByText } = render(
<Router>
<Header onLogout={headerProps.handleLogout} onToggleLoginModal={headerProps.handleToggleLoginModal} scope={headerProps.scope} />
<Header
onLogout={headerProps.handleLogout}
onToggleLoginModal={headerProps.handleToggleLoginModal}
scope={headerProps.scope}
/>
</Router>
);
@@ -46,7 +50,11 @@ describe('<Header /> component with logged in state', () => {
test('should open login dialog', async () => {
const { getByText } = render(
<Router>
<Header onLogout={headerProps.handleLogout} onToggleLoginModal={headerProps.handleToggleLoginModal} scope={headerProps.scope} />
<Header
onLogout={headerProps.handleLogout}
onToggleLoginModal={headerProps.handleToggleLoginModal}
scope={headerProps.scope}
/>
</Router>
);
@@ -131,7 +139,9 @@ describe('<Header /> component with logged in state', () => {
const closeBtn = await waitForElement(() => getByText('CLOSE'));
fireEvent.click(closeBtn);
const hasRegistrationInfoModalBeenRemoved = await waitForElementToBeRemoved(() => queryByTestId('registryInfo--dialog'));
const hasRegistrationInfoModalBeenRemoved = await waitForElementToBeRemoved(() =>
queryByTestId('registryInfo--dialog')
);
expect(hasRegistrationInfoModalBeenRemoved).toBeTruthy();
});
test.todo('autocompletion should display suggestions according to the type value');

7
src/components/Header/Header.tsx
View File

@@ -38,7 +38,12 @@ const Header: React.FC<Props> = ({ logo, withoutSearch, username, onLogout, onTo
withoutSearch={withoutSearch}
/>
</InnerNavBar>
<HeaderInfoDialog isOpen={isInfoDialogOpen} onCloseDialog={() => setOpenInfoDialog(false)} registryUrl={getRegistryURL()} scope={scope} />
<HeaderInfoDialog
isOpen={isInfoDialogOpen}
onCloseDialog={() => setOpenInfoDialog(false)}
registryUrl={getRegistryURL()}
scope={scope}
/>
</NavBar>
{showMobileNavBar && !withoutSearch && (
<MobileNavBar>

15
src/components/Header/HeaderMenu.tsx
View File

@@ -17,9 +17,20 @@ interface Props {
}
/* eslint-disable react/jsx-max-depth */
const HeaderMenu: React.FC<Props> = ({ onLogout, username, isMenuOpen = false, anchorEl, onLoggedInMenu, onLoggedInMenuClose }) => (
const HeaderMenu: React.FC<Props> = ({
onLogout,
username,
isMenuOpen = false,
anchorEl,
onLoggedInMenu,
onLoggedInMenuClose,
}) => (
<>
<IconButton color="inherit" data-testid="header--menu-acountcircle" id="header--button-account" onClick={onLoggedInMenu}>
<IconButton
color="inherit"
data-testid="header--menu-acountcircle"
id="header--button-account"
onClick={onLoggedInMenu}>
<AccountCircle />
</IconButton>
<Menu

13
src/components/Header/HeaderRight.tsx
View File

@@ -15,7 +15,14 @@ interface Props {
onLogout: () => void;
}
const HeaderRight: React.FC<Props> = ({ withoutSearch = false, username, onToggleLogin, onLogout, onToggleMobileNav, onOpenRegistryInfoDialog }) => {
const HeaderRight: React.FC<Props> = ({
withoutSearch = false,
username,
onToggleLogin,
onLogout,
onToggleMobileNav,
onOpenRegistryInfoDialog,
}) => {
const [anchorEl, setAnchorEl] = useState();
const [isMenuOpen, setIsMenuOpen] = useState();
@@ -47,7 +54,9 @@ const HeaderRight: React.FC<Props> = ({ withoutSearch = false, username, onToggl
return (
<RightSide>
{!withoutSearch && <HeaderToolTip onClick={onToggleMobileNav} title={'Search packages'} tooltipIconType={'search'} />}
{!withoutSearch && (
<HeaderToolTip onClick={onToggleMobileNav} title={'Search packages'} tooltipIconType={'search'} />
)}
<HeaderToolTip title={'Documentation'} tooltipIconType={'help'} />
<HeaderToolTip onClick={onOpenRegistryInfoDialog} title={'Registry Information'} tooltipIconType={'info'} />
{username ? (

11
src/components/Header/HeaderToolTipIcon.tsx
View File

@@ -18,7 +18,10 @@ const HeaderToolTipIcon: React.FC<Props> = ({ tooltipIconType, onClick }) => {
switch (tooltipIconType) {
case 'help':
return (
<StyledExternalLink blank={true} data-testid={'header--tooltip-documentation'} to={'https://verdaccio.org/docs/en/installation'}>
<StyledExternalLink
blank={true}
data-testid={'header--tooltip-documentation'}
to={'https://verdaccio.org/docs/en/installation'}>
<IconButton color={'inherit'}>
<Help />
</IconButton>
@@ -26,7 +29,11 @@ const HeaderToolTipIcon: React.FC<Props> = ({ tooltipIconType, onClick }) => {
);
case 'info':
return (
<IconButton color="inherit" data-testid={'header--tooltip-info'} id="header--button-registryInfo" onClick={onClick}>
<IconButton
color="inherit"
data-testid={'header--tooltip-info'}
id="header--button-registryInfo"
onClick={onClick}>
<Info />
</IconButton>
);

15
src/components/Install/InstallListItem.tsx
View File

@@ -45,21 +45,30 @@ const InstallListItem: React.FC<Interface> = ({ packageName, dependencyManager }
return (
<InstallItem button={true} data-testid={'installListItem-npm'}>
<PackageMangerAvatar alt="npm" src={npmLogo} />
<InstallListItemText primary={<CopyToClipBoard text={`npm install ${packageName}`} />} secondary={'Install using npm'} />
<InstallListItemText
primary={<CopyToClipBoard text={`npm install ${packageName}`} />}
secondary={'Install using npm'}
/>
</InstallItem>
);
case DependencyManager.YARN:
return (
<InstallItem button={true} data-testid={'installListItem-yarn'}>
<PackageMangerAvatar alt="yarn" src={yarnLogo} />
<InstallListItemText primary={<CopyToClipBoard text={`yarn add ${packageName}`} />} secondary={'Install using yarn'} />
<InstallListItemText
primary={<CopyToClipBoard text={`yarn add ${packageName}`} />}
secondary={'Install using yarn'}
/>
</InstallItem>
);
case DependencyManager.PNPM:
return (
<InstallItem button={true} data-testid={'installListItem-pnpm'}>
<PackageMangerAvatar alt={'pnpm'} src={pnpmLogo} />
<InstallListItemText primary={<CopyToClipBoard text={`pnpm install ${packageName}`} />} secondary={'Install using pnpm'} />
<InstallListItemText
primary={<CopyToClipBoard text={`pnpm install ${packageName}`} />}
secondary={'Install using pnpm'}
/>
</InstallItem>
);
default:

35
src/components/Login/Login.tsx
View File

@@ -172,7 +172,11 @@ export default class LoginModal extends Component<Partial<LoginModalProps>, Logi
}
public renderLoginError({ type, title, description }: FormError): JSX.Element | false {
return type === 'error' && <SnackbarContent className={classes.loginError} message={this.renderMessage(title, description)} />;
return (
type === 'error' && (
<SnackbarContent className={classes.loginError} message={this.renderMessage(title, description)} />
)
);
}
public renderNameField = () => {
@@ -182,8 +186,15 @@ export default class LoginModal extends Component<Partial<LoginModalProps>, Logi
return (
<FormControl error={!username.value && !username.pristine} fullWidth={true} required={username.required}>
<InputLabel htmlFor={'username'}>{'Username'}</InputLabel>
<Input id={'login--form-username'} onChange={this.handleUsernameChange} placeholder={'Your username'} value={username.value} />
{!username.value && !username.pristine && <FormHelperText id={'username-error'}>{username.helperText}</FormHelperText>}
<Input
id={'login--form-username'}
onChange={this.handleUsernameChange}
placeholder={'Your username'}
value={username.value}
/>
{!username.value && !username.pristine && (
<FormHelperText id={'username-error'}>{username.helperText}</FormHelperText>
)}
</FormControl>
);
};
@@ -201,8 +212,16 @@ export default class LoginModal extends Component<Partial<LoginModalProps>, Logi
fullWidth={true}
required={password.required}>
<InputLabel htmlFor={'password'}>{'Password'}</InputLabel>
<Input id={'login--form-password'} onChange={this.handlePasswordChange} placeholder={'Your strong password'} type={'password'} value={password.value} />
{!password.value && !password.pristine && <FormHelperText id={'password-error'}>{password.helperText}</FormHelperText>}
<Input
id={'login--form-password'}
onChange={this.handlePasswordChange}
placeholder={'Your strong password'}
type={'password'}
value={password.value}
/>
{!password.value && !password.pristine && (
<FormHelperText id={'password-error'}>{password.helperText}</FormHelperText>
)}
</FormControl>
);
};
@@ -217,7 +236,11 @@ export default class LoginModal extends Component<Partial<LoginModalProps>, Logi
<Button color={'inherit'} id={'login--form-cancel'} onClick={onCancel} type={'button'}>
{'Cancel'}
</Button>
<Button color={'inherit'} disabled={!password.value || !username.value} id={'login--form-submit'} type={'submit'}>
<Button
color={'inherit'}
disabled={!password.value || !username.value}
id={'login--form-submit'}
type={'submit'}>
{'Login'}
</Button>
</DialogActions>

9
src/components/NotFound/NotFound.tsx
View File

@@ -32,7 +32,14 @@ const NotFound: React.FC = () => {
}, [history]);
return (
<Box alignItems="center" data-testid="404" display="flex" flexDirection="column" flexGrow={1} justifyContent="center" p={2}>
<Box
alignItems="center"
data-testid="404"
display="flex"
flexDirection="column"
flexGrow={1}
justifyContent="center"
p={2}>
<EmptyPackage alt="404 - Page not found" src={PackageImg} />
<StyledHeading className="not-found-text" variant="h4">
{NOT_FOUND_TEXT}

18
src/components/Package/Package.test.tsx
View File

@@ -27,7 +27,14 @@ describe('<Package /> component', () => {
};
const wrapper = shallow(
<Package author={props.author} description={props.description} license={props.license} name={props.name} time={props.time} version={props.version} />
<Package
author={props.author}
description={props.description}
license={props.license}
name={props.name}
time={props.time}
version={props.version}
/>
);
// integration expectations
@@ -65,7 +72,14 @@ describe('<Package /> component', () => {
description: 'Private NPM repository',
};
const wrapper = shallow(
<Package author={props.author} description={props.description} license={props.license} name={props.name} time={props.time} version={props.version} />
<Package
author={props.author}
description={props.description}
license={props.license}
name={props.name}
time={props.time}
version={props.version}
/>
);
// integration expectations

9
src/components/Package/Package.tsx
View File

@@ -160,8 +160,13 @@ const Package: React.FC<PackageInterface> = ({
};
const renderPackageListItemText = (): React.ReactNode => (
// @ts-ignore
<PackageListItemText className="package-link" component="div" primary={renderPrimaryComponent()} secondary={renderSecondaryComponent()} />
<PackageListItemText
className="package-link"
// @ts-ignore
component="div"
primary={renderPrimaryComponent()}
secondary={renderSecondaryComponent()}
/>
);
return (

4
src/components/Readme/Readme.tsx
View File

@@ -3,6 +3,8 @@ import 'github-markdown-css';
import { Props } from './types';
const Readme: React.FC<Props> = ({ description }) => <div className="markdown-body" dangerouslySetInnerHTML={{ __html: description }} />;
const Readme: React.FC<Props> = ({ description }) => (
<div className="markdown-body" dangerouslySetInnerHTML={{ __html: description }} />
);
export default Readme;

7
src/components/RegistryInfoContent/RegistryInfoContent.tsx
View File

@@ -47,7 +47,12 @@ class RegistryInfoContent extends Component<Props, State> {
return (
<React.Fragment>
<Tabs indicatorColor="primary" onChange={this.handleChange} textColor="primary" value={tabPosition} variant="fullWidth">
<Tabs
indicatorColor="primary"
onChange={this.handleChange}
textColor="primary"
value={tabPosition}
variant="fullWidth">
<Tab label={NODE_MANAGER.npm} />
<Tab label={NODE_MANAGER.pnpm} />
<Tab label={NODE_MANAGER.yarn} />

5
src/components/Search/Search.tsx
View File

@@ -21,7 +21,10 @@ export interface State {
export type cancelAllSearchRequests = () => void;
export type handlePackagesClearRequested = () => void;
export type handleSearch = (event: React.FormEvent<HTMLInputElement>, { newValue, method }: ChangeEvent) => void;
export type handleClickSearch = (event: KeyboardEvent<HTMLInputElement>, { suggestionValue, method }: { suggestionValue: object[]; method: string }) => void;
export type handleClickSearch = (
event: KeyboardEvent<HTMLInputElement>,
{ suggestionValue, method }: { suggestionValue: object[]; method: string }
) => void;
export type handleFetchPackages = ({ value: string }) => Promise<void>;
export type onBlur = (event: React.FormEvent<HTMLInputElement>) => void;

4
src/components/Versions/Versions.test.tsx
View File

@@ -44,7 +44,9 @@ describe('<Version /> component', () => {
});
test('should not render versions', () => {
const { queryByText } = render(<ComponentToBeRendered contextValue={{ packageName: detailContextValue.packageName }} />);
const { queryByText } = render(
<ComponentToBeRendered contextValue={{ packageName: detailContextValue.packageName }} />
);
expect(queryByText(LABEL_VERSION_HISTORY)).toBeFalsy();
expect(queryByText(LABEL_CURRENT_TAGS)).toBeFalsy();