use reflow to migrate from flow to typescript

scm-ui/ui-components/src/repos/changesets/ChangesetAuthor.tsx

@@ -1,14 +1,13 @@
-//@flow
-import React from "react";
-import type { Changeset } from "@scm-manager/ui-types";
-import { ExtensionPoint } from "@scm-manager/ui-extensions";
-import { translate } from "react-i18next";
+import React from 'react';
+import { Changeset } from '@scm-manager/ui-types';
+import { ExtensionPoint } from '@scm-manager/ui-extensions';
+import { translate } from 'react-i18next';
 
 type Props = {
-  changeset: Changeset,
+  changeset: Changeset;
 
   // context props
-  t: string => string
+  t: (p: string) => string;
 };
 
 class ChangesetAuthor extends React.Component<Props> {
@@ -29,8 +28,8 @@ class ChangesetAuthor extends React.Component<Props> {
     const { t } = this.props;
     return (
       <a
-        href={"mailto:" + mail}
-        title={t("changeset.author.mailto") + " " + mail}
+        href={'mailto:' + mail}
+        title={t('changeset.author.mailto') + ' ' + mail}
       >
         {name}
       </a>
@@ -41,10 +40,12 @@ class ChangesetAuthor extends React.Component<Props> {
     const { t } = this.props;
     return (
       <>
-        {t("changeset.author.prefix")} {child}
+        {t('changeset.author.prefix')} {child}
         <ExtensionPoint
           name="changesets.author.suffix"
-          props={{ changeset: this.props.changeset }}
+          props={{
+            changeset: this.props.changeset,
+          }}
           renderAll={true}
         />
       </>
@@ -52,4 +53,4 @@ class ChangesetAuthor extends React.Component<Props> {
   }
 }
 
-export default translate("repos")(ChangesetAuthor);
+export default translate('repos')(ChangesetAuthor);

scm-ui/ui-components/src/repos/changesets/ChangesetButtonGroup.tsx

@@ -1,16 +1,15 @@
-//@flow
-import React from "react";
-import type { Changeset, Repository } from "@scm-manager/ui-types";
-import { ButtonAddons, Button } from "../../buttons";
-import { createChangesetLink, createSourcesLink } from "./changesets";
-import { translate } from "react-i18next";
+import React from 'react';
+import { Changeset, Repository } from '@scm-manager/ui-types';
+import { ButtonAddons, Button } from '../../buttons';
+import { createChangesetLink, createSourcesLink } from './changesets';
+import { translate } from 'react-i18next';
 
 type Props = {
-  repository: Repository,
-  changeset: Changeset,
+  repository: Repository;
+  changeset: Changeset;
 
   // context props
-  t: string => string
+  t: (p: string) => string;
 };
 
 class ChangesetButtonGroup extends React.Component<Props> {
@@ -23,13 +22,13 @@ class ChangesetButtonGroup extends React.Component<Props> {
         <Button
           link={changesetLink}
           icon="exchange-alt"
-          label={t("changeset.buttons.details")}
+          label={t('changeset.buttons.details')}
           reducedMobile={true}
         />
         <Button
           link={sourcesLink}
           icon="code"
-          label={t("changeset.buttons.sources")}
+          label={t('changeset.buttons.sources')}
           reducedMobile={true}
         />
       </ButtonAddons>
@@ -37,4 +36,4 @@ class ChangesetButtonGroup extends React.Component<Props> {
   }
 }
 
-export default translate("repos")(ChangesetButtonGroup);
+export default translate('repos')(ChangesetButtonGroup);

scm-ui/ui-components/src/repos/changesets/ChangesetDiff.js

@@ -1,38 +0,0 @@
-//@flow
-import React from "react";
-import type { Changeset } from "@scm-manager/ui-types";
-import LoadingDiff from "../LoadingDiff";
-import Notification from "../../Notification";
-import {translate} from "react-i18next";
-
-type Props = {
-  changeset: Changeset,
-  defaultCollapse?: boolean,
-
-  // context props
-  t: string => string
-};
-
-class ChangesetDiff extends React.Component<Props> {
-
-  isDiffSupported(changeset: Changeset) {
-    return !!changeset._links.diff;
-  }
-
-  createUrl(changeset: Changeset) {
-    return changeset._links.diff.href + "?format=GIT";
-  }
-
-  render() {
-    const { changeset, defaultCollapse, t } = this.props;
-    if (!this.isDiffSupported(changeset)) {
-      return <Notification type="danger">{t("changeset.diffNotSupported")}</Notification>;
-    } else {
-      const url = this.createUrl(changeset);
-      return <LoadingDiff url={url} defaultCollapse={defaultCollapse} />;
-    }
-  }
-
-}
-
-export default translate("repos")(ChangesetDiff);

scm-ui/ui-components/src/repos/changesets/ChangesetDiff.tsx

@@ -0,0 +1,39 @@
+import React from 'react';
+import { Changeset } from '@scm-manager/ui-types';
+import LoadingDiff from '../LoadingDiff';
+import Notification from '../../Notification';
+import { translate } from 'react-i18next';
+
+type Props = {
+  changeset: Changeset;
+  defaultCollapse?: boolean;
+
+  // context props
+  t: (p: string) => string;
+};
+
+class ChangesetDiff extends React.Component<Props> {
+  isDiffSupported(changeset: Changeset) {
+    return !!changeset._links.diff;
+  }
+
+  createUrl(changeset: Changeset) {
+    return changeset._links.diff.href + '?format=GIT';
+  }
+
+  render() {
+    const { changeset, defaultCollapse, t } = this.props;
+    if (!this.isDiffSupported(changeset)) {
+      return (
+        <Notification type="danger">
+          {t('changeset.diffNotSupported')}
+        </Notification>
+      );
+    } else {
+      const url = this.createUrl(changeset);
+      return <LoadingDiff url={url} defaultCollapse={defaultCollapse} />;
+    }
+  }
+}
+
+export default translate('repos')(ChangesetDiff);

scm-ui/ui-components/src/repos/changesets/ChangesetId.tsx

@@ -1,19 +1,17 @@
-//@flow
-
-import {Link} from "react-router-dom";
-import React from "react";
-import type {Changeset, Repository} from "@scm-manager/ui-types";
-import { createChangesetLink } from "./changesets";
+import { Link } from 'react-router-dom';
+import React from 'react';
+import { Changeset, Repository } from '@scm-manager/ui-types';
+import { createChangesetLink } from './changesets';
 
 type Props = {
-  repository: Repository,
-  changeset: Changeset,
-  link: boolean
+  repository: Repository;
+  changeset: Changeset;
+  link: boolean;
 };
 
 export default class ChangesetId extends React.Component<Props> {
   static defaultProps = {
-    link: true
+    link: true,
   };
 
   shortId = (changeset: Changeset) => {
@@ -24,11 +22,7 @@ export default class ChangesetId extends React.Component<Props> {
     const { repository, changeset } = this.props;
     const link = createChangesetLink(repository, changeset);
 
-    return (
-      <Link to={link}>
-        {this.shortId(changeset)}
-      </Link>
-    );
+    return <Link to={link}>{this.shortId(changeset)}</Link>;
   };
 
   renderText = () => {

scm-ui/ui-components/src/repos/changesets/ChangesetList.tsx

@@ -1,12 +1,11 @@
-// @flow
-import ChangesetRow from "./ChangesetRow";
-import React from "react";
+import ChangesetRow from './ChangesetRow';
+import React from 'react';
 
-import type { Changeset, Repository } from "@scm-manager/ui-types";
+import { Changeset, Repository } from '@scm-manager/ui-types';
 
 type Props = {
-  repository: Repository,
-  changesets: Changeset[]
+  repository: Repository;
+  changesets: Changeset[];
 };
 
 class ChangesetList extends React.Component<Props> {

scm-ui/ui-components/src/repos/changesets/ChangesetRow.tsx

@@ -1,24 +1,23 @@
-//@flow
-import React from "react";
-import { Interpolate, translate } from "react-i18next";
-import classNames from "classnames";
-import styled from "styled-components";
-import { ExtensionPoint } from "@scm-manager/ui-extensions";
-import type { Changeset, Repository } from "@scm-manager/ui-types";
-import DateFromNow from "../../DateFromNow";
-import { AvatarWrapper, AvatarImage } from "../../avatar";
-import { parseDescription } from "./changesets";
-import ChangesetId from "./ChangesetId";
-import ChangesetAuthor from "./ChangesetAuthor";
-import ChangesetTags from "./ChangesetTags";
-import ChangesetButtonGroup from "./ChangesetButtonGroup";
+import React from 'react';
+import { Interpolate, translate } from 'react-i18next';
+import classNames from 'classnames';
+import styled from 'styled-components';
+import { ExtensionPoint } from '@scm-manager/ui-extensions';
+import { Changeset, Repository } from '@scm-manager/ui-types';
+import DateFromNow from '../../DateFromNow';
+import { AvatarWrapper, AvatarImage } from '../../avatar';
+import { parseDescription } from './changesets';
+import ChangesetId from './ChangesetId';
+import ChangesetAuthor from './ChangesetAuthor';
+import ChangesetTags from './ChangesetTags';
+import ChangesetButtonGroup from './ChangesetButtonGroup';
 
 type Props = {
-  repository: Repository,
-  changeset: Changeset,
+  repository: Repository;
+  changeset: Changeset;
 
   // context props
-  t: string => string
+  t: (p: string) => string;
 };
 
 const Wrapper = styled.div`
@@ -89,7 +88,10 @@ class ChangesetRow extends React.Component<Props> {
                     <h4 className="has-text-weight-bold is-ellipsis-overflow">
                       <ExtensionPoint
                         name="changeset.description"
-                        props={{ changeset, value: description.title }}
+                        props={{
+                          changeset,
+                          value: description.title,
+                        }}
                         renderAll={false}
                       >
                         {description.title}
@@ -120,14 +122,17 @@ class ChangesetRow extends React.Component<Props> {
               </VCenteredColumn>
             </div>
           </div>
-          <VCenteredChildColumn className={classNames("column", "is-flex")}>
+          <VCenteredChildColumn className={classNames('column', 'is-flex')}>
             <ChangesetButtonGroup
               repository={repository}
               changeset={changeset}
             />
             <ExtensionPoint
               name="changeset.right"
-              props={{ repository, changeset }}
+              props={{
+                repository,
+                changeset,
+              }}
               renderAll={true}
             />
           </VCenteredChildColumn>
@@ -137,4 +142,4 @@ class ChangesetRow extends React.Component<Props> {
   }
 }
 
-export default translate("repos")(ChangesetRow);
+export default translate('repos')(ChangesetRow);

scm-ui/ui-components/src/repos/changesets/ChangesetTag.tsx

@@ -1,10 +1,9 @@
-//@flow
-import React from "react";
-import type { Tag } from "@scm-manager/ui-types";
-import ChangesetTagBase from "./ChangesetTagBase";
+import React from 'react';
+import { Tag } from '@scm-manager/ui-types';
+import ChangesetTagBase from './ChangesetTagBase';
 
 type Props = {
-  tag: Tag
+  tag: Tag;
 };
 
 class ChangesetTag extends React.Component<Props> {

scm-ui/ui-components/src/repos/changesets/ChangesetTagBase.tsx

@@ -1,18 +1,15 @@
-//@flow
-import React from "react";
-import Tag from "../../Tag";
+import React from 'react';
+import Tag from '../../Tag';
 
 type Props = {
-  icon: string,
-  label: string
+  icon: string;
+  label: string;
 };
 
 class ChangesetTagBase extends React.Component<Props> {
   render() {
     const { icon, label } = this.props;
-    return (
-      <Tag color="info" icon={icon} label={label} />
-    );
+    return <Tag color="info" icon={icon} label={label} />;
   }
 }
 

scm-ui/ui-components/src/repos/changesets/ChangesetTags.tsx

@@ -1,15 +1,13 @@
-//@flow
-import React from "react";
-import type { Changeset} from "@scm-manager/ui-types";
-import ChangesetTag from "./ChangesetTag";
-import ChangesetTagsCollapsed from "./ChangesetTagsCollapsed";
+import React from 'react';
+import { Changeset } from '@scm-manager/ui-types';
+import ChangesetTag from './ChangesetTag';
+import ChangesetTagsCollapsed from './ChangesetTagsCollapsed';
 
 type Props = {
-  changeset: Changeset
+  changeset: Changeset;
 };
 
 class ChangesetTags extends React.Component<Props> {
-
   getTags = () => {
     const { changeset } = this.props;
     return changeset._embedded.tags || [];

scm-ui/ui-components/src/repos/changesets/ChangesetTagsCollapsed.js

@@ -1,30 +0,0 @@
-//@flow
-import React from "react";
-import { translate } from "react-i18next";
-import type { Tag } from "@scm-manager/ui-types";
-import Tooltip from "../../Tooltip";
-import ChangesetTagBase from "./ChangesetTagBase";
-
-type Props = {
-  tags: Tag[],
-
-  // context props
-  t: string => string
-};
-
-class ChangesetTagsCollapsed extends React.Component<Props> {
-  render() {
-    const { tags, t } = this.props;
-    const message = tags.map(tag => tag.name).join(", ");
-    return (
-      <Tooltip location="top" message={message}>
-        <ChangesetTagBase
-          icon="tags"
-          label={tags.length + " " + t("changeset.tags")}
-        />
-      </Tooltip>
-    );
-  }
-}
-
-export default translate("repos")(ChangesetTagsCollapsed);

scm-ui/ui-components/src/repos/changesets/ChangesetTagsCollapsed.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { translate } from 'react-i18next';
+import { Tag } from '@scm-manager/ui-types';
+import Tooltip from '../../Tooltip';
+import ChangesetTagBase from './ChangesetTagBase';
+
+type Props = {
+  tags: Tag[];
+
+  // context props
+  t: (p: string) => string;
+};
+
+class ChangesetTagsCollapsed extends React.Component<Props> {
+  render() {
+    const { tags, t } = this.props;
+    const message = tags.map(tag => tag.name).join(', ');
+    return (
+      <Tooltip location="top" message={message}>
+        <ChangesetTagBase
+          icon="tags"
+          label={tags.length + ' ' + t('changeset.tags')}
+        />
+      </Tooltip>
+    );
+  }
+}
+
+export default translate('repos')(ChangesetTagsCollapsed);

scm-ui/ui-components/src/repos/changesets/changesets.test.js

@@ -1,22 +0,0 @@
-// @flow
-
-import {parseDescription} from "./changesets";
-
-describe("parseDescription tests", () => {
-  it("should return a description with title and message", () => {
-    const desc = parseDescription("Hello\nTrillian");
-    expect(desc.title).toBe("Hello");
-    expect(desc.message).toBe("Trillian");
-  });
-
-  it("should return a description with title and without message", () => {
-    const desc = parseDescription("Hello Trillian");
-    expect(desc.title).toBe("Hello Trillian");
-  });
-
-  it("should return an empty description for undefined", () => {
-    const desc = parseDescription();
-    expect(desc.title).toBe("");
-    expect(desc.message).toBe("");
-  });
-});

scm-ui/ui-components/src/repos/changesets/changesets.test.ts

@@ -0,0 +1,20 @@
+import { parseDescription } from './changesets';
+
+describe('parseDescription tests', () => {
+  it('should return a description with title and message', () => {
+    const desc = parseDescription('Hello\nTrillian');
+    expect(desc.title).toBe('Hello');
+    expect(desc.message).toBe('Trillian');
+  });
+
+  it('should return a description with title and without message', () => {
+    const desc = parseDescription('Hello Trillian');
+    expect(desc.title).toBe('Hello Trillian');
+  });
+
+  it('should return an empty description for undefined', () => {
+    const desc = parseDescription();
+    expect(desc.title).toBe('');
+    expect(desc.message).toBe('');
+  });
+});

scm-ui/ui-components/src/repos/changesets/changesets.ts

@@ -1,25 +1,30 @@
-// @flow
-import type { Changeset, Repository } from "@scm-manager/ui-types";
+import { Changeset, Repository } from '@scm-manager/ui-types';
 
 export type Description = {
-  title: string,
-  message: string
+  title: string;
+  message: string;
 };
 
-export function createChangesetLink(repository: Repository, changeset: Changeset) {
+export function createChangesetLink(
+  repository: Repository,
+  changeset: Changeset,
+) {
   return `/repo/${repository.namespace}/${repository.name}/changeset/${changeset.id}`;
 }
 
-export function createSourcesLink(repository: Repository, changeset: Changeset) {
+export function createSourcesLink(
+  repository: Repository,
+  changeset: Changeset,
+) {
   return `/repo/${repository.namespace}/${repository.name}/sources/${changeset.id}`;
 }
 
 export function parseDescription(description?: string): Description {
-  const desc = description ? description : "";
-  const lineBreak = desc.indexOf("\n");
+  const desc = description ? description : '';
+  const lineBreak = desc.indexOf('\n');
 
   let title;
-  let message = "";
+  let message = '';
 
   if (lineBreak > 0) {
     title = desc.substring(0, lineBreak);
@@ -30,6 +35,6 @@ export function parseDescription(description?: string): Description {
 
   return {
     title,
-    message
+    message,
   };
 }

scm-ui/ui-components/src/repos/changesets/index.js

@@ -1,13 +0,0 @@
-// @flow
-import * as changesets from "./changesets";
-export { changesets };
-
-export { default as ChangesetAuthor } from "./ChangesetAuthor";
-export { default as ChangesetButtonGroup } from "./ChangesetButtonGroup";
-export { default as ChangesetDiff } from "./ChangesetDiff";
-export { default as ChangesetId } from "./ChangesetId";
-export { default as ChangesetList } from "./ChangesetList";
-export { default as ChangesetRow } from "./ChangesetRow";
-export { default as ChangesetTag } from "./ChangesetTag";
-export { default as ChangesetTags } from "./ChangesetTags";
-export { default as ChangesetTagsCollapsed } from "./ChangesetTagsCollapsed";

scm-ui/ui-components/src/repos/changesets/index.ts

@@ -0,0 +1,12 @@
+import * as changesets from './changesets';
+export { changesets };
+
+export { default as ChangesetAuthor } from './ChangesetAuthor';
+export { default as ChangesetButtonGroup } from './ChangesetButtonGroup';
+export { default as ChangesetDiff } from './ChangesetDiff';
+export { default as ChangesetId } from './ChangesetId';
+export { default as ChangesetList } from './ChangesetList';
+export { default as ChangesetRow } from './ChangesetRow';
+export { default as ChangesetTag } from './ChangesetTag';
+export { default as ChangesetTags } from './ChangesetTags';
+export { default as ChangesetTagsCollapsed } from './ChangesetTagsCollapsed';