Skip to content
Snippets Groups Projects
Commit a5cb49e2 authored by OZGCloud's avatar OZGCloud
Browse files

OZG-5981 OZG-6008 Add header component

parent 4f644d78
Branches
Tags
No related merge requests found
......@@ -28,6 +28,7 @@ import { NgModule } from '@angular/core';
import { DownloadButtonComponent } from '@ods/component';
import {
AttachmentComponent,
AttachmentHeaderComponent,
AttachmentWrapperComponent,
CloseIconComponent,
SpinnerIconComponent,
......@@ -50,6 +51,7 @@ import { VerticalBinaryFileListComponent } from './vertical-binary-file-list/ver
UiModule,
TechSharedModule,
AttachmentComponent,
AttachmentHeaderComponent,
AttachmentWrapperComponent,
SpinnerIconComponent,
CloseIconComponent,
......
......@@ -23,14 +23,19 @@
unter der Lizenz sind dem Lizenztext zu entnehmen.
-->
<ozgcloud-spinner [stateResource]="binaryFileListStateResource">
<ozgcloud-spinner
*ngIf="binaryFileListStateResource.resource"
[stateResource]="binaryFileListStateResource"
>
<ods-attachment-wrapper [title]="title" data-test-id="file-list">
<ods-attachment-header [title]="title">
<alfa-download-archive-file-button-container
*ngIf="archiveDownloadUri"
data-test-class="download-archive-file-button"
[downloadUri]="archiveDownloadUri"
action-buttons
></alfa-download-archive-file-button-container>
></alfa-download-archive-file-button-container
></ods-attachment-header>
<ng-container
*ngFor="
let binaryFileResource of binaryFileListStateResource.resource
......
export * from './lib/attachment-header/attachment-header.component';
export * from './lib/attachment-wrapper/attachment-wrapper.component';
export * from './lib/attachment/attachment.component';
export * from './lib/bescheid-status-text/bescheid-status-text.component';
......
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AttachmentHeaderComponent } from './attachment-header.component';
describe('AttachmentHeaderComponent', () => {
let component: AttachmentHeaderComponent;
let fixture: ComponentFixture<AttachmentHeaderComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [AttachmentHeaderComponent],
}).compileComponents();
fixture = TestBed.createComponent(AttachmentHeaderComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { CommonModule } from '@angular/common';
import { Component, Input } from '@angular/core';
@Component({
selector: 'ods-attachment-header',
standalone: true,
imports: [CommonModule],
template: `<div class="flex items-center justify-between px-3 py-2">
<h4 class="text-sm font-medium text-text">{{ title }}</h4>
<ng-content select="[action-buttons]"></ng-content>
</div>`,
})
export class AttachmentHeaderComponent {
@Input() title: string = '';
}
import { argsToTemplate, moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
import { DownloadButtonComponent } from '../../../../design-component/src/lib/download-button/download-button.component';
import { AttachmentComponent } from '../attachment/attachment.component';
import { AttachmentHeaderComponent } from './attachment-header.component';
const meta: Meta<AttachmentHeaderComponent> = {
title: 'Attachment header',
component: AttachmentHeaderComponent,
parameters: {
docs: {
description: {
component: 'Header may contain title and/or buttons',
},
},
},
decorators: [
moduleMetadata({
imports: [AttachmentHeaderComponent, AttachmentComponent, DownloadButtonComponent],
}),
],
excludeStories: /.*Data$/,
tags: ['autodocs'],
};
export default meta;
type Story = StoryObj<AttachmentHeaderComponent>;
export const Default: Story = {
args: {
title: 'Anhänge',
},
argTypes: {
title: {
description: 'Title for group of files',
},
},
render: (args) => ({
props: args,
template: `<ods-attachment-header ${argsToTemplate(args)}>
<ods-download-button action-buttons />
</ods-attachment-header>`,
}),
};
import { CommonModule } from '@angular/common';
import { Component, Input } from '@angular/core';
import { Component } from '@angular/core';
@Component({
selector: 'ods-attachment-wrapper',
......@@ -8,12 +8,6 @@ import { Component, Input } from '@angular/core';
styles: [
':host {@apply flex flex-col overflow-hidden rounded-md shadow shadow-grayborder border border-grayborder empty:hidden}',
],
template: `<div class="flex items-center justify-between px-3 py-2">
<h4 *ngIf="title" class="text-sm font-medium text-text">{{ title }}</h4>
<ng-content select="[action-buttons]"></ng-content>
</div>
<ng-content></ng-content>`,
template: `<ng-content></ng-content>`,
})
export class AttachmentWrapperComponent {
@Input() title: string = '';
}
export class AttachmentWrapperComponent {}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment