diff --git a/scm-ui/ui-components/src/OverviewPageActions.tsx b/scm-ui/ui-components/src/OverviewPageActions.tsx index 4cbffb32ef..633bc07d52 100644 --- a/scm-ui/ui-components/src/OverviewPageActions.tsx +++ b/scm-ui/ui-components/src/OverviewPageActions.tsx @@ -21,13 +21,13 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ -import React from "react"; -import { withRouter, RouteComponentProps } from "react-router-dom"; +import React, { FC } from "react"; +import { useHistory, useLocation } from "react-router-dom"; import classNames from "classnames"; import { Button, DropDown, urls } from "./index"; import { FilterInput } from "./forms"; -type Props = RouteComponentProps & { +type Props = { showCreateButton: boolean; currentGroup: string; groups: string[]; @@ -35,41 +35,33 @@ type Props = RouteComponentProps & { groupSelected: (namespace: string) => void; label?: string; testId?: string; + searchPlaceholder?: string; }; -class OverviewPageActions extends React.Component { - render() { - const { history, currentGroup, groups, location, link, testId, groupSelected } = this.props; - const groupSelector = groups && ( -
- -
- ); +const OverviewPageActions: FC = ({ + groups, + currentGroup, + showCreateButton, + link, + groupSelected, + label, + testId, + searchPlaceholder +}) => { + const history = useHistory(); + const location = useLocation(); + const groupSelector = groups && ( +
+ +
+ ); - return ( -
- {groupSelector} -
- { - history.push(`/${link}/?q=${filter}`); - }} - testId={testId + "-filter"} - /> -
- {this.renderCreateButton()} -
- ); - } - - renderCreateButton() { - const { showCreateButton, link, label } = this.props; + const renderCreateButton = () => { if (showCreateButton) { return (
@@ -78,7 +70,24 @@ class OverviewPageActions extends React.Component { ); } return null; - } -} + }; -export default withRouter(OverviewPageActions); + return ( +
+ {groupSelector} +
+ { + history.push(`/${link}/?q=${filter}`); + }} + testId={testId + "-filter"} + /> +
+ {renderCreateButton()} +
+ ); +}; + +export default OverviewPageActions; diff --git a/scm-ui/ui-webapp/public/locales/de/groups.json b/scm-ui/ui-webapp/public/locales/de/groups.json index 65035781b6..a351a3eda1 100644 --- a/scm-ui/ui-webapp/public/locales/de/groups.json +++ b/scm-ui/ui-webapp/public/locales/de/groups.json @@ -25,6 +25,9 @@ "setPermissionsNavLink": "Berechtigungen" } }, + "overview": { + "searchGroup": "Gruppe suchen" + }, "add-group": { "title": "Gruppe erstellen", "subtitle": "Erstellen einer neuen Gruppe" diff --git a/scm-ui/ui-webapp/public/locales/de/repos.json b/scm-ui/ui-webapp/public/locales/de/repos.json index d95ef44970..151c6844b5 100644 --- a/scm-ui/ui-webapp/public/locales/de/repos.json +++ b/scm-ui/ui-webapp/public/locales/de/repos.json @@ -42,7 +42,9 @@ "title": "Repositories", "subtitle": "Übersicht aller verfügbaren Repositories", "noRepositories": "Keine Repositories gefunden.", - "createButton": "Repository erstellen" + "createButton": "Repository erstellen", + "searchRepository": "Repository suchen", + "allNamespaces": "Alle Namespaces" }, "create": { "title": "Repository erstellen", diff --git a/scm-ui/ui-webapp/public/locales/de/users.json b/scm-ui/ui-webapp/public/locales/de/users.json index 80d251e6b3..271caff650 100644 --- a/scm-ui/ui-webapp/public/locales/de/users.json +++ b/scm-ui/ui-webapp/public/locales/de/users.json @@ -30,6 +30,9 @@ "noUsers": "Keine Benutzer gefunden.", "createButton": "Benutzer erstellen" }, + "overview": { + "searchUser": "Benutzer suchen" + }, "singleUser": { "errorTitle": "Fehler", "errorSubtitle": "Unbekannter Benutzer Fehler", diff --git a/scm-ui/ui-webapp/public/locales/en/groups.json b/scm-ui/ui-webapp/public/locales/en/groups.json index 069013e5d0..944d271071 100644 --- a/scm-ui/ui-webapp/public/locales/en/groups.json +++ b/scm-ui/ui-webapp/public/locales/en/groups.json @@ -25,6 +25,9 @@ "setPermissionsNavLink": "Permissions" } }, + "overview": { + "searchGroup": "Search group" + }, "add-group": { "title": "Create Group", "subtitle": "Create a new group" diff --git a/scm-ui/ui-webapp/public/locales/en/repos.json b/scm-ui/ui-webapp/public/locales/en/repos.json index 59981282df..6bb4043c91 100644 --- a/scm-ui/ui-webapp/public/locales/en/repos.json +++ b/scm-ui/ui-webapp/public/locales/en/repos.json @@ -42,7 +42,9 @@ "title": "Repositories", "subtitle": "Overview of available repositories", "noRepositories": "No repositories found.", - "createButton": "Create Repository" + "createButton": "Create Repository", + "searchRepository": "Search repository", + "allNamespaces": "All namespaces" }, "create": { "title": "Create Repository", diff --git a/scm-ui/ui-webapp/public/locales/en/users.json b/scm-ui/ui-webapp/public/locales/en/users.json index 627e2b80aa..877675bc85 100644 --- a/scm-ui/ui-webapp/public/locales/en/users.json +++ b/scm-ui/ui-webapp/public/locales/en/users.json @@ -44,6 +44,9 @@ "setApiKeyNavLink": "API Keys" } }, + "overview": { + "searchUser": "Search user" + }, "createUser": { "title": "Create User", "subtitle": "Create a new user" diff --git a/scm-ui/ui-webapp/src/groups/containers/Groups.tsx b/scm-ui/ui-webapp/src/groups/containers/Groups.tsx index 7fe45d0163..2584239ce0 100644 --- a/scm-ui/ui-webapp/src/groups/containers/Groups.tsx +++ b/scm-ui/ui-webapp/src/groups/containers/Groups.tsx @@ -92,7 +92,12 @@ class Groups extends React.Component { {this.renderGroupTable()} {this.renderCreateButton()} - + ); diff --git a/scm-ui/ui-webapp/src/repos/components/list/RepositoryGroupEntry.tsx b/scm-ui/ui-webapp/src/repos/components/list/RepositoryGroupEntry.tsx index 936c5c2ebb..a2c342f51f 100644 --- a/scm-ui/ui-webapp/src/repos/components/list/RepositoryGroupEntry.tsx +++ b/scm-ui/ui-webapp/src/repos/components/list/RepositoryGroupEntry.tsx @@ -23,21 +23,25 @@ */ import React from "react"; import { Link } from "react-router-dom"; -import { CardColumnGroup, RepositoryEntry } from "@scm-manager/ui-components"; +import { CardColumnGroup, Icon, RepositoryEntry } from "@scm-manager/ui-components"; import { RepositoryGroup } from "@scm-manager/ui-types"; -import { Icon } from "@scm-manager/ui-components"; import { WithTranslation, withTranslation } from "react-i18next"; +import styled from "styled-components"; type Props = WithTranslation & { group: RepositoryGroup; }; +const SizedIcon = styled(Icon)` + font-size: 1.33rem; +`; + class RepositoryGroupEntry extends React.Component { render() { const { group, t } = this.props; const settingsLink = group.namespace?._links?.permissions && ( - + ); const namespaceHeader = ( diff --git a/scm-ui/ui-webapp/src/repos/containers/Overview.tsx b/scm-ui/ui-webapp/src/repos/containers/Overview.tsx index 0dae2f03d9..de5be31591 100644 --- a/scm-ui/ui-webapp/src/repos/containers/Overview.tsx +++ b/scm-ui/ui-webapp/src/repos/containers/Overview.tsx @@ -101,8 +101,12 @@ class Overview extends React.Component { } }; + getNamespaceFilterPlaceholder = () => { + return this.props.t("overview.allNamespaces"); + }; + namespaceSelected = (newNamespace: string) => { - if (newNamespace === "") { + if (newNamespace === this.getNamespaceFilterPlaceholder()) { this.props.history.push("/repos/"); } else { this.props.history.push(`/repos/${newNamespace}/`); @@ -111,8 +115,10 @@ class Overview extends React.Component { render() { const { error, loading, showCreateButton, namespace, namespaces, t } = this.props; - - const namespacesToRender = namespaces ? ["", ...namespaces._embedded.namespaces.map(n => n.namespace).sort()] : []; + const namespaceFilterPlaceholder = this.getNamespaceFilterPlaceholder(); + const namespacesToRender = namespaces + ? [namespaceFilterPlaceholder, ...namespaces._embedded.namespaces.map(n => n.namespace).sort()] + : []; return ( @@ -126,6 +132,7 @@ class Overview extends React.Component { link="repos" label={t("overview.createButton")} testId="repository-overview" + searchPlaceholder={t("overview.searchRepository")} /> diff --git a/scm-ui/ui-webapp/src/users/containers/Users.tsx b/scm-ui/ui-webapp/src/users/containers/Users.tsx index d0d4adc9dc..fbae53f084 100644 --- a/scm-ui/ui-webapp/src/users/containers/Users.tsx +++ b/scm-ui/ui-webapp/src/users/containers/Users.tsx @@ -93,7 +93,12 @@ class Users extends React.Component { {this.renderUserTable()} {this.renderCreateButton()} - + );