refactor: Apply new code style and write Stories for Git components

backend/capellacollab/settings/modelsources/git/routes.py

@@ -91,7 +91,7 @@ def edit_git_instance(
         )
     ],
 )
-def delete_git_instances(
+def delete_git_instance(
     git_instance: models.DatabaseGitInstance = fastapi.Depends(
         injectables.get_existing_git_instance
     ),

frontend/src/app/app-routing.module.ts

@@ -16,6 +16,7 @@ import { SessionComponent } from 'src/app/sessions/session/session.component';
 import { ConfigurationSettingsComponent } from 'src/app/settings/core/configuration-settings/configuration-settings.component';
 import { PipelinesOverviewComponent } from 'src/app/settings/core/pipelines-overview/pipelines-overview.component';
 import { CreateToolComponent } from 'src/app/settings/core/tools-settings/create-tool/create-tool.component';
+import { AddGitInstanceComponent } from 'src/app/settings/modelsources/git-settings/add-git-instance/add-git-instance.component';
 import { BasicAuthTokenComponent } from 'src/app/users/basic-auth-token/basic-auth-token.component';
 import { UserWrapperComponent } from 'src/app/users/user-wrapper/user-wrapper.component';
 import { UsersProfileComponent } from 'src/app/users/users-profile/users-profile.component';
@@ -394,16 +395,30 @@ export const routes: Routes = [
             data: { breadcrumb: undefined },
             children: [
               {
-                path: 'git',
+                path: 'git-instances',
                 data: { breadcrumb: 'Git Instances' },
                 children: [
                   {
                     path: '',
                     data: { breadcrumb: undefined },
-                    component: GitSettingsComponent,
+                    children: [{ path: '', component: GitSettingsComponent }],
                   },
                   {
-                    path: 'instances/:id',
+                    path: 'create',
+                    data: { breadcrumb: 'new' },
+                    component: AddGitInstanceComponent,
+                  },
+                ],
+              },
+              {
+                path: 'git-instance',
+                data: {
+                  breadcrumb: 'Git Instances',
+                  redirect: '/settings/modelsources/git-instances',
+                },
+                children: [
+                  {
+                    path: ':id',
                     data: {
                       breadcrumb: (data: Data) => data.gitInstance?.name,
                     },

frontend/src/app/general/auth/auth/auth.stories.ts

@@ -2,11 +2,11 @@
  * SPDX-FileCopyrightText: Copyright DB InfraGO AG and contributors
  * SPDX-License-Identifier: Apache-2.0
  */
-import { ActivatedRoute, convertToParamMap, Params } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
-import { BehaviorSubject } from 'rxjs';
 import { MetadataService } from 'src/app/general/metadata/metadata.service';
 import { mockMetadata, MockMetadataService } from 'src/storybook/metadata';
+import { MockActivedRoute } from 'src/storybook/routes';
 import { AuthComponent } from './auth.component';
 
 const meta: Meta<AuthComponent> = {
@@ -33,19 +33,6 @@ const meta: Meta<AuthComponent> = {
 export default meta;
 type Story = StoryObj<AuthComponent>;
 
-export class MockActivedRoute {
-  _queryParams = new BehaviorSubject<Params>({});
-  queryParams = this._queryParams.asObservable();
-
-  _queryParamMap = new BehaviorSubject(convertToParamMap({}));
-  queryParamMap = this._queryParamMap.asObservable();
-
-  constructor(params: Params) {
-    this._queryParams.next(params);
-    this._queryParamMap.next(convertToParamMap(params));
-  }
-}
-
 export const IdentityProviderError: Story = {
   decorators: [
     moduleMetadata({

frontend/src/app/projects/models/model-detail/model-detail.component.html

@@ -4,7 +4,7 @@
  -->
 
 <h2 class="mb-2 text-xl font-medium">Git repositories</h2>
-<div class="flex flex-wrap gap-2">
+<div class="flex flex-wrap gap-5">
   <a [routerLink]="['..', 'git-model', 'create']" class="w-full sm:w-fit">
     <div matRipple class="mat-card-overview new collab-card">
       <div class="content">
@@ -61,7 +61,7 @@ <h2 class="mb-2 text-xl font-medium">Git repositories</h2>
   userService.user?.role === "administrator"
 ) {
   <h2 class="mb-2 mt-5 text-xl font-medium">TeamForCapella repositories</h2>
-  <div class="flex flex-wrap gap-2">
+  <div class="flex flex-wrap gap-5">
     <a
       [routerLink]="['..', 't4c-model', 'create-existing']"
       class="w-full sm:w-fit"