@ngxs/store 3.8.2 → 18.0.0-dev.master-f4c2c19

package/schematics/src/ng-add/schema.json

@@ -0,0 +1,72 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "SchematicsNgxsNgAdd",
+  "title": "Ngxs NgAdd Options Schema",
+  "type": "object",
+  "properties": {
+    "skipInstall": {
+      "type": "boolean",
+      "description": "The flag for skipping packages installation.",
+      "default": false,
+      "x-prompt": "Do you want to skip packages installation?"
+    },
+    "plugins": {
+      "type": "array",
+      "description": "Additional plugins to be added to the workspace.",
+      "minItems": 0,
+      "maxItems": 7,
+      "items": {
+        "type": "string",
+        "enum": [
+          "@ngxs/devtools-plugin",
+          "@ngxs/form-plugin",
+          "@ngxs/hmr-plugin",
+          "@ngxs/logger-plugin",
+          "@ngxs/router-plugin",
+          "@ngxs/storage-plugin",
+          "@ngxs/websocket-plugin"
+        ]
+      },
+      "default": [],
+      "x-prompt": {
+        "message": "Choose any other @ngxs plugins you would like to add to the workspace.",
+        "type": "list",
+        "items": [
+          {
+            "value": "@ngxs/devtools-plugin",
+            "label": "Ngxs developer tools plugin"
+          },
+          {
+            "value": "@ngxs/form-plugin",
+            "label": "Ngxs form plugin"
+          },
+          {
+            "value": "@ngxs/hmr-plugin",
+            "label": "Ngxs HMR plugin"
+          },
+          {
+            "value": "@ngxs/logger-plugin",
+            "label": "Ngxs logger plugin"
+          },
+          {
+            "value": "@ngxs/router-plugin",
+            "label": "Ngxs router plugin"
+          },
+          {
+            "value": "@ngxs/storage-plugin",
+            "label": "Ngxs storage plugin"
+          },
+          {
+            "value": "@ngxs/websocket-plugin",
+            "label": "Ngxs websocket plugin"
+          }
+        ]
+      }
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project."
+    }
+  },
+  "required": []
+}

package/schematics/src/starter-kit/files/store/auth/auth.actions.ts__template__

@@ -0,0 +1,6 @@
+import { AuthenticationStateModel } from './auth.state';
+
+export class SetAuthData {
+  static readonly type = '[Auth] Auth data';
+  constructor(readonly payload: AuthenticationStateModel) {}
+}

package/schematics/src/starter-kit/files/store/auth/auth.state.spec.ts__template__

@@ -0,0 +1,55 @@
+import { <% if (isStandalone) { %> provideStore, <% } else { %> NgxsModule, <% } %> Store } from '@ngxs/store';
+import { TestBed } from '@angular/core/testing';
+import { AuthenticationStateModel, AuthState } from './auth.state';
+import { SetAuthData } from './auth.actions';
+
+describe('[TEST]: AuthStore', () => {
+  let store: Store;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      <% if (isStandalone) { %> providers: [provideStore([AuthState])]
+      <% } else { %> imports: [NgxsModule.forRoot([AuthState])] <% } %>
+    });
+
+    store = TestBed.inject(Store);
+  });
+
+  it('Should be correct dispatch and value is empty', () => {
+    // Arrange
+    const Authentication: AuthenticationStateModel = {
+      id: '',
+      firstName: '',
+      lastName: '',
+      fullName: '',
+      email: '',
+      roles: []
+    };
+
+    // Act
+    store.dispatch(new SetAuthData(Authentication));
+    const actual = store.selectSnapshot<AuthenticationStateModel>(AuthState.getAuthData);
+
+    // Assert
+    expect(actual).toEqual(Authentication);
+  });
+
+  it('Should be correct dispatch and next value is correct completed', () => {
+    // Arrange
+    const authentication: AuthenticationStateModel = {
+      id: '12',
+      firstName: 'Adam',
+      lastName: 'Gordon',
+      fullName: 'Adam Gordon',
+      email: 'agordon@google.com',
+      roles: ['ADMIN']
+    };
+
+    // Act
+    store.dispatch(new SetAuthData(authentication));
+    const actual = store.selectSnapshot<AuthenticationStateModel>(AuthState.getAuthData);
+
+    // Assert
+    expect(actual).toEqual(authentication);
+  });
+});

package/schematics/src/starter-kit/files/store/auth/auth.state.ts__template__

@@ -0,0 +1,47 @@
+import { Injectable } from '@angular/core';
+import { Action, Selector, State, StateContext } from '@ngxs/store';
+import { SetAuthData } from './auth.actions';
+
+export interface AuthenticationStateModel {
+  id: string;
+  firstName: string;
+  lastName: string;
+  fullName: string;
+  email: string;
+  roles: string[];
+}
+
+@State<AuthenticationStateModel>({
+  name: 'authState',
+  defaults: {
+    id: '',
+    firstName: '',
+    lastName: '',
+    fullName: '',
+    email: '',
+    roles: []
+  }
+})
+@Injectable()
+export class AuthState {
+  @Selector()
+  static getAuthData(state: AuthenticationStateModel): AuthenticationStateModel {
+    return AuthState.getInstanceState(state);
+  }
+
+  private static setInstanceState(state: AuthenticationStateModel): AuthenticationStateModel {
+    return { ...state };
+  }
+
+  private static getInstanceState(state: AuthenticationStateModel): AuthenticationStateModel {
+    return { ...state };
+  }
+
+  @Action(SetAuthData)
+  setAuthData(
+    { setState }: StateContext<AuthenticationStateModel>,
+    { payload }: SetAuthData
+  ) {
+    setState(AuthState.setInstanceState(payload));
+  }
+}

package/schematics/src/starter-kit/files/store/dashboard/index.ts__template__

@@ -0,0 +1,4 @@
+import { DictionaryState } from './states/dictionary/dictionary.state';
+import { UserState } from './states/user/user.state';
+
+export const DashboardStates = [DictionaryState, UserState];

package/schematics/src/starter-kit/files/store/dashboard/states/dictionary/dictionary.actions.ts__template__

@@ -0,0 +1,10 @@
+import { DictionaryStateModel } from './dictionary.state';
+
+export class SetDictionaryData {
+  static readonly type = '[Dictionary] Set dictionary data action';
+  constructor(readonly payload: DictionaryStateModel) {}
+}
+
+export class DictionaryReset {
+  static readonly type = '[Dictionary] Reset dictionary action';
+}

package/schematics/src/starter-kit/files/store/dashboard/states/dictionary/dictionary.state.spec.ts__template__

@@ -0,0 +1,92 @@
+import { <% if (isStandalone) { %> provideStore, <% } else { %> NgxsModule, <% } %> Store } from '@ngxs/store';
+import { TestBed } from '@angular/core/testing';
+import { DictionaryState, DictionaryStateModel } from './dictionary.state';
+import { DictionaryReset, SetDictionaryData } from './dictionary.actions';
+
+const data = [
+  {
+    id: '323',
+    departmentCode: '2392',
+    departmentName: 'Main office',
+    mainCuratorUserId: 'admin',
+    mainCuratorName: 'Adam Gordon',
+    backupCuratorUserId: 'manager',
+    backupCuratorName: 'Alexander Chester'
+  },
+  {
+    id: '322',
+    departmentCode: '2999',
+    departmentName: 'New York office',
+    mainCuratorUserId: 'manager',
+    mainCuratorName: 'Alexander Chester',
+    backupCuratorUserId: 'manager',
+    backupCuratorName: 'Amanda Brian'
+  }
+];
+
+describe('[TEST]: Dictionary state', () => {
+  let store: Store;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      <% if (isStandalone) { %> providers: [provideStore([DictionaryState])]
+      <% } else { %> imports: [NgxsModule.forRoot([DictionaryState])] <% } %>
+    });
+
+    store = TestBed.inject(Store);
+  });
+
+  it('Should be correct dispatch and dictionary is empty', () => {
+    // Arrange
+    const dictionary: DictionaryStateModel = {
+      content: [],
+      page: 0,
+      size: 0,
+      totalPages: 0,
+      totalElements: 0
+    };
+
+    // Act
+    store.dispatch(new SetDictionaryData(dictionary));
+    const actual = store.selectSnapshot(DictionaryState.getDictionaryState);
+
+    // Assert
+    expect(actual).toEqual(dictionary);
+  });
+
+  it('Should be state is filled DictionaryStateModel', () => {
+    // Arrange
+    const dictionary: DictionaryStateModel = {
+      content: data,
+      page: 0,
+      size: 20,
+      totalPages: 2,
+      totalElements: 1
+    };
+
+    // Act
+    store.dispatch(new SetDictionaryData(dictionary));
+    const actual = store.selectSnapshot(DictionaryState.getDictionaryState);
+
+    // Assert
+    expect(actual).toEqual(dictionary);
+  });
+
+  it('should be reset state', function () {
+    // Arrange
+    const dictionary: DictionaryStateModel = {
+      content: [],
+      page: 0,
+      size: 0,
+      totalPages: 0,
+      totalElements: 0
+    };
+
+    // Act
+    store.dispatch(new DictionaryReset());
+    const actual = store.selectSnapshot(DictionaryState.getDictionaryState);
+
+    // Assert
+    expect(actual).toEqual(dictionary);
+  });
+});

