merge + add user/group autocomplete ui-components

scm-ui/package.json

@@ -54,7 +54,7 @@
     "pre-commit": "jest && flow && eslint src"
   },
   "devDependencies": {
-    "@scm-manager/ui-bundler": "^0.0.28",
+    "@scm-manager/ui-bundler": "^0.0.29",
     "concat": "^1.0.3",
     "copyfiles": "^2.0.0",
     "enzyme": "^3.3.0",

scm-ui/public/locales/de/commons.json

@@ -19,11 +19,11 @@
       "subtitle": "Ein unbekannter Fehler ist aufgetreten."
     }
   },
-  "error-notification": {
+  "errorNotification": {
     "prefix": "Fehler",
     "loginLink": "Erneute Anmeldung",
     "timeout": "Die Session ist abgelaufen.",
-    "wrong-login-credentials": "Ungültige Anmeldedaten",
+    "wrongLoginCredentials": "Ungültige Anmeldedaten",
     "forbidden": "Sie haben nicht die Berechtigung, diesen Datensatz zu sehen"
   },
   "loading": {
@@ -40,6 +40,15 @@
     "config": "Einstellungen"
   },
   "filterEntries": "Einträge filtern",
+  "autocomplete": {
+    "group": "Gruppe",
+    "user": "Benutzer",
+    "no-group-options": "Kein Gruppenname als Vorschlag verfügbar",
+    "group-placeholder": "Gruppe eingeben",
+    "no-user-options": "Kein Benutzername als Vorschlag verfügbar",
+    "user-placeholder": "Benutzer eingeben",
+    "loading": "suche..."
+  },
   "paginator": {
     "next": "Weiter",
     "previous": "Zurück"

scm-ui/public/locales/de/repos.json

@@ -150,13 +150,6 @@
       "roleHelpText": "READ = read; WRITE = read und write; OWNER = read, write und auch die Möglichkeit Einstellungen und Berechtigungen zu verwalten. Wenn hier nichts angezeigt wird, den Erweitert-Button benutzen, um Details zu sehen.",
       "permissionsHelpText": "Hier können individuelle Berechtigungen unabhängig von vordefinierten Rollen vergeben werden."
     },
-    "autocomplete": {
-      "no-group-options": "Kein Gruppenname als Vorschlag verfügbar",
-      "group-placeholder": "Gruppe eingeben",
-      "no-user-options": "Kein Benutzername als Vorschlag verfügbar",
-      "user-placeholder": "Benutzer eingeben",
-      "loading": "suche..."
-    },
     "advanced": {
       "dialog": {
         "title": "Erweiterte Berechtigungen",

scm-ui/public/locales/en/commons.json

@@ -19,11 +19,11 @@
       "subtitle": "Unknown error occurred"
     }
   },
-  "error-notification": {
+  "errorNotification": {
     "prefix": "Error",
     "loginLink": "You can login here again.",
     "timeout": "The session has expired",
-    "wrong-login-credentials": "Invalid credentials",
+    "wrongLoginCredentials": "Invalid credentials",
     "forbidden": "You don't have permission to view this entity"
   },
   "loading": {
@@ -40,6 +40,15 @@
     "config": "Configuration"
   },
   "filterEntries": "filter entries",
+  "autocomplete": {
+    "group": "Group",
+    "user": "User",
+    "noGroupOptions": "No group suggestion available",
+    "groupPlaceholder": "Enter group",
+    "noUserOptions": "No user suggestion available",
+    "userPlaceholder": "Enter user",
+    "loading": "Loading..."
+  },
   "paginator": {
     "next": "Next",
     "previous": "Previous"

scm-ui/public/locales/en/repos.json

@@ -153,13 +153,6 @@
       "roleHelpText": "READ = read; WRITE = read and write; OWNER = read, write and also the ability to manage the properties and permissions. If nothing is selected here, use the 'Advanced' Button to see detailed permissions.",
       "permissionsHelpText": "Use this to specify your own set of permissions regardless of predefined roles."
     },
-    "autocomplete": {
-      "no-group-options": "No group suggestion available",
-      "group-placeholder": "Enter group",
-      "no-user-options": "No user suggestion available",
-      "user-placeholder": "Enter user",
-      "loading": "Loading..."
-    },
     "advanced": {
       "dialog": {
         "title": "Advanced Permissions",

scm-ui/src/containers/Login.js

@@ -95,7 +95,7 @@ class Login extends React.Component<Props, State> {
   areCredentialsInvalid() {
     const { t, error } = this.props;
     if (error instanceof UnauthorizedError) {
-      return new Error(t("error-notification.wrong-login-credentials"));
+      return new Error(t("errorNotification.wrongLoginCredentials"));
     } else {
       return error;
     }

scm-ui/src/repos/permissions/components/GroupAutocomplete.js

@@ -1,56 +0,0 @@
-// @flow
-import React from "react";
-import { translate } from "react-i18next";
-import { Autocomplete } from "@scm-manager/ui-components";
-import type { SelectValue } from "@scm-manager/ui-types";
-
-type Props = {
-  groupAutocompleteLink: string,
-  valueSelected: SelectValue => void,
-  value: string,
-
-  // Context props
-  t: string => string
-};
-
-class GroupAutocomplete extends React.Component<Props> {
-  loadGroupSuggestions = (inputValue: string) => {
-    const url = this.props.groupAutocompleteLink;
-    const link = url + "?q=";
-    return fetch(link + inputValue)
-      .then(response => response.json())
-      .then(json => {
-        return json.map(element => {
-          const label = element.displayName
-            ? `${element.displayName} (${element.id})`
-            : element.id;
-          return {
-            value: element,
-            label
-          };
-        });
-      });
-  };
-
-  selectName = (selection: SelectValue) => {
-    this.props.valueSelected(selection);
-  };
-
-  render() {
-    const { t, value } = this.props;
-    return (
-      <Autocomplete
-        loadSuggestions={this.loadGroupSuggestions}
-        label={t("permission.group")}
-        noOptionsMessage={t("permission.autocomplete.no-group-options")}
-        loadingMessage={t("permission.autocomplete.loading")}
-        placeholder={t("permission.autocomplete.group-placeholder")}
-        valueSelected={this.selectName}
-        value={value}
-        creatable={true}
-      />
-    );
-  }
-}
-
-export default translate("repos")(GroupAutocomplete);

scm-ui/src/repos/permissions/components/UserAutocomplete.js

@@ -1,56 +0,0 @@
-// @flow
-import React from "react";
-import { translate } from "react-i18next";
-import { Autocomplete } from "@scm-manager/ui-components";
-import type { SelectValue } from "@scm-manager/ui-types";
-
-type Props = {
-  userAutocompleteLink: string,
-  valueSelected: SelectValue => void,
-  value: string,
-
-  // Context props
-  t: string => string
-};
-
-class UserAutocomplete extends React.Component<Props> {
-  loadUserSuggestions = (inputValue: string) => {
-    const url = this.props.userAutocompleteLink;
-    const link = url + "?q=";
-    return fetch(link + inputValue)
-      .then(response => response.json())
-      .then(json => {
-        return json.map(element => {
-          const label = element.displayName
-            ? `${element.displayName} (${element.id})`
-            : element.id;
-          return {
-            value: element,
-            label
-          };
-        });
-      });
-  };
-
-  selectName = (selection: SelectValue) => {
-    this.props.valueSelected(selection);
-  };
-
-  render() {
-    const { t, value } = this.props;
-    return (
-      <Autocomplete
-        loadSuggestions={this.loadUserSuggestions}
-        label={t("permission.user")}
-        noOptionsMessage={t("permission.autocomplete.no-user-options")}
-        loadingMessage={t("permission.autocomplete.loading")}
-        placeholder={t("permission.autocomplete.user-placeholder")}
-        valueSelected={this.selectName}
-        value={value}
-        creatable={true}
-      />
-    );
-  }
-}
-
-export default translate("repos")(UserAutocomplete);

scm-ui/src/repos/permissions/containers/CreatePermissionForm.js

@@ -12,12 +12,12 @@ import {
   SubmitButton,
   Button,
   LabelWithHelpIcon,
-  Radio
+  Radio,
+  GroupAutocomplete,
+  UserAutocomplete
 } from "@scm-manager/ui-components";
 import * as validator from "../components/permissionValidation";
 import RoleSelector from "../components/RoleSelector";
-import GroupAutocomplete from "../components/GroupAutocomplete";
-import UserAutocomplete from "../components/UserAutocomplete";
 import AdvancedPermissionsDialog from "./AdvancedPermissionsDialog";
 import { findVerbsForRole } from "../modules/permissions";