# @isa/remission/feature/remission-return-receipt-list

Feature component providing a comprehensive list view of all return receipts with filtering, sorting, and action capabilities.

## Overview

The Remission Return Receipt List feature displays all return receipts (Warenbegleitscheine) in a filterable, sortable list view. It separates completed and incomplete receipts, provides date-based sorting, and integrates with return-receipt-actions for management operations. The component uses resource-based data fetching for optimal performance.

## Features

- **Completed/Incomplete Separation** - Separate resource fetching
- **Date Sorting** - Sort by created or completed date
- **Filtering** - FilterService integration with query params
- **Action Integration** - Delete, continue, complete buttons
- **Resource Pattern** - Efficient parallel data fetching
- **Reload Capability** - Refresh list after actions
- **Responsive Layout** - Card-based list design
- **Empty States** - User-friendly empty list views

## Quick Start

```typescript
import { RemissionReturnReceiptListComponent } from '@isa/remission/feature/remission-return-receipt-list';

// In routes
{
  path: 'receipts',
  component: RemissionReturnReceiptListComponent
}
```

## Component API

### RemissionReturnReceiptListComponent

Standalone list component for return receipts.

**Selector**: `remi-remission-return-receipt-list`

**Computed Signals**:
```typescript
orderDateBy = computed(() => filterService.orderBy().find(o => o.selected));
completedRemissionReturnsResourceValue = computed(() => completedResource.value() || []);
incompletedRemissionReturnsResourceValue = computed(() => incompletedResource.value() || []);
returns = computed(() => {
  // Combines and sorts completed + incomplete
  // Flattens receipts into [Return, Receipt] tuples
});
```

**Methods**:
- `reloadList(): void` - Reload both completed and incomplete resources

## Resources

### CompletedRemissionReturnsResource

Fetches completed return receipts.

**API**: `/api/remission/returns?completed=true`

### IncompletedRemissionReturnsResource

Fetches incomplete return receipts.

**API**: `/api/remission/returns?completed=false`

## Sorting

**Sort Fields**:
- `created` - Receipt creation date
- `completed` - Receipt completion date

**Sort Direction**:
- `asc` - Ascending (oldest first)
- `desc` - Descending (newest first)

**Implementation**:
```typescript
const compareFn = (a: string, b: string) => {
  return (orderBy.dir === 'desc' ? compareDesc : compareAsc)(a, b);
};

completed = orderByKey(completed, 'created', compareFn);
incompleted = orderByKey(incompleted, 'created', compareFn);
```

## Usage Example

```typescript
import { Component } from '@angular/core';
import { RemissionReturnReceiptListComponent } from '@isa/remission/feature/remission-return-receipt-list';

@Component({
  selector: 'app-receipts-page',
  imports: [RemissionReturnReceiptListComponent],
  template: `
    <div class="page-container">
      <h1>Return Receipts</h1>
      <remi-remission-return-receipt-list></remi-remission-return-receipt-list>
    </div>
  `
})
export class ReceiptsPageComponent {}
```

## Components

### ReturnReceiptListItemComponent

Individual receipt list item.

**Features**:
- Receipt metadata display
- Status indicator (completed/incomplete)
- Item count
- Action buttons

### ReturnReceiptListCardComponent

Card wrapper for list items.

## Query Settings

**Default Configuration**:
```typescript
{
  orderBy: [
    { by: 'created', label: 'Erstellungsdatum', dir: 'desc', selected: true },
    { by: 'completed', label: 'Abschlussdatum', dir: 'desc', selected: false }
  ]
}
```

## Data Structure

**Return Receipt Tuple**:
```typescript
type ReturnReceiptTuple = [Return, Receipt];

// Return contains:
{
  id: number;
  returnGroup: string;
  completed: boolean;
  receipts: Array<{ id: number; data: Receipt }>;
}

// Receipt contains:
{
  number: string;
  created: string;
  completed?: string;
  items: ReceiptItem[];
}
```

## Testing

```bash
npx nx test remission-return-receipt-list --skip-nx-cache
```

## Dependencies

- `@angular/core` - Angular framework
- `@angular/router` - Routing
- `@isa/remission/data-access` - Return types
- `@isa/shared/filter` - FilterService
- `@isa/ui/buttons` - Button components
- `date-fns` - Date comparison utilities

## Architecture Notes

**Parallel Resource Fetching**: Completed and incomplete receipts are fetched in parallel for optimal performance.

**Tuple Flattening**: Returns with multiple receipts are flattened into [Return, Receipt] tuples for easier iteration.

**Filter Integration**: Uses FilterService with query parameter synchronization for shareable filtered views.

## License

Internal ISA Frontend library - not for external distribution.
