chore: Upgrade flow (#1854)

* wip: upgrade flow

* chore: More sealed props improvements

* Final fixes

app/scenes/Document/components/Document.js

@@ -61,7 +61,7 @@ type Props = {
   document: Document,
   revision: Revision,
   readOnly: boolean,
-  onCreateLink: (title: string) => string,
+  onCreateLink: (title: string) => Promise<string>,
   onSearchLink: (term: string) => any,
   theme: Theme,
   auth: AuthStore,

app/scenes/Document/components/Editor.js

@@ -9,24 +9,24 @@ import parseTitle from "shared/utils/parseTitle";
 import Document from "models/Document";
 import ClickablePadding from "components/ClickablePadding";
 import DocumentMetaWithViews from "components/DocumentMetaWithViews";
-import Editor from "components/Editor";
+import Editor, { type Props as EditorProps } from "components/Editor";
 import Flex from "components/Flex";
 import HoverPreview from "components/HoverPreview";
 import Star, { AnimatedStar } from "components/Star";
 import { isModKey } from "utils/keyboard";
 import { documentHistoryUrl } from "utils/routeHelpers";
 
-type Props = {
+type Props = {|
+  ...EditorProps,
   onChangeTitle: (event: SyntheticInputEvent<>) => void,
   title: string,
-  defaultValue: string,
   document: Document,
   isDraft: boolean,
   isShare: boolean,
-  readOnly?: boolean,
-  onSave: ({ publish?: boolean, done?: boolean, autosave?: boolean }) => mixed,
+  grow?: boolean,
+  onSave: ({ done?: boolean, autosave?: boolean, publish?: boolean }) => any,
   innerRef: { current: any },
-};
+|};
 
 @observer
 class DocumentEditor extends React.Component<Props> {
@@ -98,6 +98,7 @@ class DocumentEditor extends React.Component<Props> {
       isShare,
       readOnly,
       innerRef,
+      ...rest
     } = this.props;
 
     const { emoji } = parseTitle(title);
@@ -135,12 +136,12 @@ class DocumentEditor extends React.Component<Props> {
         />
         <Editor
           ref={innerRef}
-          autoFocus={title && !this.props.defaultValue}
+          autoFocus={!!title && !this.props.defaultValue}
           placeholder="…the rest is up to you"
           onHoverLink={this.handleLinkActive}
           scrollTo={window.location.hash}
           grow
-          {...this.props}
+          {...rest}
         />
         {!readOnly && <ClickablePadding onClick={this.focusAtEnd} grow />}
         {this.activeLinkEvent && !isShare && readOnly && (

app/scenes/Document/components/Header.js

@@ -240,7 +240,6 @@ class Header extends React.Component<Props> {
                   <Button
                     onClick={this.handleSave}
                     disabled={savingIsDisabled}
-                    isSaving={isSaving}
                     neutral={isDraft}
                   >
                     {isDraft ? t("Save Draft") : t("Done Editing")}
@@ -311,7 +310,6 @@ class Header extends React.Component<Props> {
               >
                 <Button
                   onClick={this.handlePublish}
-                  title={t("Publish document")}
                   disabled={publishingIsDisabled}
                 >
                   {isPublishing ? `${t("Publishing")}…` : t("Publish")}

app/scenes/Document/components/ReferenceListItem.js

@@ -7,11 +7,11 @@ import Document from "models/Document";
 import DocumentMeta from "components/DocumentMeta";
 import type { NavigationNode } from "types";
 
-type Props = {
+type Props = {|
   document: Document | NavigationNode,
   anchor?: string,
   showCollection?: boolean,
-};
+|};
 
 const DocumentLink = styled(Link)`
   display: block;

app/scenes/DocumentShare.js

@@ -43,7 +43,7 @@ class DocumentShare extends React.Component<Props> {
     this.isSaving = true;
 
     try {
-      await share.save({ published: event.target.checked });
+      await share.save({ published: event.currentTarget.checked });
     } catch (err) {
       this.props.ui.showToast(err.message, { type: "error" });
     } finally {

app/scenes/GroupMembers/AddPeopleToGroup.js

@@ -87,7 +87,6 @@ class AddPeopleToGroup extends React.Component<Props> {
           </ButtonLink>
           .
         </HelpText>
-
         <Input
           type="search"
           placeholder={`${t("Search by name")}…`}

app/scenes/Settings/Zapier.js

@@ -17,10 +17,9 @@ function Zapier() {
       </HelpText>
       <p>
         <Button
-          as="a"
-          href="https://zapier.com/apps/outline"
-          rel="noopener noreferrer"
-          target="_blank"
+          onClick={() =>
+            (window.location.href = "https://zapier.com/apps/outline")
+          }
         >
           Open Zapier →
         </Button>

app/scenes/UserDelete.js

@@ -34,10 +34,10 @@ class UserDelete extends React.Component<Props> {
   };
 
   render() {
-    const { auth, ...rest } = this.props;
+    const { onRequestClose } = this.props;
 
     return (
-      <Modal isOpen title="Delete Account" {...rest}>
+      <Modal isOpen title="Delete Account" onRequestClose={onRequestClose}>
         <Flex column>
           <form onSubmit={this.handleSubmit}>
             <HelpText>

app/scenes/UserProfile.js

@@ -19,11 +19,11 @@ import Subheading from "components/Subheading";
 import useCurrentUser from "hooks/useCurrentUser";
 import useStores from "hooks/useStores";
 
-type Props = {
+type Props = {|
   user: User,
   history: RouterHistory,
   onRequestClose: () => void,
-};
+|};
 
 function UserProfile(props: Props) {
   const { t } = useTranslation();