@barcidev/ngx-autogen 0.1.3 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,366 +1,352 @@
1
- # ngx-autogen
2
-
3
- [![Language: English](https://img.shields.io/badge/lang-en-blue.svg)](README.md)
4
- [![Language: Spanish](https://img.shields.io/badge/lang-es-yellow.svg)](README.es.md)
5
-
6
- **ngx-autogen** is a set of schematics designed to optimize and standardize the workflow in Angular projects. This library provides code generation tools that follow best practices, allowing developers to save time on repetitive tasks and architecture configuration.
7
-
8
- ## 🚀 Features
9
-
10
- The project is initially launched with a focus on state management, but is designed to grow:
11
-
12
- - **Store Schematic**: Our first available schematic. It allows you to automatically generate the entire structure needed for a store based on signals (NGRX-Signals), facilitating the quick and scalable integration of state management in your applications.
13
-
14
- ## 📅 Coming Soon
15
-
16
- **ngx-autogen** is a project in continuous evolution. New tools and schematics will be progressively added to cover more aspects of Angular development, such as:
17
-
18
- - Generation of services and utilities.
19
- - Scaffolding for advanced components.
20
-
21
- ## 📦 Installation
22
-
23
- You can install the package in your Angular project using Angular CLI so that the project is automatically configured with the necessary dependencies:
24
-
25
- ```bash
26
- ng add @barcidev/ngx-autogen
27
- ```
28
-
29
- ## 🛠️ Usage
30
-
31
- ### Generate a Store
32
-
33
- #### Properties
34
-
35
- - `name` (required): name of the store.
36
- - `pk` (optional): name of the primary key. If not specified, the one specified during the schematic installation process will be used; otherwise, `id` will be used.
37
- - `path` (optional): path of the store. If not specified, the one specified during the schematic installation process will be used; otherwise, `src/app/core` will be used.
38
-
39
- #### Example
40
-
41
- ```bash
42
- ng g app-store --name="user" --pk="cod"
43
- ```
44
-
45
- This will create the files `user.model.ts`, `user.service.ts`, `user.store.ts` within the `src/app/core/user` folder, the `entity.model.ts` file if it doesn't exist within the `src/app/core/common/entity` folder, and the `index.ts` file within the `src/app/core` folder.
46
-
47
- ```bash
48
- common/
49
- └── entity/
50
- └── entity.model.ts
51
- user/
52
- ├── user.service.ts
53
- ├── user.model.ts
54
- └── user.store.ts
55
- index.ts
56
- ```
57
-
58
- The `index.ts` file will export everything necessary so that the store can be imported and used anywhere in the application.
59
-
60
- ```bash
61
- /* USER */
62
- export * from './user/user.model';
63
- export * from './user/user.service';
64
- export * from './user/user.store';
65
- ```
66
-
67
- The `entity.model.ts` file contains the interfaces and types necessary for state and form management.
68
-
69
- ```bash
70
- import { FormControl } from '@angular/forms';
71
-
72
- export interface EntityStatus {
73
- addError?: Error | null;
74
- addLoading?: boolean;
75
- removeError?: Error | null;
76
- removeLoading?: boolean;
77
- error: Error | null;
78
- idsRemoving?: (number | string)[];
79
- idSelected?: null | number | string;
80
- idsUpdating?: (number | string)[];
81
- loaded: boolean;
82
- loading: boolean;
83
- selectedError?: Error | null;
84
- selectedLoading?: boolean;
85
- updateError?: Error | null;
86
- updateLoading?: boolean;
87
- }
88
-
89
- export type FormGroupType<T> = {
90
- [K in keyof T]: FormControl<T[K]>;
91
- };
92
- ```
93
-
94
- The `user.model.ts` file contains the data model interface.
95
-
96
- ```bash
97
- import { FormGroupType } from '../common/form/form.model';
98
-
99
- export interface AddUser {
100
- }
101
-
102
- export type AddUserForm = FormGroupType<AddUser>;
103
-
104
- export interface UserDto {
105
- cod: number;
106
- }
107
-
108
- export type UpdateUser = Partial<UserDto> & Pick<UserDto, 'cod'>;
109
-
110
- export interface UserRequest{}
111
- ```
112
-
113
- The `user.service.ts` file contains the service responsible for business logic.
114
-
115
- ```bash
116
- import { Injectable } from '@angular/core';
117
- import { Observable, of } from 'rxjs';
118
- import {
119
- AddUser,
120
- UserDto,
121
- UpdateUser
122
- } from './user.model';
123
-
124
- @Injectable({
125
- providedIn: 'root'
126
- })
127
- export class UserService {
128
-
129
- addUser$(entity: AddUser): Observable<number> {
130
- return of(0);
131
- }
132
-
133
- removeUser$(cod: number): Observable<boolean> {
134
- return of(true);
135
- }
136
-
137
- getUsers$(): Observable<UserDto[]> {
138
- return of([]);
139
- }
140
-
141
- updateUser$(entity: UpdateUser): Observable<boolean> {
142
- return of(true);
143
- }
144
- }
145
- ```
146
-
147
- The `user.store.ts` file contains the store responsible for state management.
148
-
149
- ```bash
150
- import { computed, inject } from '@angular/core';
151
- import { patchState, signalStore, type, withComputed, withHooks, withMethods, withState } from '@ngrx/signals';
152
- import {
153
- addEntity,
154
- entityConfig,
155
- removeEntity,
156
- setAllEntities,
157
- updateEntity,
158
- withEntities
159
- } from '@ngrx/signals/entities';
160
- import { rxMethod } from '@ngrx/signals/rxjs-interop';
161
- import { catchError, of, pipe, switchMap, tap } from 'rxjs';
162
-
163
- import { EntityStatus } from '../common/entity/entity.model';
164
- import {
165
- UserDto,
166
- AddUser,
167
- UpdateUser
168
- } from './user.model';
169
- import { UserService } from './user.service';
170
-
171
- const initialStatus: EntityStatus = {
172
- error: null,
173
- loaded: false,
174
- loading: false,
175
- };
176
-
177
- const config = entityConfig({
178
- entity: type<UserDto>(),
179
- selectId: (entity) => entity.cod,
180
- });
181
-
182
- export const UserStore = signalStore(
183
- withEntities(config),
184
- withState({
185
- _status: initialStatus,
186
- }),
187
- withComputed(({ entityMap, _status }) => ({
188
- users: computed(() => Object.values(entityMap())),
189
- userSeleccionado: computed(() => {
190
- const cod = _status().idSelected;
191
- return cod ? entityMap()[cod] : null;
192
- }),
193
- error: computed(() => _status().error),
194
- loaded: computed(() => _status().loaded),
195
- loading: computed(() => _status().loading),
196
- loadingRemove: computed(
197
- () => (cod?: number) =>
198
- (cod ? _status().idsRemoving?.includes(cod) : _status().removeLoading) || false
199
- ),
200
- loadingUpdate: computed(
201
- () => (cod?: number) =>
202
- (cod ? _status().idsUpdating?.includes(cod) : _status().updateLoading) || false
203
- ),
204
- })),
205
- withMethods((store, userService = inject(UserService)) => ({
206
- addUser: rxMethod<AddUser>(
207
- pipe(
208
- tap(() => {
209
- patchState(store, { _status: { ...store._status(), addLoading: true } });
210
- }),
211
- switchMap((entity) => {
212
- return userService.addUser$(entity).pipe(
213
- tap((cod) => {
214
- patchState(store, addEntity({ ...entity, cod }, config), {
215
- _status: {
216
- ...store._status(),
217
- addLoading: false,
218
- error: null,
219
- },
220
- });
221
- }),
222
- catchError(() => {
223
- patchState(store, {
224
- _status: {
225
- ...store._status(),
226
- addLoading: false,
227
- error: new Error('Error adding user'),
228
- },
229
- });
230
- return of(entity);
231
- })
232
- );
233
- })
234
- )
235
- ),
236
- loadUsers: rxMethod<void>(
237
- pipe(
238
- tap(() => {
239
- patchState(store, { _status: { ...store._status(), loading: true } });
240
- }),
241
- switchMap(() => {
242
- return userService.getUsers$().pipe(
243
- tap((response) => {
244
- patchState(store, setAllEntities(response, config), {
245
- _status: {
246
- ...store._status(),
247
- error: null,
248
- loaded: true,
249
- loading: false,
250
- },
251
- });
252
- }),
253
- catchError(() => {
254
- patchState(store, {
255
- _status: {
256
- ...store._status(),
257
- error: new Error('Error loading users'),
258
- loading: false,
259
- },
260
- });
261
- return of([]);
262
- })
263
- );
264
- })
265
- )
266
- ),
267
- removeUser: rxMethod<number>(
268
- pipe(
269
- tap((cod) => {
270
- patchState(store, {
271
- _status: {
272
- ...store._status(),
273
- removeLoading: true,
274
- idsRemoving: [...(store._status().idsRemoving || []), cod],
275
- },
276
- });
277
- }),
278
- switchMap((cod) => {
279
- return userService.removeUser$(cod).pipe(
280
- tap((success) => {
281
- if (success) {
282
- const idsRemoving = store._status().idsRemoving || [];
283
- patchState(store, removeEntity(cod), {
284
- _status: {
285
- ...store._status(),
286
- removeLoading: false,
287
- error: null,
288
- idsRemoving: idsRemoving.filter((idRemoving) => idRemoving !== cod),
289
- },
290
- });
291
- } else {
292
- throw new Error('Error deleting user');
293
- }
294
- }),
295
- catchError(() => {
296
- const idsRemoving = store._status().idsRemoving || [];
297
- patchState(store, {
298
- _status: {
299
- ...store._status(),
300
- removeLoading: false,
301
- error: new Error('Error deleting user'),
302
- idsRemoving: idsRemoving.filter((idRemoving) => idRemoving !== cod),
303
- },
304
- });
305
- return of(false);
306
- })
307
- );
308
- })
309
- )
310
- ),
311
- updateUser: rxMethod<UpdateUser>(
312
- pipe(
313
- tap((entity) => {
314
- patchState(store, {
315
- _status: {
316
- ...store._status(),
317
- idsUpdating: [...(store._status().idsUpdating || []), entity.cod],
318
- updateLoading: true,
319
- },
320
- });
321
- }),
322
- switchMap((entity) => {
323
- return userService.updateUser$(entity).pipe(
324
- tap((success) => {
325
- if (success) {
326
- const idsUpdating = store._status().idsUpdating || [];
327
- patchState(store, updateEntity({ changes: entity, id: entity.cod }, config), {
328
- _status: {
329
- ...store._status(),
330
- error: null,
331
- idsUpdating: idsUpdating.filter((idUpdating) => idUpdating !== entity.cod),
332
- updateLoading: false,
333
- },
334
- });
335
- } else {
336
- throw new Error('Error updating user');
337
- }
338
- }),
339
- catchError(() => {
340
- const idsUpdating = store._status().idsUpdating || [];
341
- patchState(store, {
342
- _status: {
343
- ...store._status(),
344
- error: new Error('Error updating user'),
345
- idsUpdating: idsUpdating.filter((idUpdating) => idUpdating !== entity.cod),
346
- updateLoading: false,
347
- },
348
- });
349
- return of(false);
350
- })
351
- );
352
- })
353
- )
354
- ),
355
- })),
356
- withHooks({
357
- onInit: (store) => {
358
- store.loadUsers();
359
- },
360
- })
361
- );
362
- ```
363
-
364
- ## 📄 License
365
-
366
- This project is under the [MIT](LICENSE) license.
1
+ # ngx-autogen
2
+
3
+ [![Language: English](https://img.shields.io/badge/lang-en-blue.svg)](README.md)
4
+ [![Language: Spanish](https://img.shields.io/badge/lang-es-yellow.svg)](README.es.md)
5
+
6
+ **ngx-autogen** is a set of schematics designed to optimize and standardize the workflow in Angular projects. This library provides code generation tools that follow best practices, allowing developers to save time on repetitive tasks and architecture configuration.
7
+
8
+ ## 🚀 Features
9
+
10
+ The project is initially launched with a focus on state management, but is designed to grow:
11
+
12
+ - **Store Schematic**: Our first available schematic. It allows you to automatically generate the entire structure needed for a store based on signals (NGRX-Signals), facilitating the quick and scalable integration of state management in your applications.
13
+
14
+ ## 📅 Coming Soon
15
+
16
+ **ngx-autogen** is a project in continuous evolution. New tools and schematics will be progressively added to cover more aspects of Angular development, such as:
17
+
18
+ - Generation of services and utilities.
19
+ - Scaffolding for advanced components.
20
+
21
+ ## 📦 Installation
22
+
23
+ You can install the package in your Angular project using Angular CLI so that the project is automatically configured with the necessary dependencies:
24
+
25
+ ```bash
26
+ ng add ngx-autogen
27
+ ```
28
+
29
+ ## 🛠️ Usage
30
+
31
+ ### Generate a Store
32
+
33
+ #### Properties
34
+
35
+ - `name` (required): name of the store.
36
+ - `pk` (optional): name of the primary key. If not specified, the one specified during the schematic installation process will be used; otherwise, `id` will be used.
37
+ - `path` (optional): path of the store. If not specified, the one specified during the schematic installation process will be used; otherwise, `src/app/core` will be used. The folder `state` will be automatically appended to the path.
38
+ - `grouped` (optional): if true, the files will be grouped into subfolders `models`, `services`, and `store`.
39
+
40
+ #### Example
41
+
42
+ ```bash
43
+ ng g app-store --name="user" --pk="cod"
44
+ ```
45
+
46
+ This will create the files `user.model.ts`, `user.service.ts`, `user.store.ts` within the `src/app/core/state/user` folder, and the files `entity.model.ts`, `with-entity-pagination.ts`, and `with-entity-status.ts` if they don't exist within the `src/app/shared/state` folder.
47
+
48
+ ```bash
49
+ src/
50
+ └── app/
51
+ └── shared/
52
+ └── state/
53
+ ├── entity.model.ts
54
+ ├── with-entity-pagination.ts
55
+ └── with-entity-status.ts
56
+ └── state/
57
+ └── index.ts
58
+ └── user/
59
+ ├── user.service.ts
60
+ ├── user.model.ts
61
+ └── user.store.ts
62
+ ```
63
+
64
+ The `index.ts` file will export everything necessary so that the store can be imported and used anywhere in the application.
65
+
66
+ ```typescript
67
+ /* USER */
68
+ export * from './user/user.model';
69
+ export * from './user/user.service';
70
+ export * from './user/user.store';
71
+ ```
72
+
73
+ The `src/app/shared/state` folder contains the shared files for state management.
74
+
75
+ `entity.model.ts`:
76
+
77
+ ```typescript
78
+ import { HttpErrorResponse } from '@angular/common/http';
79
+ import { FormControl } from '@angular/forms';
80
+
81
+ export type FormGroupType<T> = {
82
+ [K in keyof T]: FormControl<T[K]>;
83
+ };
84
+
85
+ export interface RequestConfig<T, U = unknown> {
86
+ onError?: (error?: HttpErrorResponse) => void;
87
+ onSuccess?: (response?: U) => void;
88
+ payload: T;
89
+ }
90
+ ```
91
+
92
+ The `user.model.ts` file contains the data model interface.
93
+
94
+ ```typescript
95
+ import { FormGroupType } from 'src/app/shared/state/entity.model';
96
+
97
+ export interface AddUser {
98
+ }
99
+
100
+ export type AddUserForm = FormGroupType<AddUser>;
101
+
102
+ export interface UserDto {
103
+ cod: number;
104
+ }
105
+
106
+ export type UpdateUser = Partial<UserDto> & Pick<UserDto, 'cod'>;
107
+
108
+ export interface UserRequest{}
109
+ ```
110
+
111
+ The `user.service.ts` file contains the service responsible for business logic.
112
+
113
+ ```typescript
114
+ import { Injectable } from '@angular/core';
115
+ import { Observable, of } from 'rxjs';
116
+ import {
117
+ AddUser,
118
+ UserDto,
119
+ UpdateUser
120
+ } from './user.model';
121
+
122
+ @Injectable({
123
+ providedIn: 'root'
124
+ })
125
+ export class UserService {
126
+
127
+ addUser$(entity: AddUser): Observable<number> {
128
+ return of(0);
129
+ }
130
+
131
+ removeUser$(cod: number): Observable<boolean> {
132
+ return of(true);
133
+ }
134
+
135
+ getUsers$(): Observable<UserDto[]> {
136
+ return of([]);
137
+ }
138
+
139
+ updateUser$(entity: UpdateUser): Observable<boolean> {
140
+ return of(true);
141
+ }
142
+ }
143
+ ```
144
+
145
+ The `user.store.ts` file contains the store responsible for state management.
146
+
147
+ ```typescript
148
+ import { computed, inject } from '@angular/core';
149
+ import { patchState, signalStore, type, withComputed, withHooks, withMethods, withState } from '@ngrx/signals';
150
+ import {
151
+ addEntity,
152
+ entityConfig,
153
+ removeEntity,
154
+ setAllEntities,
155
+ updateEntity,
156
+ withEntities
157
+ } from '@ngrx/signals/entities';
158
+ import { rxMethod } from '@ngrx/signals/rxjs-interop';
159
+ import { catchError, of, pipe, switchMap, tap } from 'rxjs';
160
+
161
+ import { RequestConfig } from 'src/app/shared/state/entity.model';
162
+ import { withPagination } from 'src/app/shared/state/with-entity-pagination';
163
+ import { withEntityStatus } from 'src/app/shared/state/with-entity-status';
164
+ import {
165
+ AddUser,
166
+ UserDto,
167
+ UpdateUser
168
+ } from './user.model';
169
+ import { UserService } from './user.service';
170
+
171
+ const config = entityConfig({
172
+ entity: type<UserDto>(),
173
+ selectId: (entity) => entity.cod,
174
+ });
175
+
176
+ export const UserStore = signalStore(
177
+ withEntities(config),
178
+ withEntityStatus(),
179
+ withPagination(),
180
+ withComputed(({ entities, entityMap, status: { idSelected } }) => ({
181
+ users: computed(() => entities()),
182
+ userSeleccionado: computed(() => {
183
+ const cod = idSelected();
184
+ return cod ? entityMap()[cod] : null;
185
+ })
186
+ })),
187
+ withMethods((store, userService = inject(UserService)) => ({
188
+ addUser: rxMethod<RequestConfig<AddUser, UserDto>>(
189
+ pipe(
190
+ tap(() => {
191
+ patchState(store, (state) => ({ status: { ...state.status, addLoading: true } }));
192
+ }),
193
+ switchMap(({ onError, onSuccess, payload: { request } }) => {
194
+ return userService.addUser$(request).pipe(
195
+ tap((cod) => {
196
+ const newUser: UserDto = { ...request, cod};
197
+ patchState(store, addEntity(newUser, config), (state) => ({
198
+ ...state,
199
+ status: { ...state.status, addError: null, addLoading: false }
200
+ }));
201
+ if (onSuccess) {
202
+ onSuccess(newUser);
203
+ }
204
+ }),
205
+ catchError(() => {
206
+ const error = new Error('');
207
+ patchState(store, (state) => ({
208
+ status: { ...state.status, addError: error, addLoading: false }
209
+ }));
210
+ if (onError) {
211
+ onError();
212
+ }
213
+ return EMPTY;
214
+ })
215
+ );
216
+ })
217
+ )
218
+ ),
219
+ loadUsers: rxMethod<void>(
220
+ pipe(
221
+ tap(() => {
222
+ patchState(store, (state) => ({ status: { ...state.status, loading: true } }));
223
+ }),
224
+ switchMap(() => {
225
+ return userService.getUsers$().pipe(
226
+ tap((response) => {
227
+ patchState(store, setAllEntities(response, config), (state) => ({
228
+ status: { ...state.status, error: null, loaded: true, loading: false }
229
+ }));
230
+ }),
231
+ catchError(() => {
232
+ patchState(store, (state) => ({
233
+ status: { ...state.status, error: new Error('Error al cargar users'), loading: false }
234
+ }));
235
+ return EMPTY;
236
+ })
237
+ );
238
+ })
239
+ )
240
+ ),
241
+ removeUser: rxMethod<RequestConfig<number, boolean>>(
242
+ pipe(
243
+ tap(({ payload }) => {
244
+ patchState(store, (state) => ({
245
+ status: {
246
+ ...state.status,
247
+ _removeLoading: true,
248
+ idsRemoving: [...(state.status.idsRemoving || []), payload]
249
+ }
250
+ }));
251
+ }),
252
+ switchMap(({ onError, onSuccess, payload }) => {
253
+ return userService.removeUser$(payload).pipe(
254
+ tap((response) => {
255
+ if (response) {
256
+ const idsRemoving = store.status.idsRemoving() || [];
257
+ patchState(store, removeEntity(payload), (state) => ({
258
+ status: {
259
+ ...state.status,
260
+ _removeLoading: false,
261
+ error: null,
262
+ idsRemoving: idsRemoving.filter((idRemoving) => idRemoving !== payload)
263
+ }
264
+ }));
265
+ if (onSuccess) {
266
+ onSuccess(response);
267
+ }
268
+ } else {
269
+ throw new Error();
270
+ }
271
+ }),
272
+ catchError(() => {
273
+ const idsRemoving = store.status.idsRemoving() || [];
274
+ patchState(store, (state) => ({
275
+ status: {
276
+ ...state.status,
277
+ _removeLoading: false,
278
+ error: new Error(),
279
+ idsRemoving: idsRemoving.filter((idRemoving) => idRemoving !== payload)
280
+ }
281
+ }));
282
+ if (onError) {
283
+ onError();
284
+ }
285
+ return EMPTY;
286
+ })
287
+ );
288
+ })
289
+ )
290
+ ),
291
+ updateUser: rxMethod<RequestConfig<UpdateUser, boolean>>(
292
+ pipe(
293
+ tap(({ payload }) => {
294
+ patchState(store, (state) => ({
295
+ status: {
296
+ ...state.status,
297
+ _updateLoading: true,
298
+ idsUpdating: [...(state.status.idsUpdating || []), payload.cod]
299
+ }
300
+ }));
301
+ }),
302
+ switchMap(({ onError, onSuccess, payload }) => {
303
+ return userService.updateUser$(entity).pipe(
304
+ tap((response) => {
305
+ if (response) {
306
+ const idsUpdating = store.status.idsUpdating() || [];
307
+ patchState(store, updateEntity({ changes: payload, id: payload.cod }, config), (state) => ({
308
+ status: {
309
+ ...state.status,
310
+ _updateLoading: false,
311
+ error: null,
312
+ idsUpdating: idsUpdating.filter((idUpdating) => idUpdating !== payload.cod)
313
+ }
314
+ }));
315
+ if (onSuccess) {
316
+ onSuccess(response);
317
+ }
318
+ } else {
319
+ throw new Error('');
320
+ }
321
+ }),
322
+ catchError(() => {
323
+ const idsUpdating = store.status.idsUpdating() || [];
324
+ patchState(store, (state) => ({
325
+ status: {
326
+ ...state.status,
327
+ _updateLoading: false,
328
+ error: new Error('Error al actualizar user'),
329
+ idsUpdating: idsUpdating.filter((idUpdating) => idUpdating !== payload.cod)
330
+ }
331
+ }));
332
+ if (onError) {
333
+ onError();
334
+ }
335
+ return EMPTY;
336
+ })
337
+ );
338
+ })
339
+ )
340
+ ),
341
+ })),
342
+ withHooks({
343
+ onInit: (store) => {
344
+ store.loadUsers();
345
+ },
346
+ })
347
+ );
348
+ ```
349
+
350
+ ## 📄 License
351
+
352
+ This project is under the [MIT](LICENSE) license.