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

Merge pull request 'OZG-6676-OZG-7027-bugfix' (#798) from OZG-6676-OZG-7027-bugfix into master

parents 51a78b19 189941ea
No related branches found
No related tags found
No related merge requests found
...@@ -11,9 +11,9 @@ ...@@ -11,9 +11,9 @@
></alfa-collaboration-request-form> ></alfa-collaboration-request-form>
</ng-container> </ng-container>
<ng-template #anfrageErstellenButton> <ng-template #anfrageErstellenButton>
<div class="flex w-fit gap-3 bg-background-100 p-4 shadow-md"> <div class="flex w-111 justify-between bg-background-100 p-4 shadow-md">
<ods-external-unit-icon /> <ods-external-unit-icon />
<div class="flex flex-col text-base"> <div class="flex w-44 flex-col text-base">
<p class="text-primary">Externe Fachstelle</p> <p class="text-primary">Externe Fachstelle</p>
<p class="text-text">Private Organisation,</p> <p class="text-text">Private Organisation,</p>
<p class="text-text">Verein, Schule</p> <p class="text-text">Verein, Schule</p>
......
...@@ -11,9 +11,9 @@ ...@@ -11,9 +11,9 @@
></alfa-collaboration-request-form> ></alfa-collaboration-request-form>
</ng-container> </ng-container>
<ng-template #anfrageErstellenButton> <ng-template #anfrageErstellenButton>
<div class="flex w-fit gap-3 bg-background-100 p-4 shadow-md"> <div class="flex w-111 justify-between bg-background-100 p-4 shadow-md">
<ods-public-administration-icon /> <ods-public-administration-icon />
<div class="flex flex-col text-base"> <div class="flex w-44 flex-col text-base">
<p class="text-primary">Öffentliche Verwaltung</p> <p class="text-primary">Öffentliche Verwaltung</p>
<p class="text-text">Kommune, Amt,</p> <p class="text-text">Kommune, Amt,</p>
<p class="text-text">Ministerium</p> <p class="text-text">Ministerium</p>
......
import { Mock, mock, useFromMock } from '@alfa-client/test-utils'; import { Mock, mock, useFromMock } from '@alfa-client/test-utils';
import { EventEmitter } from '@angular/core'; import { EventEmitter } from '@angular/core';
import { import { ComponentFixture, TestBed, discardPeriodicTasks, fakeAsync, tick } from '@angular/core/testing';
ComponentFixture,
TestBed,
discardPeriodicTasks,
fakeAsync,
tick,
} from '@angular/core/testing';
import { Resource } from '@ngxp/rest'; import { Resource } from '@ngxp/rest';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { InstantSearchComponent } from './instant-search.component'; import { InstantSearchComponent } from './instant-search.component';
...@@ -184,16 +178,13 @@ describe('InstantSearchComponent', () => { ...@@ -184,16 +178,13 @@ describe('InstantSearchComponent', () => {
}); });
describe('on null or undefined', () => { describe('on null or undefined', () => {
it.each([null, undefined])( it.each([null, undefined])('should not call setSearchResults for %s', (searchResults: InstantSearchResult<Resource>[]) => {
'should not call setSearchResults for %s',
(searchResults: InstantSearchResult<Resource>[]) => {
component.setSearchResults = jest.fn(); component.setSearchResults = jest.fn();
component.searchResults = searchResults; component.searchResults = searchResults;
expect(component.setSearchResults).not.toHaveBeenCalled(); expect(component.setSearchResults).not.toHaveBeenCalled();
}, });
);
}); });
}); });
...@@ -274,11 +265,11 @@ describe('InstantSearchComponent', () => { ...@@ -274,11 +265,11 @@ describe('InstantSearchComponent', () => {
}); });
it('should call hideResults', () => { it('should call hideResults', () => {
component.hideResults = jest.fn(); component.searchClosed.emit = jest.fn();
component.handleEscape(event); component.handleEscape(event);
expect(component.hideResults).toHaveBeenCalled(); expect(component.searchClosed.emit).toHaveBeenCalled();
}); });
}); });
...@@ -362,17 +353,13 @@ describe('InstantSearchComponent', () => { ...@@ -362,17 +353,13 @@ describe('InstantSearchComponent', () => {
it('should return text for one result', () => { it('should return text for one result', () => {
const result: string = component.buildAriaLiveText(1); const result: string = component.buildAriaLiveText(1);
expect(result).toBe( expect(result).toBe('Ein Suchergebnis für Eingabe test. Nutze Pfeiltaste nach unten, um das zu erreichen.');
'Ein Suchergebnis für Eingabe test. Nutze Pfeiltaste nach unten, um das zu erreichen.',
);
}); });
it('should return text for many results', () => { it('should return text for many results', () => {
const result: string = component.buildAriaLiveText(4); const result: string = component.buildAriaLiveText(4);
expect(result).toBe( expect(result).toBe('4 Suchergebnisse für Eingabe test. Nutze Pfeiltaste nach unten, um diese zu erreichen.');
'4 Suchergebnisse für Eingabe test. Nutze Pfeiltaste nach unten, um diese zu erreichen.',
);
}); });
it('should return text for no results', () => { it('should return text for no results', () => {
...@@ -396,14 +383,6 @@ describe('InstantSearchComponent', () => { ...@@ -396,14 +383,6 @@ describe('InstantSearchComponent', () => {
expect(component.areResultsVisible).toBe(false); expect(component.areResultsVisible).toBe(false);
}); });
it('should emit searchResultClosed event', () => {
component.searchResultClosed.emit = jest.fn();
component.hideResults();
expect(component.searchResultClosed.emit).toHaveBeenCalled();
});
}); });
describe('onKeydownHandler', () => { describe('onKeydownHandler', () => {
......
...@@ -15,7 +15,7 @@ import { ...@@ -15,7 +15,7 @@ import {
import { FormControl } from '@angular/forms'; import { FormControl } from '@angular/forms';
import { Resource } from '@ngxp/rest'; import { Resource } from '@ngxp/rest';
import { isEqual, isUndefined } from 'lodash-es'; import { isEqual, isUndefined } from 'lodash-es';
import { Subscription, debounceTime, distinctUntilChanged, filter } from 'rxjs'; import { Subscription, debounceTime, filter } from 'rxjs';
import { AriaLiveRegionComponent } from '../../aria-live-region/aria-live-region.component'; import { AriaLiveRegionComponent } from '../../aria-live-region/aria-live-region.component';
import { SearchFieldComponent } from '../search-field/search-field.component'; import { SearchFieldComponent } from '../search-field/search-field.component';
import { SearchResultHeaderComponent } from '../search-result-header/search-result-header.component'; import { SearchResultHeaderComponent } from '../search-result-header/search-result-header.component';
...@@ -74,8 +74,8 @@ export class InstantSearchComponent implements OnInit, OnDestroy { ...@@ -74,8 +74,8 @@ export class InstantSearchComponent implements OnInit, OnDestroy {
} }
} }
@Output() searchClosed: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>();
@Output() searchResultSelected: EventEmitter<InstantSearchResult<Resource>> = new EventEmitter<InstantSearchResult<Resource>>(); @Output() searchResultSelected: EventEmitter<InstantSearchResult<Resource>> = new EventEmitter<InstantSearchResult<Resource>>();
@Output() searchResultClosed: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>();
@Output() searchQueryChanged: EventEmitter<InstantSearchQuery> = new EventEmitter<InstantSearchQuery>(); @Output() searchQueryChanged: EventEmitter<InstantSearchQuery> = new EventEmitter<InstantSearchQuery>();
@Output() searchQueryCleared: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>(); @Output() searchQueryCleared: EventEmitter<MouseEvent> = new EventEmitter<MouseEvent>();
...@@ -99,8 +99,8 @@ export class InstantSearchComponent implements OnInit, OnDestroy { ...@@ -99,8 +99,8 @@ export class InstantSearchComponent implements OnInit, OnDestroy {
this.formControlSubscription = this.control.valueChanges this.formControlSubscription = this.control.valueChanges
.pipe( .pipe(
debounceTime(InstantSearchComponent.DEBOUNCE_TIME_IN_MILLIS), debounceTime(InstantSearchComponent.DEBOUNCE_TIME_IN_MILLIS),
filter((value) => Boolean(value)),
filter((value: string) => value.length >= this.PREVIEW_SEARCH_STRING_MIN_LENGTH), filter((value: string) => value.length >= this.PREVIEW_SEARCH_STRING_MIN_LENGTH),
distinctUntilChanged(),
) )
.subscribe((searchBy: string) => { .subscribe((searchBy: string) => {
this.searchQueryChanged.emit({ searchBy }); this.searchQueryChanged.emit({ searchBy });
...@@ -138,6 +138,7 @@ export class InstantSearchComponent implements OnInit, OnDestroy { ...@@ -138,6 +138,7 @@ export class InstantSearchComponent implements OnInit, OnDestroy {
handleEscape(e: KeyboardEvent): void { handleEscape(e: KeyboardEvent): void {
e.preventDefault(); e.preventDefault();
this.hideResults(); this.hideResults();
this.searchClosed.emit();
} }
setFocusOnResultItem(index: number): void { setFocusOnResultItem(index: number): void {
...@@ -193,7 +194,6 @@ export class InstantSearchComponent implements OnInit, OnDestroy { ...@@ -193,7 +194,6 @@ export class InstantSearchComponent implements OnInit, OnDestroy {
hideResults(): void { hideResults(): void {
this.areResultsVisible = false; this.areResultsVisible = false;
this.focusedResult = undefined; this.focusedResult = undefined;
this.searchResultClosed.emit();
} }
isLastItemOrOutOfArray(index: number, arrayLength: number): boolean { isLastItemOrOutOfArray(index: number, arrayLength: number): boolean {
......
...@@ -6,10 +6,7 @@ const { join } = require('path'); ...@@ -6,10 +6,7 @@ const { join } = require('path');
/** @type {import('tailwindcss').Config} */ /** @type {import('tailwindcss').Config} */
module.exports = { module.exports = {
content: [ content: [join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html}'), ...createGlobPatternsForDependencies(__dirname)],
join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html}'),
...createGlobPatternsForDependencies(__dirname),
],
darkMode: 'class', darkMode: 'class',
theme: { theme: {
extend: { extend: {
...@@ -48,6 +45,9 @@ module.exports = { ...@@ -48,6 +45,9 @@ module.exports = {
maxHeight: { maxHeight: {
120: '480px', 120: '480px',
}, },
width: {
111: '444px',
},
colors: { colors: {
ozgblue: { ozgblue: {
50: 'hsl(200, 100%, 96%)', 50: 'hsl(200, 100%, 96%)',
......
...@@ -7,6 +7,6 @@ ...@@ -7,6 +7,6 @@
(searchResultSelected)="selectSearchResult.emit($event.data)" (searchResultSelected)="selectSearchResult.emit($event.data)"
(searchQueryChanged)="search.emit($event.searchBy)" (searchQueryChanged)="search.emit($event.searchBy)"
(searchQueryCleared)="clearSearchResult.emit()" (searchQueryCleared)="clearSearchResult.emit()"
(searchResultClosed)="clearSearchResult.emit()" (searchClosed)="clearSearchResult.emit()"
></ods-instant-search> ></ods-instant-search>
</form> </form>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment