use reflow to migrate from flow to typescript

2025-11-13 08:55:44 +01:00 · 2019-10-19 16:38:07 +02:00
parent f7b8050dfa
commit 6e7a08a3bb
495 changed files with 14239 additions and 13766 deletions
--- a/scm-ui/ui-webapp/src/repos/permissions/containers/AdvancedPermissionsDialog.tsx
+++ b/scm-ui/ui-webapp/src/repos/permissions/containers/AdvancedPermissionsDialog.tsx
@@ -1,27 +1,26 @@
-// @flow
-import React from "react";
+import React from 'react';
 import {
  ButtonGroup,
  Button,
  SubmitButton,
-  Modal
-} from "@scm-manager/ui-components";
-import { translate } from "react-i18next";
-import PermissionCheckbox from "../components/PermissionCheckbox";
+  Modal,
+} from '@scm-manager/ui-components';
+import { translate } from 'react-i18next';
+import PermissionCheckbox from '../components/PermissionCheckbox';

 type Props = {
-  readOnly: boolean,
-  availableVerbs: string[],
-  selectedVerbs: string[],
-  onSubmit: (string[]) => void,
-  onClose: () => void,
+  readOnly: boolean;
+  availableVerbs: string[];
+  selectedVerbs: string[];
+  onSubmit: (p: string[]) => void;
+  onClose: () => void;

  // context props
-  t: string => string
+  t: (p: string) => string;
 };

 type State = {
-  verbs: any
+  verbs: any;
 };

 class AdvancedPermissionsDialog extends React.Component<Props, State> {
@@ -33,9 +32,11 @@ class AdvancedPermissionsDialog extends React.Component<Props, State> {
      verb =>
        (verbs[verb] = props.selectedVerbs
          ? props.selectedVerbs.includes(verb)
-          : false)
+          : false),
    );
-    this.state = { verbs };
+    this.state = {
+      verbs,
+    };
  }

  render() {
@@ -53,7 +54,7 @@ class AdvancedPermissionsDialog extends React.Component<Props, State> {
    ));

    const submitButton = !readOnly ? (
-      <SubmitButton label={t("permission.advanced.dialog.submit")} />
+      <SubmitButton label={t('permission.advanced.dialog.submit')} />
    ) : null;

    const body = <>{verbSelectBoxes}</>;
@@ -63,7 +64,7 @@ class AdvancedPermissionsDialog extends React.Component<Props, State> {
        <ButtonGroup>
          {submitButton}
          <Button
-            label={t("permission.advanced.dialog.abort")}
+            label={t('permission.advanced.dialog.abort')}
            action={onClose}
          />
        </ButtonGroup>
@@ -72,7 +73,7 @@ class AdvancedPermissionsDialog extends React.Component<Props, State> {

    return (
      <Modal
-        title={t("permission.advanced.dialog.title")}
+        title={t('permission.advanced.dialog.title')}
        closeFunction={() => onClose()}
        body={body}
        footer={footer}
@@ -83,17 +84,22 @@ class AdvancedPermissionsDialog extends React.Component<Props, State> {

  handleChange = (value: boolean, name: string) => {
    const { verbs } = this.state;
-    const newVerbs = { ...verbs, [name]: value };
-    this.setState({ verbs: newVerbs });
+    const newVerbs = {
+      ...verbs,
+      [name]: value,
+    };
+    this.setState({
+      verbs: newVerbs,
+    });
  };

  onSubmit = () => {
    this.props.onSubmit(
      Object.entries(this.state.verbs)
        .filter(e => e[1])
-        .map(e => e[0])
+        .map(e => e[0]),
    );
  };
 }

-export default translate("repos")(AdvancedPermissionsDialog);
+export default translate('repos')(AdvancedPermissionsDialog);
--- a/scm-ui/ui-webapp/src/repos/permissions/containers/CreatePermissionForm.tsx
+++ b/scm-ui/ui-webapp/src/repos/permissions/containers/CreatePermissionForm.tsx
@@ -1,7 +1,11 @@
-// @flow
-import React from "react";
-import {translate} from "react-i18next";
-import type {PermissionCollection, PermissionCreateEntry, RepositoryRole, SelectValue} from "@scm-manager/ui-types";
+import React from 'react';
+import { translate } from 'react-i18next';
+import {
+  PermissionCollection,
+  PermissionCreateEntry,
+  RepositoryRole,
+  SelectValue,
+} from '@scm-manager/ui-types';
 import {
  Button,
  GroupAutocomplete,
@@ -9,34 +13,34 @@ import {
  Radio,
  SubmitButton,
  Subtitle,
-  UserAutocomplete
-} from "@scm-manager/ui-components";
-import * as validator from "../components/permissionValidation";
-import RoleSelector from "../components/RoleSelector";
-import AdvancedPermissionsDialog from "./AdvancedPermissionsDialog";
-import {findVerbsForRole} from "../modules/permissions";
+  UserAutocomplete,
+} from '@scm-manager/ui-components';
+import * as validator from '../components/permissionValidation';
+import RoleSelector from '../components/RoleSelector';
+import AdvancedPermissionsDialog from './AdvancedPermissionsDialog';
+import { findVerbsForRole } from '../modules/permissions';

 type Props = {
-  availableRoles: RepositoryRole[],
-  availableVerbs: string[],
-  createPermission: (permission: PermissionCreateEntry) => void,
-  loading: boolean,
-  currentPermissions: PermissionCollection,
-  groupAutocompleteLink: string,
-  userAutocompleteLink: string,
+  availableRoles: RepositoryRole[];
+  availableVerbs: string[];
+  createPermission: (permission: PermissionCreateEntry) => void;
+  loading: boolean;
+  currentPermissions: PermissionCollection;
+  groupAutocompleteLink: string;
+  userAutocompleteLink: string;

  // Context props
-  t: string => string
+  t: (p: string) => string;
 };

 type State = {
-  name: string,
-  role?: string,
-  verbs?: string[],
-  groupPermission: boolean,
-  valid: boolean,
-  value?: SelectValue,
-  showAdvancedDialog: boolean
+  name: string;
+  role?: string;
+  verbs?: string[];
+  groupPermission: boolean;
+  valid: boolean;
+  value?: SelectValue;
+  showAdvancedDialog: boolean;
 };

 class CreatePermissionForm extends React.Component<Props, State> {
@@ -44,23 +48,23 @@ class CreatePermissionForm extends React.Component<Props, State> {
    super(props);

    this.state = {
-      name: "",
+      name: '',
      role: props.availableRoles[0].name,
      verbs: undefined,
      groupPermission: false,
      valid: true,
      value: undefined,
-      showAdvancedDialog: false
+      showAdvancedDialog: false,
    };
  }

  permissionScopeChanged = event => {
-    const groupPermission = event.target.value === "GROUP_PERMISSION";
+    const groupPermission = event.target.value === 'GROUP_PERMISSION';
    this.setState({
      value: undefined,
-      name: "",
+      name: '',
      groupPermission: groupPermission,
-      valid: false
+      valid: false,
    });
  };

@@ -71,7 +75,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
        <GroupAutocomplete
          autocompleteLink={this.props.groupAutocompleteLink}
          valueSelected={this.selectName}
-          value={this.state.value ? this.state.value : ""}
+          value={this.state.value ? this.state.value : ''}
        />
      );
    }
@@ -79,7 +83,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
      <UserAutocomplete
        autocompleteLink={this.props.userAutocompleteLink}
        valueSelected={this.selectName}
-        value={this.state.value ? this.state.value : ""}
+        value={this.state.value ? this.state.value : ''}
      />
    );
  };
@@ -91,8 +95,8 @@ class CreatePermissionForm extends React.Component<Props, State> {
      valid: validator.isPermissionValid(
        value.value.id,
        this.state.groupPermission,
-        this.props.currentPermissions
-      )
+        this.props.currentPermissions,
+      ),
    });
  };

@@ -117,7 +121,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
      <>
        <hr />
        <Subtitle