package/schematics/src/starter-kit/files/store/dashboard/states/dictionary/dictionary.state.ts__template__

@@ -0,0 +1,62 @@
+import { Injectable } from '@angular/core';
+import { Action, Selector, State, StateContext } from '@ngxs/store';
+import { DictionaryReset, SetDictionaryData } from './dictionary.actions';
+
+export interface DictionaryStateModel {
+  content: any[];
+  page: number;
+  size: number;
+  totalPages: number;
+  totalElements: number;
+}
+
+@State<DictionaryStateModel>({
+  name: 'dictionary',
+  defaults: {
+    content: [],
+    page: 0,
+    size: 0,
+    totalPages: 0,
+    totalElements: 0
+  }
+})
+@Injectable()
+export class DictionaryState {
+  @Selector()
+  static getDictionaryState(state: DictionaryStateModel): DictionaryStateModel {
+    return DictionaryState.getInstanceState(state);
+  }
+
+  @Selector()
+  static getDictionaryContent(state: DictionaryStateModel) {
+    return state.content;
+  }
+
+  private static setInstanceState(state: DictionaryStateModel): DictionaryStateModel {
+    return { ...state };
+  }
+
+  private static getInstanceState(state: DictionaryStateModel): DictionaryStateModel {
+    return { ...state };
+  }
+
+  @Action(SetDictionaryData)
+  setTasks(
+    { setState }: StateContext<DictionaryStateModel>,
+    { payload }: SetDictionaryData
+  ) {
+    setState(DictionaryState.setInstanceState(payload));
+  }
+
+  @Action(DictionaryReset)
+  resetTasks({ setState }: StateContext<DictionaryStateModel>) {
+    const initialState = {
+      content: [],
+      page: 0,
+      size: 0,
+      totalPages: 0,
+      totalElements: 0
+    };
+    setState(initialState);
+  }
+}

package/schematics/src/starter-kit/files/store/dashboard/states/user/user.actions.ts__template__

@@ -0,0 +1,6 @@
+import { UserStateModel } from './user.state';
+
+export class SetUser {
+  static readonly type = '[SetUser] action';
+  constructor(readonly payload: UserStateModel) {}
+}

package/schematics/src/starter-kit/files/store/dashboard/states/user/user.state.spec.ts__template__

@@ -0,0 +1,61 @@
+import { <% if (isStandalone) { %> provideStore, <% } else { %> NgxsModule, <% } %> Store } from '@ngxs/store';
+import { TestBed } from '@angular/core/testing';
+import { UserStateModel, UserState } from './user.state';
+import { SetUser } from './user.actions';
+
+describe('[TEST]: User state', () => {
+  let store: Store;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      <% if (isStandalone) { %> providers: [provideStore([UserState])]
+      <% } else { %> imports: [NgxsModule.forRoot([UserState])] <% } %>
+    });
+
+    store = TestBed.inject(Store);
+  });
+
+  it('Should be state is UserStateModel', () => {
+    // Arrange
+    const user: UserStateModel = {
+      userId: '',
+      departmentCode: '',
+      departmentName: '',
+      email: '',
+      firstName: '',
+      lastName: '',
+      fullName: '',
+      positionId: '',
+      positionName: ''
+    };
+
+    // Act
+    store.dispatch(new SetUser(user));
+    const actual = store.selectSnapshot(({ user }) => user);
+
+    // Assert
+    expect(actual).toEqual(user);
+  });
+
+  it('Should be state is filled UserStateModel', () => {
+    // Arrange
+    const user: UserStateModel = {
+      userId: '12',
+      departmentCode: '2392',
+      departmentName: 'Main office',
+      email: 'agordon@google.com',
+      firstName: 'Adam',
+      lastName: 'Gordon',
+      fullName: 'Adam Gordon',
+      positionId: '102003',
+      positionName: 'admin'
+    };
+
+    // Act
+    store.dispatch(new SetUser(user));
+    const actual = store.selectSnapshot<UserStateModel>(({ user }) => user);
+
+    // Assert
+    expect(actual).toEqual(user);
+  });
+});

