fix(react): fix typings for generated redux files (#17171)

nrwl · May 25, 2023 · 4b5ebc8 · 4b5ebc8 · vercel · May 25, 2023
1 parent 13c2b7a
commit 4b5ebc8
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 10 deletions.
diff --git a/e2e/react-core/src/react.test.ts b/e2e/react-core/src/react.test.ts
@@ -212,11 +212,15 @@ describe('React Applications', () => {
     );
     runCLI(`g @nx/react:redux orange --project=${libName}`);
 
+    let lintResults = runCLI(`lint ${appName}`);
+    expect(lintResults).toContain('All files pass linting.');
     const appTestResults = await runCLIAsync(`test ${appName}`);
     expect(appTestResults.combinedOutput).toContain(
       'Test Suites: 2 passed, 2 total'
     );
 
+    lintResults = runCLI(`lint ${libName}`);
+    expect(lintResults).toContain('All files pass linting.');
     const libTestResults = await runCLIAsync(`test ${libName}`);
     expect(libTestResults.combinedOutput).toContain(
       'Test Suites: 2 passed, 2 total'

diff --git a/packages/react/src/generators/redux/files/__directory__/__fileName__.slice.spec.ts__tmpl__ b/packages/react/src/generators/redux/files/__directory__/__fileName__.slice.spec.ts__tmpl__
@@ -10,43 +10,46 @@ describe('<%= propertyName %> reducer', () => {
     expect(<%= propertyName %>Reducer(undefined, { type: '' })).toEqual(expected);
   });
 
-  it('should handle fetch<%= className %>s', () => {
+  it('should handle fetch<%= className %>', () => {
     let state = <%= propertyName %>Reducer(
       undefined,
-      fetch<%= className %>.pending(null, null)
+      fetch<%= className %>.pending('')
     );
 
     expect(state).toEqual(
       expect.objectContaining({
         loadingStatus: 'loading',
         error: null,
-        entities: {}
+        entities: {},
+        ids: []
       })
     );
 
     state = <%= propertyName %>Reducer(
       state,
-      fetch<%= className %>.fulfilled([{ id: 1 }], null, null)
+      fetch<%= className %>.fulfilled([{ id: 1 }], '')
     );
 
     expect(state).toEqual(
       expect.objectContaining({
         loadingStatus: 'loaded',
         error: null,
-        entities: { 1: { id: 1 } }
+        entities: { 1: { id: 1 } },
+        ids: [1]
       })
     );
 
     state = <%= propertyName %>Reducer(
       state,
-      fetch<%= className %>.rejected(new Error('Uh oh'), null, null)
+      fetch<%= className %>.rejected(new Error('Uh oh'), '')
     );
 
     expect(state).toEqual(
       expect.objectContaining({
         loadingStatus: 'error',
         error: 'Uh oh',
-        entities: { 1: { id: 1 } }
+        entities: { 1: { id: 1 } },
+        ids: [1]
       })
     );
   });

diff --git a/packages/react/src/generators/redux/files/__directory__/__fileName__.slice.ts__tmpl__ b/packages/react/src/generators/redux/files/__directory__/__fileName__.slice.ts__tmpl__
@@ -18,7 +18,7 @@ export interface <%= className %>Entity {
 
 export interface <%= className %>State extends EntityState<<%= className %>Entity> {
   loadingStatus: 'not loaded' | 'loading' | 'loaded' | 'error';
-  error: string;
+  error?: string | null;
 }
 
 export const <%= propertyName %>Adapter = createEntityAdapter<<%= className %>Entity>();
@@ -40,7 +40,7 @@ export const <%= propertyName %>Adapter = createEntityAdapter<<%= className %>En
  * }, [dispatch]);
  * ```
  */
-export const fetch<%= className %> = createAsyncThunk(
+export const fetch<%= className %> = createAsyncThunk<<%= className %>Entity[]>(
   '<%= propertyName %>/fetchStatus',
   async (_, thunkAPI) => {
     /**
@@ -122,7 +122,7 @@ export const <%= propertyName %>Actions = <%= propertyName %>Slice.actions;
  */
 const { selectAll, selectEntities } = <%= propertyName %>Adapter.getSelectors();
 
-export const get<%= className %>State = (rootState: unknown): <%= className %>State => rootState[<%= constantName %>_FEATURE_KEY];
+export const get<%= className %>State = (rootState: {[<%= constantName %>_FEATURE_KEY]: <%= className %>State }): <%= className %>State => rootState[<%= constantName %>_FEATURE_KEY];
 
 export const selectAll<%= className %> = createSelector(get<%= className %>State, selectAll);