-          subtitle={t("permission.add-permission.add-permission-heading")}
+          subtitle={t('permission.add-permission.add-permission-heading')}
        />
        {advancedDialog}
        <form onSubmit={this.submit}>
@@ -127,14 +131,14 @@ class CreatePermissionForm extends React.Component<Props, State> {
                name="permission_scope"
                value="USER_PERMISSION"
                checked={!this.state.groupPermission}
-                label={t("permission.user-permission")}
+                label={t('permission.user-permission')}
                onChange={this.permissionScopeChanged}
              />
              <Radio
                name="permission_scope"
                value="GROUP_PERMISSION"
                checked={this.state.groupPermission}
-                label={t("permission.group-permission")}
+                label={t('permission.group-permission')}
                onChange={this.permissionScopeChanged}
              />
            </div>
@@ -148,19 +152,19 @@ class CreatePermissionForm extends React.Component<Props, State> {
                <div className="column is-narrow">
                  <RoleSelector
                    availableRoles={availableRoleNames}
-                    label={t("permission.role")}
-                    helpText={t("permission.help.roleHelpText")}
+                    label={t('permission.role')}
+                    helpText={t('permission.help.roleHelpText')}
                    handleRoleChange={this.handleRoleChange}
                    role={role}
                  />
                </div>
                <div className="column">
                  <LabelWithHelpIcon
-                    label={t("permission.permissions")}
-                    helpText={t("permission.help.permissionsHelpText")}
+                    label={t('permission.permissions')}
+                    helpText={t('permission.help.permissionsHelpText')}
                  />
                  <Button
-                    label={t("permission.advanced-button.label")}
+                    label={t('permission.advanced-button.label')}
                    action={this.toggleAdvancedPermissionsDialog}
                  />
                </div>
@@ -170,9 +174,9 @@ class CreatePermissionForm extends React.Component<Props, State> {
          <div className="columns">
            <div className="column">
              <SubmitButton
-                label={t("permission.add-permission.submit-button")}
+                label={t('permission.add-permission.submit-button')}
                loading={loading}
-                disabled={!this.state.valid || this.state.name === ""}
+                disabled={!this.state.valid || this.state.name === ''}
              />
            </div>
          </div>
@@ -183,7 +187,7 @@ class CreatePermissionForm extends React.Component<Props, State> {

  toggleAdvancedPermissionsDialog = () => {
    this.setState(prevState => ({
-      showAdvancedDialog: !prevState.showAdvancedDialog
+      showAdvancedDialog: !prevState.showAdvancedDialog,
    }));
  };

@@ -191,7 +195,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
    this.setState({
      showAdvancedDialog: false,
      role: undefined,
-      verbs: newVerbs
+      verbs: newVerbs,
    });
  };

@@ -200,7 +204,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
      name: this.state.name,
      role: this.state.role,
      verbs: this.state.verbs,
-      groupPermission: this.state.groupPermission
+      groupPermission: this.state.groupPermission,
    });
    this.removeState();
    e.preventDefault();
@@ -208,11 +212,11 @@ class CreatePermissionForm extends React.Component<Props, State> {

  removeState = () => {
    this.setState({
-      name: "",
+      name: '',
      role: this.props.availableRoles[0].name,
      verbs: undefined,
      valid: true,
-      value: undefined
+      value: undefined,
    });
  };

@@ -223,7 +227,7 @@ class CreatePermissionForm extends React.Component<Props, State> {
    }
    this.setState({
      role: selectedRole.name,
-      verbs: []
+      verbs: [],
    });
  };

@@ -232,4 +236,4 @@ class CreatePermissionForm extends React.Component<Props, State> {
  };
 }