package/schematics/src/starter-kit/files/store/dashboard/states/user/user.state.ts__template__

@@ -0,0 +1,42 @@
+import { Injectable } from '@angular/core';
+import { Action, Selector, State, StateContext } from '@ngxs/store';
+import { SetUser } from './user.actions';
+
+export interface UserStateModel {
+  userId: string;
+  email: string;
+  firstName: string;
+  lastName: string;
+  fullName: string;
+  positionId: string;
+  positionName: string;
+  departmentCode: string;
+  departmentName: string;
+}
+
+@State<UserStateModel>({
+  name: 'user',
+  defaults: {
+    userId: '',
+    email: '',
+    firstName: '',
+    lastName: '',
+    fullName: '',
+    positionId: '',
+    positionName: '',
+    departmentCode: '',
+    departmentName: ''
+  }
+})
+@Injectable()
+export class UserState {
+  @Selector()
+  static getUser(state: UserStateModel): UserStateModel {
+    return state;
+  }
+
+  @Action(SetUser)
+  setUser(ctx: StateContext<UserStateModel>, { payload }: SetUser) {
+    ctx.setState(payload);
+  }
+}

package/schematics/src/starter-kit/files/store/store.config.ts__template__

@@ -0,0 +1,39 @@
+import { NgxsConfig } from '@ngxs/store';
+import { NgxsDevtoolsOptions } from '@ngxs/devtools-plugin';
+import { NgxsLoggerPluginOptions } from '@ngxs/logger-plugin';
+
+import { AuthState } from './auth/auth.state';
+import { DashboardStates } from './dashboard';
+
+export const STATES_MODULES = [AuthState, ...DashboardStates];
+
+export const OPTIONS_CONFIG: Partial<NgxsConfig> = {
+  /**
+   * Run in development mode. This will add additional debugging features:
+   * - Object.freeze on the state and actions to guarantee immutability
+   * todo: you need set production mode
+   * import { environment } from '@env';
+   * developmentMode: !environment.production
+   */
+  developmentMode: true
+};
+
+export const DEVTOOLS_REDUX_CONFIG: NgxsDevtoolsOptions = {
+  /**
+   * Whether the dev tools is enabled or note. Useful for setting during production.
+   * todo: you need set production mode
+   * import { environment } from '@env';
+   * disabled: environment.production
+   */
+  disabled: false
+};
+
+export const LOGGER_CONFIG: NgxsLoggerPluginOptions = {
+  /**
+   * Disable the logger. Useful for prod mode..
+   * todo: you need set production mode
+   * import { environment } from '@env';
+   * disabled: environment.production
+   */
+  disabled: false
+};

package/schematics/src/starter-kit/files/store/store.module.ts__template__

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NgxsModule } from '@ngxs/store';
+import { NgxsLoggerPluginModule } from '@ngxs/logger-plugin';
+import { NgxsReduxDevtoolsPluginModule } from '@ngxs/devtools-plugin';
+import {
+  DEVTOOLS_REDUX_CONFIG,
+  LOGGER_CONFIG,
+  OPTIONS_CONFIG,
+  STATES_MODULES
+} from './store.config';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    NgxsModule.forRoot(STATES_MODULES, OPTIONS_CONFIG),
+    NgxsReduxDevtoolsPluginModule.forRoot(DEVTOOLS_REDUX_CONFIG),
+    NgxsLoggerPluginModule.forRoot(LOGGER_CONFIG)
+  ],
+  exports: [NgxsModule]
+})
+export class NgxsStoreModule {}

package/schematics/src/starter-kit/schema.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "SchematicsNgxsStarterKit",
+  "title": "Ngxs Starter Kit Options Schema",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "description": "The path to create the starter kit. Relative to the specified (or default) project."
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "standalone": {
+      "type": "boolean",
+      "description": "Explicitly set whether should generate standalone APIs for the generated starter kit."
+    }
+  },
+  "required": ["path"]
+}

package/schematics/src/starter-kit/starter-kit.factory.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { StarterKitSchema } from './starter-kit.schema';
+export declare function starterKit(options: StarterKitSchema): Rule;

