Redesign repository overview (#1740)

Change repository overview layout to use single rows instead cards. Also remove quick links and add clone action to repository entry. The default repository link now leads to the sources view.

Co-authored-by: Sebastian Sdorra <sebastian.sdorra@cloudogu.com>

scm-ui/ui-api/src/branches.ts

@@ -33,7 +33,7 @@ export const useBranches = (repository: Repository): ApiResult<BranchCollection>
   const link = requiredLink(repository, "branches");
   return useQuery<BranchCollection, Error>(
     repoQueryKey(repository, "branches"),
-    () => apiClient.get(link).then(response => response.json())
+    () => apiClient.get(link).then((response) => response.json())
     // we do not populate the cache for a single branch,
     // because we have no pagination for branches and if we have a lot of them
     // the population slows us down
@@ -43,7 +43,7 @@ export const useBranches = (repository: Repository): ApiResult<BranchCollection>
 export const useBranch = (repository: Repository, name: string): ApiResult<Branch> => {
   const link = requiredLink(repository, "branches");
   return useQuery<Branch, Error>(branchQueryKey(repository, name), () =>
-    apiClient.get(concat(link, name)).then(response => response.json())
+    apiClient.get(concat(link, name)).then((response) => response.json())
   );
 };
 
@@ -51,14 +51,14 @@ const createBranch = (link: string) => {
   return (branch: BranchCreation) => {
     return apiClient
       .post(link, branch, "application/vnd.scmm-branchRequest+json;v=2")
-      .then(response => {
+      .then((response) => {
         const location = response.headers.get("Location");
         if (!location) {
           throw new Error("Server does not return required Location header");
         }
         return apiClient.get(location);
       })
-      .then(response => response.json());
+      .then((response) => response.json());
   };
 };
 
@@ -66,23 +66,23 @@ export const useCreateBranch = (repository: Repository) => {
   const queryClient = useQueryClient();
   const link = requiredLink(repository, "branches");
   const { mutate, isLoading, error, data } = useMutation<Branch, Error, BranchCreation>(createBranch(link), {
-    onSuccess: async branch => {
+    onSuccess: async (branch) => {
       queryClient.setQueryData(branchQueryKey(repository, branch), branch);
       await queryClient.invalidateQueries(repoQueryKey(repository, "branches"));
-    }
+    },
   });
   return {
     create: (branch: BranchCreation) => mutate(branch),
     isLoading,
     error,
-    branch: data
+    branch: data,
   };
 };
 
 export const useDeleteBranch = (repository: Repository) => {
   const queryClient = useQueryClient();
   const { mutate, isLoading, error, data } = useMutation<unknown, Error, Branch>(
-    branch => {
+    (branch) => {
       const deleteUrl = (branch._links.delete as Link).href;
       return apiClient.delete(deleteUrl);
     },
@@ -90,13 +90,22 @@ export const useDeleteBranch = (repository: Repository) => {
       onSuccess: async (_, branch) => {
         queryClient.removeQueries(branchQueryKey(repository, branch));
         await queryClient.invalidateQueries(repoQueryKey(repository, "branches"));
-      }
+      },
     }
   );
   return {
     remove: (branch: Branch) => mutate(branch),
     isLoading,
     error,
-    isDeleted: !!data
+    isDeleted: !!data,
   };
 };
+
+type DefaultBranch = { defaultBranch: string };
+
+export const useDefaultBranch = (repository: Repository): ApiResult<DefaultBranch> => {
+  const link = requiredLink(repository, "defaultBranch");
+  return useQuery<DefaultBranch, Error>(branchQueryKey(repository, "__default-branch"), () =>
+    apiClient.get(link).then((response) => response.json())
+  );
+};

scm-ui/ui-api/src/changesets.ts

@@ -32,6 +32,7 @@ import { concat } from "./urls";
 type UseChangesetsRequest = {
   branch?: Branch;
   page?: string | number;
+  limit?: number;
 };
 
 export const changesetQueryKey = (repository: NamespaceAndName, id: string) => {
@@ -53,23 +54,29 @@ export const useChangesets = (
     link = requiredLink(repository, "changesets");
   }
 
-  if (request?.page) {
-    link = `${link}?page=${request.page}`;
+  if (request?.page || request?.limit) {
+    if (request?.page && request?.limit) {
+      link = `${link}?page=${request.page}&limit=${request.limit}`;
+    } else if (request.page) {
+      link = `${link}?page=${request.page}`;
+    } else if (request.limit) {
+      link = `${link}?limit=${request.limit}`;
+    }
   }
 
   const key = branchQueryKey(repository, branch, "changesets", request?.page || 0);
-  return useQuery<ChangesetCollection, Error>(key, () => apiClient.get(link).then(response => response.json()), {
-    onSuccess: changesetCollection => {
-      changesetCollection._embedded.changesets.forEach(changeset => {
+  return useQuery<ChangesetCollection, Error>(key, () => apiClient.get(link).then((response) => response.json()), {
+    onSuccess: (changesetCollection) => {
+      changesetCollection._embedded.changesets.forEach((changeset) => {
         queryClient.setQueryData(changesetQueryKey(repository, changeset.id), changeset);
       });
-    }
+    },
   });
 };
 
 export const useChangeset = (repository: Repository, id: string): ApiResult<Changeset> => {
   const changesetsLink = requiredLink(repository, "changesets");
   return useQuery<Changeset, Error>(changesetQueryKey(repository, id), () =>
-    apiClient.get(concat(changesetsLink, id)).then(response => response.json())
+    apiClient.get(concat(changesetsLink, id)).then((response) => response.json())
   );
 };