-export default translate("repos")(CreatePermissionForm);
+export default translate('repos')(CreatePermissionForm);
--- a/scm-ui/ui-webapp/src/repos/permissions/containers/Permissions.tsx
+++ b/scm-ui/ui-webapp/src/repos/permissions/containers/Permissions.tsx
@@ -1,7 +1,6 @@
-//@flow
-import React from "react";
-import {connect} from "react-redux";
-import {translate} from "react-i18next";
+import React from 'react';
+import { connect } from 'react-redux';
+import { translate } from 'react-i18next';
 import {
  createPermission,
  createPermissionReset,
@@ -21,58 +20,68 @@ import {
  isCreatePermissionPending,
  isFetchAvailablePermissionsPending,
  isFetchPermissionsPending,
-  modifyPermissionReset
-} from "../modules/permissions";
-import {ErrorPage, LabelWithHelpIcon, Loading, Subtitle} from "@scm-manager/ui-components";
-import type {Permission, PermissionCollection, PermissionCreateEntry, RepositoryRole} from "@scm-manager/ui-types";
-import SinglePermission from "./SinglePermission";
-import CreatePermissionForm from "./CreatePermissionForm";
-import type {History} from "history";
-import {getPermissionsLink} from "../../modules/repos";
+  modifyPermissionReset,
+} from '../modules/permissions';
+import {
+  ErrorPage,
+  LabelWithHelpIcon,
+  Loading,
+  Subtitle,
+} from '@scm-manager/ui-components';
+import {
+  Permission,
+  PermissionCollection,
+  PermissionCreateEntry,
+  RepositoryRole,
+} from '@scm-manager/ui-types';
+import SinglePermission from './SinglePermission';
+import CreatePermissionForm from './CreatePermissionForm';
+import { History } from 'history';
+import { getPermissionsLink } from '../../modules/repos';
 import {
  getGroupAutoCompleteLink,
  getRepositoryRolesLink,
  getRepositoryVerbsLink,
-  getUserAutoCompleteLink
-} from "../../../modules/indexResource";
+  getUserAutoCompleteLink,
+} from '../../../modules/indexResource';

 type Props = {
-  availablePermissions: boolean,
-  availableRepositoryRoles: RepositoryRole[],
-  availableVerbs: string[],
-  namespace: string,
-  repoName: string,
-  loading: boolean,
-  error: Error,
-  permissions: PermissionCollection,
-  hasPermissionToCreate: boolean,
-  loadingCreatePermission: boolean,
-  repositoryRolesLink: string,
-  repositoryVerbsLink: string,
-  permissionsLink: string,
-  groupAutocompleteLink: string,
-  userAutocompleteLink: string,
+  availablePermissions: boolean;
+  availableRepositoryRoles: RepositoryRole[];
+  availableVerbs: string[];
+  namespace: string;
+  repoName: string;
+  loading: boolean;
+  error: Error;
+  permissions: PermissionCollection;
+  hasPermissionToCreate: boolean;
+  loadingCreatePermission: boolean;
+  repositoryRolesLink: string;
+  repositoryVerbsLink: string;
+  permissionsLink: string;
+  groupAutocompleteLink: string;
+  userAutocompleteLink: string;

  //dispatch functions
  fetchAvailablePermissionsIfNeeded: (
    repositoryRolesLink: string,
-    repositoryVerbsLink: string
-  ) => void,
-  fetchPermissions: (link: string, namespace: string, repoName: string) => void,
+    repositoryVerbsLink: string,
+  ) => void;
+  fetchPermissions: (link: string, namespace: string, repoName: string) => void;
  createPermission: (
    link: string,
    permission: PermissionCreateEntry,
    namespace: string,
    repoName: string,
-    callback?: () => void
-  ) => void,
-  createPermissionReset: (string, string) => void,
-  modifyPermissionReset: (string, string) => void,
-  deletePermissionReset: (string, string) => void,
+    callback?: () => void,
+  ) => void;
+  createPermissionReset: (p1: string, p2: string) => void;
+  modifyPermissionReset: (p1: string, p2: string) => void;
+  deletePermissionReset: (p1: string, p2: string) => void;
  // context props
