Keyboard shortcuts for global and repository-specific navigation (#2122)

The global navigation can be accessed with the following key combination:

Option-R = Repositories
Option-U = User
Option-G = Groups
Option-A = Administration

The navigation within a repository can be accessed with a combination with g:

gi = Information
gb = Branches
gt = Tags
gc = Code
gs = Settings
This commit is contained in:
Florian Scholdei
2022-09-26 10:36:09 +02:00
committed by GitHub
parent af9aaec095
commit abad4d504a
4 changed files with 59 additions and 8 deletions

View File

@@ -23,7 +23,7 @@
*/
import React, { useEffect, useState } from "react";
import { match as Match } from "react-router";
import { Link as RouteLink, Redirect, Route, RouteProps, Switch, useRouteMatch } from "react-router-dom";
import { Link as RouteLink, Redirect, Route, RouteProps, Switch, useHistory, useRouteMatch } from "react-router-dom";
import { useTranslation } from "react-i18next";
import { binder, ExtensionPoint, extensionPoints } from "@scm-manager/ui-extensions";
import { Changeset, Link } from "@scm-manager/ui-types";
@@ -62,6 +62,7 @@ import CompareRoot from "../compare/CompareRoot";
import TagRoot from "../tags/container/TagRoot";
import { useIndexLinks, useNamespaceAndNameContext, useRepository } from "@scm-manager/ui-api";
import styled from "styled-components";
import useShortcut from "../../shortcuts/useShortcut";
const TagGroup = styled.span`
& > * {
@@ -96,6 +97,31 @@ const RepositoryRoot = () => {
const [showHealthCheck, setShowHealthCheck] = useState(false);
const [t] = useTranslation("repos");
const context = useNamespaceAndNameContext();
const history = useHistory();
const url = urls.matchedUrlFromMatch(match);
useShortcut("g i", () => {
history.push(`${url}/info`);
});
useShortcut("g b", () => {
if (repository && repository._links["branches"]) {
history.push(`${url}/branches/`);
}
});
useShortcut("g t", () => {
if (repository && repository._links["tags"]) {
history.push(`${url}/tags/`);
}
});
useShortcut("g c", () => {
if (repository && repository._links[getCodeLinkname()]) {
history.push(evaluateDestinationForCodeLink());
}
});
useShortcut("g s", () => {
history.push(`${url}/settings/general`);
});
useEffect(() => {
if (repository) {
@@ -118,8 +144,6 @@ const RepositoryRoot = () => {
return <Loading />;
}
const url = urls.matchedUrlFromMatch(match);
// props used for extensions
// most of the props required for compatibility
const props = {