package/schematics/src/starter-kit/starter-kit.factory.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.starterKit = void 0;
+const schematics_1 = require("@angular-devkit/schematics");
+const generate_utils_1 = require("../utils/generate-utils");
+const ng_ast_utils_1 = require("../utils/ng-utils/ng-ast-utils");
+const project_1 = require("../utils/ng-utils/project");
+const normalize_options_1 = require("../utils/normalize-options");
+function starterKit(options) {
+    return (host) => {
+        let isStandalone = options.standalone;
+        if (typeof isStandalone !== 'boolean') {
+            const mainFile = (0, project_1.getProjectMainFile)(host, options.project);
+            isStandalone = !!mainFile && (0, ng_ast_utils_1.isStandaloneApp)(host, mainFile);
+        }
+        const normalizedPath = (0, normalize_options_1.normalizePath)(options.path);
+        return (0, generate_utils_1.generateFiles)((0, schematics_1.url)('./files'), normalizedPath, Object.assign(Object.assign({}, options), { isStandalone }), options.spec);
+    };
+}
+exports.starterKit = starterKit;
+//# sourceMappingURL=starter-kit.factory.js.map

package/schematics/src/starter-kit/starter-kit.factory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"starter-kit.factory.js","sourceRoot":"","sources":["../../../../../packages/store/schematics/src/starter-kit/starter-kit.factory.ts"],"names":[],"mappings":";;;AAAA,2DAA6D;AAC7D,4DAAwD;AACxD,iEAAiE;AACjE,uDAA+D;AAC/D,kEAA2D;AAG3D,SAAgB,UAAU,CAAC,OAAyB;IAClD,OAAO,CAAC,IAAU,EAAE,EAAE;QACpB,IAAI,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC;QACtC,IAAI,OAAO,YAAY,KAAK,SAAS,EAAE,CAAC;YACtC,MAAM,QAAQ,GAAG,IAAA,4BAAkB,EAAC,IAAI,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;YAC3D,YAAY,GAAG,CAAC,CAAC,QAAQ,IAAI,IAAA,8BAAe,EAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;QAC/D,CAAC;QAED,MAAM,cAAc,GAAG,IAAA,iCAAa,EAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QAEnD,OAAO,IAAA,8BAAa,EAClB,IAAA,gBAAG,EAAC,SAAS,CAAC,EACd,cAAc,kCACT,OAAO,KAAE,YAAY,KAC1B,OAAO,CAAC,IAAI,CACb,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAjBD,gCAiBC"}

package/schematics/src/state/files/__name__.state.spec.ts__template__

@@ -0,0 +1,25 @@
+import { TestBed } from '@angular/core/testing';
+import { <% if (isStandalone) { %> provideStore, <% } else { %> NgxsModule, <% } %> Store } from '@ngxs/store';
+import { <%= classify(name) %>State, <%= classify(name) %>StateModel } from './<%= dasherize(name) %>.state';
+
+describe('<%= classify(name) %> state', () => {
+    let store: Store;
+
+    beforeEach(() => {
+      TestBed.configureTestingModule({
+      <% if (isStandalone) { %> providers: [provideStore([<%= classify(name) %>State])]
+      <% } else { %> imports: [NgxsModule.forRoot([<%= classify(name) %>State])] <% } %>
+      });
+
+      store = TestBed.inject(Store);
+    });
+
+    it('should create an empty state', () => {
+        const actual = store.selectSnapshot(<%= classify(name) %>State.getState);
+        const expected: <%= classify(name) %>StateModel = {
+            items: []
+        };
+        expect(actual).toEqual(expected);
+    });
+
+});

package/schematics/src/state/files/__name__.state.ts__template__

@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import { State, Selector } from '@ngxs/store';
+
+export interface <%= classify(name) %>StateModel {
+    items: string[];
+}
+
+@State<<%= classify(name) %>StateModel>({
+    name: '<%= camelize(name) %>',
+    defaults: {
+        items: []
+    }
+})
+@Injectable()
+export class <%= classify(name) %>State {
+
+    @Selector()
+    static getState(state: <%= classify(name) %>StateModel) {
+        return state;
+    }
+
+}

package/schematics/src/state/schema.json

@@ -0,0 +1,44 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "SchematicsNgxsState",
+  "title": "Ngxs State Options Schema",
+  "type": "object",
+  "properties": {
+    "name": {
+      "description": "The name of the state.",
+      "type": "string",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      },
+      "x-prompt": "What name would you like to use for the state?",
+      "x-priority": "important"
+    },
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the state. Relative to the specified (or default) project."
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "default": false,
+      "description": "Flag to indicate if a dir is created."
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "aliases": ["p"],
+      "x-dropdown": "projects"
+    },
+    "standalone": {
+      "type": "boolean",
+      "description": "Explicitly set whether should generate standalone APIs for the generated state."
+    }
+  },
+  "required": ["name"]
+}