yuuza/outline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: Update syntax, improve more typing (#1439)

Browse Source 
* chore: <React.Fragment> to <>

* flow types
This commit is contained in:
Tom Moor
2020-08-09 09:48:04 -07:00
committed by GitHub
parent ead55442e0
commit e2bd03494d
55 changed files with 239 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/components/Avatar/AvatarWithPresence.js
View File

@@ -40,7 +40,7 @@ class AvatarWithPresence extends React.Component<Props> {
} = this.props;
return (
<React.Fragment>
<>
<Tooltip
tooltip={
<Centered>
@@ -69,7 +69,7 @@ class AvatarWithPresence extends React.Component<Props> {
isOpen={this.isOpen}
onRequestClose={this.handleCloseProfile}
/>
</React.Fragment>
</>
);
}
}

24
app/components/Breadcrumb.js
View File

@@ -33,11 +33,11 @@ const Breadcrumb = observer(({ document, collections, onlyText }: Props) => {
if (onlyText === true) {
return (
<React.Fragment>
<>
{collection.private && (
<React.Fragment>
<>
<SmallPadlockIcon color="currentColor" size={16} />{" "}
</React.Fragment>
</>
)}
{collection.name}
{path.map((n) => (
@@ -46,7 +46,7 @@ const Breadcrumb = observer(({ document, collections, onlyText }: Props) => {
{n.title}
</React.Fragment>
))}
</React.Fragment>
</>
);
}
@@ -59,24 +59,24 @@ const Breadcrumb = observer(({ document, collections, onlyText }: Props) => {
return (
<Wrapper justify="flex-start" align="center">
{isTemplate && (
<React.Fragment>
<>
<CollectionName to="/templates">
<ShapesIcon color="currentColor" />
&nbsp;
<span>Templates</span>
</CollectionName>
<Slash />
</React.Fragment>
</>
)}
{isDraft && (
<React.Fragment>
<>
<CollectionName to="/drafts">
<EditIcon color="currentColor" />
&nbsp;
<span>Drafts</span>
</CollectionName>
<Slash />
</React.Fragment>
</>
)}
<CollectionName to={collectionUrl(collection.id)}>
<CollectionIcon collection={collection} expanded />
@@ -84,17 +84,17 @@ const Breadcrumb = observer(({ document, collections, onlyText }: Props) => {
<span>{collection.name}</span>
</CollectionName>
{isNestedDocument && (
<React.Fragment>
<>
<Slash /> <BreadcrumbMenu label={<Overflow />} path={menuPath} />
</React.Fragment>
</>
)}
{lastPath && (
<React.Fragment>
<>
<Slash />{" "}
<Crumb to={lastPath.url} title={lastPath.title}>
{lastPath.title}
</Crumb>
</React.Fragment>
</>
)}
</Wrapper>
);

2
app/components/Button.js
View File

@@ -155,6 +155,6 @@ function Button({
);
}
export default React.forwardRef((props, ref) => (
export default React.forwardRef<Props, typeof Button>((props, ref) => (
<Button {...props} innerRef={ref} />
));

5
app/components/Checkbox.js
View File

@@ -10,6 +10,7 @@ export type Props = {
labelHidden?: boolean,
className?: string,
note?: string,
short?: boolean,
small?: boolean,
};
@@ -42,7 +43,7 @@ export default function Checkbox({
const wrappedLabel = <LabelText small={small}>{label}</LabelText>;
return (
<React.Fragment>
<>
<Wrapper small={small}>
<Label>
<input type="checkbox" {...rest} />
@@ -55,6 +56,6 @@ export default function Checkbox({
</Label>
{note && <HelpText small>{note}</HelpText>}
</Wrapper>
</React.Fragment>
</>
);
}

4
app/components/DocumentMeta.js
View File

@@ -18,10 +18,10 @@ function DocumentMeta({ views, isDraft, document }: Props) {
return (
<Meta document={document}>
{totalViews && !isDraft ? (
<React.Fragment>
<>
&nbsp;&middot; Viewed{" "}
{totalViews === 1 ? "once" : `${totalViews} times`}
</React.Fragment>
</>
) : null}
</Meta>
);

4
app/components/DropdownMenu/DropdownMenu.js
View File

@@ -161,7 +161,7 @@ class DropdownMenu extends React.Component<Props> {
closeOnEsc
>
{({ closePortal, openPortal, isOpen, portal }) => (
<React.Fragment>
<>
<Label
onMouseMove={hover ? this.clearCloseTimeout : undefined}
onMouseOut={
@@ -220,7 +220,7 @@ class DropdownMenu extends React.Component<Props> {
</Menu>
</Position>
)}
</React.Fragment>
</>
)}
</PortalWithState>
</div>

4
app/components/DropdownMenu/DropdownMenuItem.js
View File

@@ -26,12 +26,12 @@ const DropdownMenuItem = ({
{...rest}
>
{selected !== undefined && (
<React.Fragment>
<>
<CheckmarkIcon
color={selected === false ? "transparent" : undefined}
/>
&nbsp;
</React.Fragment>
</>
)}
{children}
</MenuItem>

17
app/components/Editor.js
View File

@@ -15,18 +15,21 @@ import { uploadFile } from "utils/uploadFile";
const EMPTY_ARRAY = [];
type Props = {
id: string,
id?: string,
defaultValue?: string,
readOnly?: boolean,
grow?: boolean,
disableEmbeds?: boolean,
history: RouterHistory,
ui?: UiStore,
};
type PropsWithRef = Props & {
forwardedRef: React.Ref<RichMarkdownEditor>,
ui: UiStore,
history: RouterHistory,
};
@observer
class Editor extends React.Component<Props> {
class Editor extends React.Component<PropsWithRef> {
@observable redirectTo: ?string;
onUploadImage = async (file: File) => {
@@ -62,7 +65,9 @@ class Editor extends React.Component<Props> {
};
onShowToast = (message: string) => {
this.props.ui.showToast(message);
if (this.props.ui) {
this.props.ui.showToast(message);
}
};
render() {
@@ -120,6 +125,6 @@ const Span = styled.span`
const EditorWithRouterAndTheme = withRouter(withTheme(Editor));
export default React.forwardRef((props, ref) => (
export default React.forwardRef<Props, typeof Editor>((props, ref) => (
<EditorWithRouterAndTheme {...props} forwardedRef={ref} />
));

8
app/components/GroupListItem.js
View File

@@ -46,15 +46,15 @@ class GroupListItem extends React.Component<Props> {
const overflow = memberCount - users.length;
return (
<React.Fragment>
<>
<ListItem
title={
<Title onClick={this.handleMembersModalOpen}>{group.name}</Title>
}
subtitle={
<React.Fragment>
<>
{memberCount} member{memberCount === 1 ? "" : "s"}
</React.Fragment>
</>
}
actions={
<Flex align="center">
@@ -79,7 +79,7 @@ class GroupListItem extends React.Component<Props> {
>
<GroupMembers group={group} onSubmit={this.handleMembersModalClose} />
</Modal>
</React.Fragment>
</>
);
}
}

6
app/components/HoverPreview.js
View File

@@ -31,7 +31,7 @@ function HoverPreview({ node, documents, onClose, event }: Props) {
const [isVisible, setVisible] = React.useState(false);
const timerClose = React.useRef();
const timerOpen = React.useRef();
const cardRef = React.useRef();
const cardRef = React.useRef<?HTMLDivElement>();
const startCloseTimer = () => {
stopOpenTimer();
@@ -68,6 +68,8 @@ function HoverPreview({ node, documents, onClose, event }: Props) {
if (cardRef.current) {
cardRef.current.addEventListener("mouseenter", stopCloseTimer);
}
if (cardRef.current) {
cardRef.current.addEventListener("mouseleave", startCloseTimer);
}
@@ -82,6 +84,8 @@ function HoverPreview({ node, documents, onClose, event }: Props) {
if (cardRef.current) {
cardRef.current.removeEventListener("mouseenter", stopCloseTimer);
}
if (cardRef.current) {
cardRef.current.removeEventListener("mouseleave", startCloseTimer);
}

4
app/components/InputRich.js
View File

@@ -48,7 +48,7 @@ class InputRich extends React.Component<Props> {
const Editor = this.editorComponent;
return (
<React.Fragment>
<>
<LabelText>{label}</LabelText>
<StyledOutline
@@ -67,7 +67,7 @@ class InputRich extends React.Component<Props> {
"Loading…"
)}
</StyledOutline>
</React.Fragment>
</>
);
}
}

4
app/components/Modal.js
View File

@@ -64,7 +64,7 @@ const Modal = ({
if (!isOpen) return null;
return (
<React.Fragment>
<>
<GlobalStyles />
<StyledModal
contentLabel={title}
@@ -85,7 +85,7 @@ const Modal = ({
<CloseIcon size={32} color="currentColor" />
</Close>
</StyledModal>
</React.Fragment>
</>
);
};

2
app/components/NudeButton.js
View File

@@ -20,6 +20,6 @@ const Button = styled.button`
}
`;
export default React.forwardRef((props, ref) => (
export default React.forwardRef<any, typeof Button>((props, ref) => (
<Button {...props} ref={ref} />
));

8
app/components/PaginatedList.js
View File

@@ -106,10 +106,10 @@ class PaginatedList extends React.Component<Props> {
(this.isLoaded || this.isInitiallyLoaded) && !showLoading && !showEmpty;
return (
<React.Fragment>
<>
{showEmpty && empty}
{showList && (
<React.Fragment>
<>
{heading}
<ArrowKeyNavigation
mode={ArrowKeyNavigation.mode.VERTICAL}
@@ -120,10 +120,10 @@ class PaginatedList extends React.Component<Props> {
{this.allowLoadMore && (
<Waypoint key={this.renderCount} onEnter={this.loadMoreResults} />
)}
</React.Fragment>
</>
)}
{showLoading && <ListPlaceholder count={5} />}
</React.Fragment>
</>
);
}
}

4
app/components/Sidebar/components/Collections.js
View File

@@ -55,7 +55,7 @@ class Collections extends React.Component<Props> {
const { collections, ui, documents } = this.props;
const content = (
<React.Fragment>
<>
{collections.orderedData.map((collection) => (
<CollectionLink
key={collection.id}
@@ -73,7 +73,7 @@ class Collections extends React.Component<Props> {
label="New collection…"
exact
/>
</React.Fragment>
</>
);
return (

4
app/components/Sidebar/components/Version.js
View File

@@ -30,7 +30,7 @@ export default function Version() {
<SidebarLink
href="https://github.com/outline/outline/releases"
label={
<React.Fragment>
<>
v{version}
<br />
<LilBadge>
@@ -40,7 +40,7 @@ export default function Version() {
releasesBehind === 1 ? "" : "s"
} behind`}
</LilBadge>
</React.Fragment>
</>
}
/>
);

4
app/components/Theme.js
View File

@@ -14,10 +14,10 @@ type Props = {
function Theme({ children, ui }: Props) {
return (
<ThemeProvider theme={ui.resolvedTheme === "dark" ? dark : light}>
<React.Fragment>
<>
<GlobalStyles />
{children}
</React.Fragment>
</>
</ThemeProvider>
);
}

4
app/components/Tooltip.js
View File

@@ -24,9 +24,9 @@ class Tooltip extends React.Component<Props> {
if (shortcut) {
content = (
<React.Fragment>
<>
{tooltip} &middot; <Shortcut>{shortcut}</Shortcut>
</React.Fragment>
</>
);
}