Replaced React.Fragment shorthands with elements
This commit is contained in:
@@ -29,6 +29,7 @@
|
||||
"react/no-array-index-key": 0,
|
||||
"react/forbid-prop-types": 0,
|
||||
"react/prop-types": [2, { "skipUndeclared": true }],
|
||||
"react/jsx-fragments": [2, "element"],
|
||||
"react/state-in-constructor": 0,
|
||||
"react/jsx-props-no-spreading": 0,
|
||||
"jsx-a11y/click-events-have-key-events": 0
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
|
||||
import NormalizeStyles from './NormalizeStyles';
|
||||
import BaseStyles from './BaseStyles';
|
||||
@@ -11,12 +11,12 @@ import Routes from './Routes';
|
||||
import './fontStyles.css';
|
||||
|
||||
const App = () => (
|
||||
<>
|
||||
<Fragment>
|
||||
<NormalizeStyles />
|
||||
<BaseStyles />
|
||||
<Toast />
|
||||
<Routes />
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
export default App;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { Avatar, Select, Icon } from 'shared/components';
|
||||
@@ -18,7 +18,7 @@ const ProjectBoardIssueDetailsAssigneesReporter = ({ issue, updateIssue, project
|
||||
const userOptions = projectUsers.map(user => ({ value: user.id, label: user.name }));
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Assignees</SectionTitle>
|
||||
<Select
|
||||
isMulti
|
||||
@@ -49,7 +49,7 @@ const ProjectBoardIssueDetailsAssigneesReporter = ({ issue, updateIssue, project
|
||||
renderValue={({ value: userId }) => renderUser(getUserById(userId), true)}
|
||||
renderOption={({ value: userId }) => renderUser(getUserById(userId))}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useRef } from 'react';
|
||||
import React, { Fragment, useRef } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { Textarea } from 'shared/components';
|
||||
@@ -29,7 +29,7 @@ const ProjectBoardIssueDetailsCommentsBodyForm = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<Textarea
|
||||
autoFocus
|
||||
placeholder="Add a comment..."
|
||||
@@ -45,7 +45,7 @@ const ProjectBoardIssueDetailsCommentsBodyForm = ({
|
||||
Cancel
|
||||
</FormButton>
|
||||
</Actions>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import api from 'shared/utils/api';
|
||||
@@ -65,7 +65,7 @@ const ProjectBoardIssueDetailsComment = ({ comment, fetchIssue }) => {
|
||||
onCancel={() => setFormOpen(false)}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<Fragment>
|
||||
<Body>{comment.body}</Body>
|
||||
<EditLink onClick={() => setFormOpen(true)}>Edit</EditLink>
|
||||
<ConfirmModal
|
||||
@@ -75,7 +75,7 @@ const ProjectBoardIssueDetailsComment = ({ comment, fetchIssue }) => {
|
||||
onConfirm={handleCommentDelete}
|
||||
renderLink={modal => <DeleteLink onClick={modal.open}>Delete</DeleteLink>}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
</Content>
|
||||
</Comment>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import api from 'shared/utils/api';
|
||||
@@ -47,10 +47,10 @@ const ProjectBoardIssueDetailsCommentsCreate = ({ issueId, fetchIssue }) => {
|
||||
onCancel={() => setFormOpen(false)}
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<Fragment>
|
||||
<FakeTextarea onClick={() => setFormOpen(true)}>Add a comment...</FakeTextarea>
|
||||
<ProTip setFormOpen={setFormOpen} />
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
</Right>
|
||||
</Create>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { getTextContentsFromHtmlString } from 'shared/utils/browser';
|
||||
@@ -23,10 +23,10 @@ const ProjectBoardIssueDetailsDescription = ({ issue, updateIssue }) => {
|
||||
const isDescriptionEmpty = getTextContentsFromHtmlString(description).trim().length === 0;
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<Title>Description</Title>
|
||||
{isEditing ? (
|
||||
<>
|
||||
<Fragment>
|
||||
<TextEditor
|
||||
placeholder="Describe the issue"
|
||||
defaultValue={description}
|
||||
@@ -40,17 +40,17 @@ const ProjectBoardIssueDetailsDescription = ({ issue, updateIssue }) => {
|
||||
Cancel
|
||||
</Button>
|
||||
</Actions>
|
||||
</>
|
||||
</Fragment>
|
||||
) : (
|
||||
<>
|
||||
<Fragment>
|
||||
{isDescriptionEmpty ? (
|
||||
<EmptyLabel onClick={() => setEditing(true)}>Add a description...</EmptyLabel>
|
||||
) : (
|
||||
<TextEditedContent content={description} onClick={() => setEditing(true)} />
|
||||
)}
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { isNil } from 'lodash';
|
||||
|
||||
@@ -22,7 +22,7 @@ const propTypes = {
|
||||
};
|
||||
|
||||
const ProjectBoardIssueDetailsEstimateTracking = ({ issue, updateIssue }) => (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Original Estimate (hours)</SectionTitle>
|
||||
{renderHourInput('estimate', issue, updateIssue)}
|
||||
|
||||
@@ -57,7 +57,7 @@ const ProjectBoardIssueDetailsEstimateTracking = ({ issue, updateIssue }) => (
|
||||
</ModalContents>
|
||||
)}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
const renderHourInput = (fieldName, issue, updateIssue) => (
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { IssuePriority, IssuePriorityCopy } from 'shared/constants/issues';
|
||||
@@ -13,7 +13,7 @@ const propTypes = {
|
||||
};
|
||||
|
||||
const ProjectBoardIssueDetailsPriority = ({ issue, updateIssue }) => (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Priority</SectionTitle>
|
||||
<Select
|
||||
variant="empty"
|
||||
@@ -29,7 +29,7 @@ const ProjectBoardIssueDetailsPriority = ({ issue, updateIssue }) => (
|
||||
renderValue={({ value: priority }) => renderPriorityItem(priority, true)}
|
||||
renderOption={({ value: priority }) => renderPriorityItem(priority)}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
const renderPriorityItem = (priority, isValue) => (
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { IssueStatus, IssueStatusCopy } from 'shared/constants/issues';
|
||||
@@ -13,7 +13,7 @@ const propTypes = {
|
||||
};
|
||||
|
||||
const ProjectBoardIssueDetailsStatus = ({ issue, updateIssue }) => (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Status</SectionTitle>
|
||||
<Select
|
||||
variant="empty"
|
||||
@@ -36,7 +36,7 @@ const ProjectBoardIssueDetailsStatus = ({ issue, updateIssue }) => (
|
||||
<Status color={status}>{IssueStatusCopy[status]}</Status>
|
||||
)}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
|
||||
ProjectBoardIssueDetailsStatus.propTypes = propTypes;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useRef, useState } from 'react';
|
||||
import React, { Fragment, useRef, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { KeyCodes } from 'shared/constants/keyCodes';
|
||||
@@ -31,7 +31,7 @@ const ProjectBoardIssueDetailsTitle = ({ issue, updateIssue }) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<TitleTextarea
|
||||
minRows={1}
|
||||
placeholder="Short summary"
|
||||
@@ -45,7 +45,7 @@ const ProjectBoardIssueDetailsTitle = ({ issue, updateIssue }) => {
|
||||
}}
|
||||
/>
|
||||
{error && <ErrorText>{error}</ErrorText>}
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import api from 'shared/utils/api';
|
||||
@@ -55,7 +55,7 @@ const ProjectBoardIssueDetails = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<TopActions>
|
||||
<Type issue={issue} updateIssue={updateIssue} />
|
||||
<TopActionsRight>
|
||||
@@ -85,7 +85,7 @@ const ProjectBoardIssueDetails = ({
|
||||
<Dates issue={issue} />
|
||||
</Right>
|
||||
</Content>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Route, useRouteMatch, useHistory } from 'react-router-dom';
|
||||
|
||||
@@ -30,7 +30,7 @@ const ProjectBoard = ({ project, fetchProject, updateLocalProjectIssues }) => {
|
||||
const [filters, mergeFilters] = useMergeState(defaultFilters);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
<Breadcrumbs items={['Projects', project.name, 'Kanban Board']} />
|
||||
<Header />
|
||||
<Filters
|
||||
@@ -65,7 +65,7 @@ const ProjectBoard = ({ project, fetchProject, updateLocalProjectIssues }) => {
|
||||
/>
|
||||
)}
|
||||
/>
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Link } from 'react-router-dom';
|
||||
import { get } from 'lodash';
|
||||
@@ -60,17 +60,17 @@ const ProjectIssueSearch = ({ project }) => {
|
||||
</SearchInputCont>
|
||||
|
||||
{isSearchTermEmpty && recentIssues.length > 0 && (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Recent Issues</SectionTitle>
|
||||
{recentIssues.map(renderIssue)}
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
|
||||
{!isSearchTermEmpty && matchingIssues.length > 0 && (
|
||||
<>
|
||||
<Fragment>
|
||||
<SectionTitle>Matching Issues</SectionTitle>
|
||||
{matchingIssues.map(renderIssue)}
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
|
||||
{!isSearchTermEmpty && !isLoading && matchingIssues.length === 0 && (
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from 'react';
|
||||
import React, { Fragment, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { StyledConfirmModal, Title, Message, Actions, StyledButton } from './Styles';
|
||||
@@ -52,7 +52,7 @@ const ConfirmModal = ({
|
||||
withCloseIcon={false}
|
||||
renderLink={renderLink}
|
||||
renderContent={modal => (
|
||||
<>
|
||||
<Fragment>
|
||||
<Title>{title}</Title>
|
||||
{message && <Message>{message}</Message>}
|
||||
<Actions>
|
||||
@@ -67,7 +67,7 @@ const ConfirmModal = ({
|
||||
{cancelText}
|
||||
</StyledButton>
|
||||
</Actions>
|
||||
</>
|
||||
</Fragment>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState, useRef, useEffect, useCallback } from 'react';
|
||||
import React, { Fragment, useState, useRef, useEffect, useCallback } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
@@ -68,7 +68,7 @@ const Modal = ({
|
||||
}, [isOpen]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
{!isControlled && renderLink({ open: () => setStateOpen(true) })}
|
||||
|
||||
{isOpen &&
|
||||
@@ -89,7 +89,7 @@ const Modal = ({
|
||||
</ScrollOverlay>,
|
||||
$root,
|
||||
)}
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState, useRef, useLayoutEffect } from 'react';
|
||||
import React, { Fragment, useState, useRef, useLayoutEffect } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
@@ -58,7 +58,7 @@ const Tooltip = ({ className, placement, offset, width, renderLink, renderConten
|
||||
}, [isOpen, offset, placement]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Fragment>
|
||||
{renderLink({ ref: $linkRef, onClick: isOpen ? closeTooltip : openTooltip })}
|
||||
|
||||
{isOpen &&
|
||||
@@ -68,7 +68,7 @@ const Tooltip = ({ className, placement, offset, width, renderLink, renderConten
|
||||
</StyledTooltip>,
|
||||
$root,
|
||||
)}
|
||||
</>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user