npm package: @sftech/ng-shared
Description: Shared Angular components, base classes, and utilities for building CRUD applications with OData support and PrimeNG.
Latest version: 1.0.2

# @sftech/ng-shared

Shared Angular components, base classes, and utilities for building CRUD applications with OData support and PrimeNG.

## Installation

```bash
npm install @sftech/ng-shared
```

## Peer Dependencies

- `@angular/common` >= 19.0.0
- `@angular/core` >= 19.0.0
- `@fortawesome/angular-fontawesome` >= 3.0.0
- `@fortawesome/free-solid-svg-icons` >= 6.7.0
- PrimeNG >= 19.0.0

## Configuration

Pass your `IAppConfig` to modules that depend on `ng-shared`:

```typescript
import { IAppConfig } from '@sftech/ng-shared';

export const appConfig: IAppConfig = {
    apiUrl: 'http://localhost:3000',
    baseUrl: 'http://localhost:4200',
};
```

## Base Classes

### BaseListComponent

Abstract base for paginated list views with OData support.

```typescript
import { BaseListComponent } from '@sftech/ng-shared';

@Component({ ... })
export class MyListComponent extends BaseListComponent<MyModel, MyCreateDto, MyUpdateDto, MyResponseDto> {
    protected _repo = inject(MyService);
    protected _route = 'my-items';
}
```

Provides: `data()` signal, `_loadData()`, `updateOdata()`, `openDisplay()`, pagination via `PaginatorComponent`.

### BaseDisplayComponent

Abstract base for detail/edit views with form handling.

```typescript
import { BaseDisplayComponent } from '@sftech/ng-shared';

@Component({ ... })
export class MyDisplayComponent extends BaseDisplayComponent<MyModel, MyUpdateDto, MyUpdateDto, MyResponseDto> {
    protected override _repo = inject(MyService);
    protected override _route = 'my-items';

    protected override initializeForm(): FormGroup { ... }
    protected override getNewModel(): MyModel { ... }
    protected override mapFormToUpdateDto(): MyUpdateDto { ... }
    protected override mapFormToCreateDto(): MyCreateDto { ... }
}
```

Provides: `model()` signal, `isNew()` signal, `submitForm()`, `deleteData()`, `goBack()`.

### BaseDisplayModalComponent

Lightweight base for modal display components. Provides `id` and `canEdit` inputs.

### BaseDbApiService

Abstract base for HTTP services with CRUD and OData support.

```typescript
import { BaseDbApiService } from '@sftech/ng-shared';

@Injectable({ providedIn: 'root' })
export class MyService extends BaseDbApiService<MyModel, MyCreateDto, MyUpdateDto, MyResponseDto> {
    protected override _entityUrlPath = '/api/my-items';
    protected override _mapToModel(dto: MyResponseDto): MyModel { ... }
}
```

Provides: `getAll(odata?)`, `get(id)`, `insert(dto)`, `update(id, dto)`, `delete(id)`.

### BaseDialogComponent

Base for PrimeNG DynamicDialog components. Provides `close(result)` method and `DynamicDialogRef` injection.

## OData Query Builder

```typescript
import { Odata, OdataFilterCollection, OdataFilter, OdataPagination, ODataOrder, EFilterOperator, EFilterTypes, ESortDirection } from '@sftech/ng-shared';

const odata = new Odata();
const filter = new OdataFilterCollection();
filter.addAnd(new OdataFilter('name', 'test', EFilterOperator.CONTAINS, EFilterTypes.STRING));
odata.filter = filter;
odata.pagination = new OdataPagination(1, 10);
odata.orderBy = ODataOrder.create('name', ESortDirection.ASC);
```

## UI Components

- **PaginatorComponent** — Wraps PrimeNG paginator with OData integration
- **FormErrorDisplayComponent** — Displays form validation errors
- **SidebarNavigationComponent** — Sidebar layout with navigation
- **HeadMainFooterWithCanvasComponent** — Header/content/footer layout
- **BaseDialogComponent** — Dialog wrapper for PrimeNG DynamicDialog
- **NotPermittedComponent** — 403 page

## Exports

All public types are exported via `@sftech/ng-shared`:

- Configuration: `IAppConfig`, `appConfigLoader`
- DTOs: `IBaseDbCreateDto`, `IBaseDbUpdateDto`, `IBaseDbResponseDto`, `IODataResponseDto`, `IApiResponseDto`
- Models: `BaseDbModel`, `MappedApiResponse`, `MappedApiError`, `MappedOdataResponse`
- OData: `Odata`, `OdataFilter`, `OdataFilterCollection`, `EFilterConcatenation`, `OdataExpands`, `OdataPagination`, `ODataOrder`
- Enums: `EFilterOperator`, `EFilterTypes`, `ESortDirection`
- Services: `BaseDbApiService`
- Providers: `IconProvider`

## Development

```bash
npx nx build ng-shared
npx nx lint ng-shared
```

## License

MIT