Merge pull request 'ozg-6300-accordion-zusammenarbeit' (#716) from...

Merge pull request 'ozg-6300-accordion-zusammenarbeit' (#716) from ozg-6300-accordion-zusammenarbeit into master

Reviewed-on: https://git.ozg-sh.de/ozgcloud-app/alfa/pulls/716


Reviewed-by: OZGCloud <ozgcloud@mgm-tp.com>

alfa-client/libs/collaboration/.eslintrc.json

+{
+  "extends": ["../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "extends": ["plugin:@nx/angular", "plugin:@angular-eslint/template/process-inline-templates"],
+      "rules": {
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "alfa",
+            "style": "camelCase"
+          }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "alfa",
+            "style": "kebab-case"
+          }
+        ]
+      }
+    },
+    {
+      "files": ["*.html"],
+      "extends": ["plugin:@nx/angular-template"],
+      "rules": {}
+    }
+  ]
+}

alfa-client/libs/collaboration/README.md

+# collaboration
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test collaboration` to execute the unit tests.

alfa-client/libs/collaboration/jest.config.ts

+/* eslint-disable */
+export default {
+  displayName: 'collaboration',
+  preset: '../../jest.preset.js',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  coverageDirectory: '../../coverage/libs/collaboration',
+  transform: {
+    '^.+\\.(ts|mjs|js|html)$': [
+      'jest-preset-angular',
+      {
+        tsconfig: '<rootDir>/tsconfig.spec.json',
+        stringifyContentPathRegex: '\\.(html|svg)$',
+      },
+    ],
+  },
+  transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
+  snapshotSerializers: [
+    'jest-preset-angular/build/serializers/no-ng-attributes',
+    'jest-preset-angular/build/serializers/ng-snapshot',
+    'jest-preset-angular/build/serializers/html-comment',
+  ],
+};

alfa-client/libs/collaboration/project.json

+{
+  "name": "collaboration",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/collaboration/src",
+  "prefix": "alfa",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "test": {
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/libs/collaboration"],
+      "options": {
+        "tsConfig": "libs//collaboration/tsconfig.spec.json",
+        "jestConfig": "libs/collaboration/jest.config.ts"
+      }
+    },
+    "lint": {
+      "executor": "@nx/eslint:lint"
+    }
+  }
+}

alfa-client/libs/collaboration/src/index.ts

+export * from './lib/collaboration-in-vorgang-container/collaboration-in-vorgang-container.component';
+export * from './lib/collaboration.module';

alfa-client/libs/collaboration/src/lib/collaboration-in-vorgang-container/collaboration-in-vorgang-container.component.html

+<ods-button variant="outline" text="Anfrage erstellen" dataTestId="anfrage-erstellen-button">
+  <ods-collaboration-icon icon />
+</ods-button>

alfa-client/libs/collaboration/src/lib/collaboration-in-vorgang-container/collaboration-in-vorgang-container.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ButtonComponent, CollaborationIconComponent, SaveIconComponent } from '@ods/system';
+import { MockComponent } from 'ng-mocks';
+import { CollaborationInVorgangContainerComponent } from './collaboration-in-vorgang-container.component';
+
+describe('CollaborationInVorgangContainerComponent', () => {
+  let component: CollaborationInVorgangContainerComponent;
+  let fixture: ComponentFixture<CollaborationInVorgangContainerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ButtonComponent, SaveIconComponent],
+      declarations: [
+        CollaborationInVorgangContainerComponent,
+        MockComponent(CollaborationIconComponent),
+      ],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(CollaborationInVorgangContainerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

alfa-client/libs/collaboration/src/lib/collaboration-in-vorgang-container/collaboration-in-vorgang-container.component.ts

+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'alfa-collaboration-in-vorgang-container',
+  templateUrl: './collaboration-in-vorgang-container.component.html',
+})
+export class CollaborationInVorgangContainerComponent {}

alfa-client/libs/collaboration/src/lib/collaboration.module.spec.ts

+import { TestBed } from '@angular/core/testing';
+import { CollaborationModule } from './collaboration.module';
+
+describe('CollaborationModule', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [CollaborationModule],
+    }).compileComponents();
+  });
+
+  it('should create', () => {
+    expect(CollaborationModule).toBeDefined();
+  });
+});

alfa-client/libs/collaboration/src/lib/collaboration.module.ts

+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { ButtonComponent, CollaborationIconComponent } from '@ods/system';
+import { CollaborationInVorgangContainerComponent } from './collaboration-in-vorgang-container/collaboration-in-vorgang-container.component';
+
+@NgModule({
+  imports: [CommonModule, ButtonComponent, CollaborationIconComponent],
+  declarations: [CollaborationInVorgangContainerComponent],
+  exports: [CollaborationInVorgangContainerComponent],
+})
+export class CollaborationModule {}

alfa-client/libs/collaboration/src/test-setup.ts

+import '@testing-library/jest-dom';
+import 'jest-preset-angular/setup-jest';
+
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting,
+} from '@angular/platform-browser-dynamic/testing';
+
+getTestBed().resetTestEnvironment();
+getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
+  teardown: { destroyAfterEach: false },
+  errorOnUnknownProperties: true,
+  errorOnUnknownElements: true,
+});

alfa-client/libs/collaboration/tsconfig.json

+{
+  "extends": "../../tsconfig.base.json",
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ],
+  "compilerOptions": {
+    "target": "es2022"
+  }
+}

alfa-client/libs/collaboration/tsconfig.lib.json

+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": ["src/**/*.spec.ts", "src/test-setup.ts", "jest.config.ts", "src/**/*.test.ts"],
+  "include": ["src/**/*.ts"]
+}

alfa-client/libs/collaboration/tsconfig.spec.json

+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "target": "es2016",
+    "types": ["jest", "node"]
+  },
+  "files": ["src/test-setup.ts"],
+  "include": ["jest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts", "src/**/*.d.ts"]
+}

alfa-client/libs/design-system/src/index.ts

@@ -14,6 +14,7 @@ export * from './lib/icons/attachment-icon/attachment-icon.component';
 export * from './lib/icons/bescheid-generate-icon/bescheid-generate-icon.component';
 export * from './lib/icons/bescheid-upload-icon/bescheid-upload-icon.component';
 export * from './lib/icons/close-icon/close-icon.component';
+export * from './lib/icons/collaboration-icon/collaboration-icon.component';
 export * from './lib/icons/exclamation-icon/exclamation-icon.component';
 export * from './lib/icons/file-icon/file-icon.component';
 export * from './lib/icons/iconVariants';

alfa-client/libs/design-system/src/lib/button/button.component.ts

@@ -6,7 +6,10 @@ import { IconVariants } from '../icons/iconVariants';
 import { SpinnerIconComponent } from '../icons/spinner-icon/spinner-icon.component';
 
 export const buttonVariants = cva(
-  'flex cursor-pointer items-center gap-4 rounded-md font-medium disabled:cursor-wait text-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary',
+  [
+    'flex items-center gap-4 rounded-md disabled:cursor-wait text-sm font-medium box-border',
+    'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus',
+  ],
   {
     variants: {
       variant: {

alfa-client/libs/design-system/src/lib/icons/collaboration-icon/collaboration-icon.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { CollaborationIconComponent } from './collaboration-icon.component';
+
+describe('CollaborationIconComponent', () => {
+  let component: CollaborationIconComponent;
+  let fixture: ComponentFixture<CollaborationIconComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [CollaborationIconComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(CollaborationIconComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

alfa-client/libs/design-system/src/lib/icons/collaboration-icon/collaboration-icon.component.ts

+import { CommonModule } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { twMerge } from 'tailwind-merge';
+import { IconVariants, iconVariants } from '../iconVariants';
+
+@Component({
+  selector: 'ods-collaboration-icon',
+  standalone: true,
+  imports: [CommonModule],
+  template: `<svg
+    viewBox="0 0 24 24"
+    [ngClass]="[twMerge(iconVariants({ size }), 'stroke-primary', class)]"
+    aria-hidden="true"
+    fill="inherit"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M16 21V19C16 17.9391 15.5786 16.9217 14.8284 16.1716C14.0783 15.4214 13.0609 15 12 15H6C4.93913 15 3.92172 15.4214 3.17157 16.1716C2.42143 16.9217 2 17.9391 2 19V21"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      fill="none"
+    />
+    <path
+      d="M9 11C11.2091 11 13 9.20914 13 7C13 4.79086 11.2091 3 9 3C6.79086 3 5 4.79086 5 7C5 9.20914 6.79086 11 9 11Z"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      fill="none"
+    />
+    <path
+      d="M22 20.9999V18.9999C21.9993 18.1136 21.7044 17.2527 21.1614 16.5522C20.6184 15.8517 19.8581 15.3515 19 15.1299"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      fill="none"
+    />
+    <path
+      d="M16 3.12988C16.8604 3.35018 17.623 3.85058 18.1676 4.55219C18.7122 5.2538 19.0078 6.11671 19.0078 7.00488C19.0078 7.89305 18.7122 8.75596 18.1676 9.45757C17.623 10.1592 16.8604 10.6596 16 10.8799"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      fill="none"
+    />
+  </svg>`,
+})
+export class CollaborationIconComponent {
+  @Input() size: IconVariants['size'] = 'medium';
+  @Input() class: string = undefined;
+
+  iconVariants = iconVariants;
+  twMerge = twMerge;
+}

alfa-client/libs/design-system/src/lib/icons/collaboration-icon/collaboration-icon.stories.ts

+import type { Meta, StoryObj } from '@storybook/angular';
+
+import { CollaborationIconComponent } from './collaboration-icon.component';
+
+const meta: Meta<CollaborationIconComponent> = {
+  title: 'Icons/Collaboration icon',
+  component: CollaborationIconComponent,
+  excludeStories: /.*Data$/,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<CollaborationIconComponent>;
+
+export const Default: Story = {
+  args: { size: 'medium' },
+  argTypes: {
+    size: {
+      control: 'select',
+      options: ['small', 'medium', 'large', 'extra-large', 'full'],
+      description: 'Size of icon. Property "full" means 100%',
+      table: {
+        defaultValue: { summary: 'medium' },
+      },
+    },
+  },
+};

alfa-client/libs/vorgang-detail/src/lib/vorgang-detail-page/vorgang-detail-area/vorgang-detail-area.component.html

@@ -52,6 +52,20 @@
         ></alfa-vorgang-detail-formular-buttons>
       </div>
 
+      <div
+        class="section one-column"
+        *ngIf="vorgangResource | hasLink: vorgangWithEingangLinkRel.CREATE_COLLABORATION_REQUEST"
+      >
+        <ozgcloud-expansion-panel
+          headline="Zusammenarbeit"
+          data-test-id="collaboration-expansion-panel"
+        >
+          <alfa-collaboration-in-vorgang-container
+            data-test-id="collaboration-in-voragng-container"
+          ></alfa-collaboration-in-vorgang-container>
+        </ozgcloud-expansion-panel>
+      </div>
+
       <div class="two-column">
         <div
           class="section"