-  t: string => string,
-  match: any,
-  history: History
+  t: (p: string) => string;
+  match: any;
+  history: History;
 };

 class Permissions extends React.Component<Props> {
@@ -87,7 +96,7 @@ class Permissions extends React.Component<Props> {
      deletePermissionReset,
      permissionsLink,
      repositoryRolesLink,
-      repositoryVerbsLink
+      repositoryVerbsLink,
    } = this.props;

    createPermissionReset(namespace, repoName);
@@ -102,7 +111,7 @@ class Permissions extends React.Component<Props> {
      this.props.permissionsLink,
      permission,
      this.props.namespace,
-      this.props.repoName
+      this.props.repoName,
    );
  };

@@ -120,13 +129,13 @@ class Permissions extends React.Component<Props> {
      loadingCreatePermission,
      hasPermissionToCreate,
      userAutocompleteLink,
-      groupAutocompleteLink
+      groupAutocompleteLink,
    } = this.props;
    if (error) {
      return (
        <ErrorPage
-          title={t("permission.error-title")}
-          subtitle={t("permission.error-subtitle")}
+          title={t('permission.error-title')}
+          subtitle={t('permission.error-subtitle')}
          error={error}
        />
      );
@@ -150,26 +159,26 @@ class Permissions extends React.Component<Props> {

    return (
      <div>
-        <Subtitle subtitle={t("permission.title")} />
+        <Subtitle subtitle={t('permission.title')} />
        <table className="card-table table is-hoverable is-fullwidth">
          <thead>
            <tr>
              <th>
                <LabelWithHelpIcon
-                  label={t("permission.name")}
-                  helpText={t("permission.help.nameHelpText")}
+                  label={t('permission.name')}
+                  helpText={t('permission.help.nameHelpText')}
                />
              </th>
              <th>
                <LabelWithHelpIcon
-                  label={t("permission.role")}
-                  helpText={t("permission.help.roleHelpText")}
+                  label={t('permission.role')}
+                  helpText={t('permission.help.roleHelpText')}
                />
              </th>
              <th>
                <LabelWithHelpIcon
-                  label={t("permission.permissions")}
-                  helpText={t("permission.help.permissionsHelpText")}
+                  label={t('permission.permissions')}
+                  helpText={t('permission.help.permissionsHelpText')}
                />
              </th>
              <th />
@@ -212,7 +221,7 @@ const mapStateToProps = (state, ownProps) => {
  const loadingCreatePermission = isCreatePermissionPending(
    state,
    namespace,
-    repoName
+    repoName,
  );
  const hasPermissionToCreate = hasCreatePermission(state, namespace, repoName);
  const repositoryRolesLink = getRepositoryRolesLink(state);
@@ -239,7 +248,7 @@ const mapStateToProps = (state, ownProps) => {
    loadingCreatePermission,
    permissionsLink,
    groupAutocompleteLink,
-    userAutocompleteLink
+    userAutocompleteLink,
  };
 };

@@ -250,13 +259,13 @@ const mapDispatchToProps = dispatch => {
    },
    fetchAvailablePermissionsIfNeeded: (
      repositoryRolesLink: string,
-      repositoryVerbsLink: string
+      repositoryVerbsLink: string,
    ) => {
      dispatch(
        fetchAvailablePermissionsIfNeeded(
          repositoryRolesLink,
-          repositoryVerbsLink
-        )
+          repositoryVerbsLink,
+        ),
      );
    },
    createPermission: (
@@ -264,10 +273,10 @@ const mapDispatchToProps = dispatch => {
      permission: PermissionCreateEntry,
      namespace: string,
      repoName: string,
-      callback?: () => void
+      callback?: () => void,
    ) => {
      dispatch(
-        createPermission(link, permission, namespace, repoName, callback)
+        createPermission(link, permission, namespace, repoName, callback),
      );
    },
    createPermissionReset: (namespace: string, repoName: string) => {
@@ -278,11 +287,11 @@ const mapDispatchToProps = dispatch => {
    },
    deletePermissionReset: (namespace: string, repoName: string) => {
      dispatch(deletePermissionReset(namespace, repoName));
-    }
+    },
  };
 };

 export default connect(
  mapStateToProps,
-  mapDispatchToProps
-)(translate("repos")(Permissions));
+  mapDispatchToProps,
+)(translate('repos')(Permissions));
--- a/scm-ui/ui-webapp/src/repos/permissions/containers/SinglePermission.tsx
+++ b/scm-ui/ui-webapp/src/repos/permissions/containers/SinglePermission.tsx
@@ -1,49 +1,48 @@
-// @flow
-import React from "react";
-import { connect } from "react-redux";
-import type { History } from "history";
-import { translate } from "react-i18next";
-import styled from "styled-components";
-import type { RepositoryRole, Permission } from "@scm-manager/ui-types";
-import { Button, Icon } from "@scm-manager/ui-components";
+import React from 'react';
+import { connect } from 'react-redux';
+import { History } from 'history';
+import { translate } from 'react-i18next';
+import styled from 'styled-components';
+import { RepositoryRole, Permission } from '@scm-manager/ui-types';
+import { Button, Icon } from '@scm-manager/ui-components';
 import {
  modifyPermission,
  isModifyPermissionPending,
  deletePermission,
  isDeletePermissionPending,
-  findVerbsForRole
-} from "../modules/permissions";
-import DeletePermissionButton from "../components/buttons/DeletePermissionButton";
-import RoleSelector from "../components/RoleSelector";
-import AdvancedPermissionsDialog from "./AdvancedPermissionsDialog";
+  findVerbsForRole,
+} from '../modules/permissions';
+import DeletePermissionButton from '../components/buttons/DeletePermissionButton';
+import RoleSelector from '../components/RoleSelector';
+import AdvancedPermissionsDialog from './AdvancedPermissionsDialog';

 type Props = {
-  availableRepositoryRoles: RepositoryRole[],
-  availableRepositoryVerbs: string[],
-  submitForm: Permission => void,
+  availableRepositoryRoles: RepositoryRole[];
+  availableRepositoryVerbs: string[];
+  submitForm: (p: Permission) => void;
  modifyPermission: (
    permission: Permission,
    namespace: string,
-    name: string
-  ) => void,
-  permission: Permission,
-  t: string => string,
-  namespace: string,
-  repoName: string,
-  match: any,
-  history: History,
-  loading: boolean,
+    name: string,
+  ) => void;
+  permission: Permission;
+  t: (p: string) => string;
+  namespace: string;
+  repoName: string;
+  match: any;
+  history: History;
+  loading: boolean;
  deletePermission: (
    permission: Permission,
    namespace: string,
-    name: string
-  ) => void,
-  deleteLoading: boolean
+    name: string,
+  ) => void;
+  deleteLoading: boolean;
 };

 type State = {
-  permission: Permission,
-  showAdvancedDialog: boolean
+  permission: Permission;
+  showAdvancedDialog: boolean;
 };

 const FullWidthTr = styled.tr`
@@ -65,13 +64,13 @@ class SinglePermission extends React.Component<Props, State> {

    this.state = {
      permission: {
-        name: "",
+        name: '',
        role: undefined,
        verbs: defaultPermission.verbs,
        groupPermission: false,
-        _links: {}
+        _links: {},
      },
-      showAdvancedDialog: false
+      showAdvancedDialog: false,
    };
  }

@@ -85,8 +84,8 @@ class SinglePermission extends React.Component<Props, State> {
          role: permission.role,
          verbs: permission.verbs,
          groupPermission: permission.groupPermission,
-          _links: permission._links
-        }
+          _links: permission._links,
+        },
      });
    }
  }
@@ -95,7 +94,7 @@ class SinglePermission extends React.Component<Props, State> {
    this.props.deletePermission(
      this.props.permission,
      this.props.namespace,
-      this.props.repoName
+      this.props.repoName,
    );
  };

@@ -106,14 +105,14 @@ class SinglePermission extends React.Component<Props, State> {
      loading,
      namespace,
      repoName,
-      t
+      t,
    } = this.props;
    const { permission, showAdvancedDialog } = this.state;
    const availableRoleNames =
      !!availableRepositoryRoles && availableRepositoryRoles.map(r => r.name);
    const readOnly = !this.mayChangePermissions();
    const roleSelector = readOnly ? (
-      <td>{permission.role ? permission.role : t("permission.custom")}</td>
+      <td>{permission.role ? permission.role : t('permission.custom')}</td>
    ) : (
      <td>
        <RoleSelector
@@ -141,9 +140,9 @@ class SinglePermission extends React.Component<Props, State> {

    const iconType =
      permission && permission.groupPermission ? (
-        <Icon title={t("permission.group")} name="user-friends" />
+        <Icon title={t('permission.group')} name="user-friends" />
      ) : (
-        <Icon title={t("permission.user")} name="user" />
+        <Icon title={t('permission.user')} name="user" />
      );

    return (
@@ -154,7 +153,7 @@ class SinglePermission extends React.Component<Props, State> {
        {roleSelector}
        <VCenteredTd>
          <Button
-            label={t("permission.advanced-button.label")}
+            label={t('permission.advanced-button.label')}
            action={this.handleDetailedPermissionsPressed}
          />
        </VCenteredTd>
@@ -177,11 +176,15 @@ class SinglePermission extends React.Component<Props, State> {
  };

  handleDetailedPermissionsPressed = () => {
-    this.setState({ showAdvancedDialog: true });
+    this.setState({
+      showAdvancedDialog: true,
+    });
  };

  closeAdvancedPermissionsDialog = () => {
-    this.setState({ showAdvancedDialog: false });
+    this.setState({
+      showAdvancedDialog: false,
+    });
  };

  submitAdvancedPermissionsDialog = (newVerbs: string[]) => {
@@ -189,9 +192,13 @@ class SinglePermission extends React.Component<Props, State> {
    this.setState(
      {
        showAdvancedDialog: false,
-        permission: { ...permission, role: undefined, verbs: newVerbs }
+        permission: {
+          ...permission,
+          role: undefined,
+          verbs: newVerbs,
+        },
      },
-      () => this.modifyPermissionVerbs(newVerbs)
+      () => this.modifyPermissionVerbs(newVerbs),
    );
  };

@@ -199,9 +206,13 @@ class SinglePermission extends React.Component<Props, State> {
    const { permission } = this.state;
    this.setState(
      {
-        permission: { ...permission, role: role, verbs: undefined }
+        permission: {
+          ...permission,
+          role: role,
+          verbs: undefined,
+        },
      },
-      () => this.modifyPermissionRole(role)
+      () => this.modifyPermissionRole(role),
    );
  };

@@ -216,7 +227,7 @@ class SinglePermission extends React.Component<Props, State> {
    this.props.modifyPermission(
      permission,
      this.props.namespace,
-      this.props.repoName
+      this.props.repoName,
    );
  };

@@ -226,7 +237,7 @@ class SinglePermission extends React.Component<Props, State> {
    this.props.modifyPermission(
      permission,
      this.props.namespace,
-      this.props.repoName
+      this.props.repoName,
    );
  };
 }
@@ -237,16 +248,19 @@ const mapStateToProps = (state, ownProps) => {
    state,
    ownProps.namespace,
    ownProps.repoName,
-    permission
+    permission,
  );
  const deleteLoading = isDeletePermissionPending(
    state,
    ownProps.namespace,
    ownProps.repoName,
-    permission
+    permission,
  );

-  return { loading, deleteLoading };
+  return {
+    loading,
+    deleteLoading,
+  };
 };

 const mapDispatchToProps = dispatch => {
@@ -254,20 +268,20 @@ const mapDispatchToProps = dispatch => {
    modifyPermission: (
      permission: Permission,
      namespace: string,
-      repoName: string
+      repoName: string,
    ) => {
      dispatch(modifyPermission(permission, namespace, repoName));
    },
    deletePermission: (
      permission: Permission,
      namespace: string,
-      repoName: string
+      repoName: string,
    ) => {
      dispatch(deletePermission(permission, namespace, repoName));
-    }
+    },
  };
 };
 export default connect(
  mapStateToProps,
-  mapDispatchToProps
-)(translate("repos")(SinglePermission));
+  mapDispatchToProps,
+)(translate('repos')(SinglePermission));