Skip to content

Commit e9cc2a6

Browse files
aryaemami59aryaemami59
committed
Refactor createSliceBuilder transform file
 - Eliminated `@ts-ignore` directives to improve TypeScript compliance. - Configured `lineTerminator` in `.toSource.options` for consistent end-of-line across platforms, overriding `jscodeshift`'s default OS-specific EOL. - Refactored `__fixtures__` files to contain slightly more realistic and practical examples.
1 parent 681a982 commit e9cc2a6

File tree

6 files changed

+298
-186
lines changed

6 files changed

+298
-186
lines changed

‎packages/rtk-codemods/transforms/createSliceBuilder/__testfixtures__/basic-ts.input.ts

Lines changed: 63 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,71 @@
1-
const slice1 = createSlice({
2-
name: "a",
3-
initialState,
1+
import type { PayloadAction } from '@reduxjs/toolkit'
2+
import {
3+
createAsyncThunk,
4+
createEntityAdapter,
5+
createSlice
6+
} from '@reduxjs/toolkit'
7+
8+
export interface Todo {
9+
id: string
10+
title: string
11+
}
12+
13+
export const todoAdapter = createEntityAdapter<Todo>()
14+
15+
const todoInitialState = todoAdapter.getInitialState()
16+
17+
export type TodoSliceState = typeof todoInitialState
18+
19+
const fetchCount = (amount = 1) => {
20+
return new Promise<{ data: number }>((resolve) =>
21+
setTimeout(() => resolve({ data: amount }), 500)
22+
)
23+
}
24+
25+
export const incrementAsync = createAsyncThunk(
26+
'counter/fetchCount',
27+
async (amount: number) => {
28+
const response = await fetchCount(amount)
29+
return response.data
30+
}
31+
)
32+
33+
const todoSlice = createSlice({
34+
name: 'todo',
35+
initialState: todoInitialState,
36+
reducers: {
37+
deleteTodo: todoAdapter.removeOne
38+
},
439
extraReducers: {
5-
[todoAdded1a]: (state: SliceState, action: PayloadAction<string>) => {
40+
[incrementAsync.pending]: (
41+
state: TodoSliceState,
42+
action: PayloadAction<string>
43+
) => {
644
// stuff
745
},
8-
[todoAdded1b]: someFunc,
9-
todoAdded1c: adapter.someFunc,
46+
[incrementAsync.rejected]: todoAdapter.removeAll,
47+
todoAdded: todoAdapter.addOne
1048
}
11-
});
49+
})
50+
51+
export const { deleteTodo } = todoSlice.actions
1252

13-
const slice2 = createSlice({
14-
name: "b",
15-
initialState,
53+
export interface CounterSliceState {
54+
value: number
55+
status: 'idle' | 'loading' | 'failed'
56+
}
57+
58+
const counterInitialState: CounterSliceState = {
59+
value: 0,
60+
status: 'idle'
61+
}
62+
63+
const counterSlice = createSlice({
64+
name: 'counter',
65+
initialState: counterInitialState,
1666
extraReducers: {
17-
[todoAdded](state: SliceState, action: PayloadAction<string>) {
67+
[deleteTodo](state: CounterSliceState, action: PayloadAction<string>) {
1868
// stuff
19-
},
69+
}
2070
}
21-
});
71+
})

‎packages/rtk-codemods/transforms/createSliceBuilder/__testfixtures__/basic-ts.output.ts

Lines changed: 65 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,75 @@
1-
const slice1 = createSlice({
2-
name: "a",
3-
initialState,
1+
import type { PayloadAction } from '@reduxjs/toolkit'
2+
import {
3+
createAsyncThunk,
4+
createEntityAdapter,
5+
createSlice
6+
} from '@reduxjs/toolkit'
7+
8+
export interface Todo {
9+
id: string
10+
title: string
11+
}
12+
13+
export const todoAdapter = createEntityAdapter<Todo>()
14+
15+
const todoInitialState = todoAdapter.getInitialState()
16+
17+
export type TodoSliceState = typeof todoInitialState
18+
19+
const fetchCount = (amount = 1) => {
20+
return new Promise<{ data: number }>((resolve) =>
21+
setTimeout(() => resolve({ data: amount }), 500)
22+
)
23+
}
24+
25+
export const incrementAsync = createAsyncThunk(
26+
'counter/fetchCount',
27+
async (amount: number) => {
28+
const response = await fetchCount(amount)
29+
return response.data
30+
}
31+
)
32+
33+
const todoSlice = createSlice({
34+
name: 'todo',
35+
initialState: todoInitialState,
36+
37+
reducers: {
38+
deleteTodo: todoAdapter.removeOne
39+
},
440

541
extraReducers: (builder) => {
6-
builder.addCase(todoAdded1a, (state: SliceState, action: PayloadAction<string>) => {
7-
// stuff
8-
});
42+
builder.addCase(
43+
incrementAsync.pending,
44+
(state: TodoSliceState, action: PayloadAction<string>) => {
45+
// stuff
46+
}
47+
);
948

10-
builder.addCase(todoAdded1b, someFunc);
11-
builder.addCase(todoAdded1c, adapter.someFunc);
49+
builder.addCase(incrementAsync.rejected, todoAdapter.removeAll);
50+
builder.addCase(todoAdded, todoAdapter.addOne);
1251
}
13-
});
52+
})
53+
54+
export const { deleteTodo } = todoSlice.actions
55+
56+
export interface CounterSliceState {
57+
value: number
58+
status: 'idle' | 'loading' | 'failed'
59+
}
60+
61+
const counterInitialState: CounterSliceState = {
62+
value: 0,
63+
status: 'idle'
64+
}
1465

15-
const slice2 = createSlice({
16-
name: "b",
17-
initialState,
66+
const counterSlice = createSlice({
67+
name: 'counter',
68+
initialState: counterInitialState,
1869

1970
extraReducers: (builder) => {
20-
builder.addCase(todoAdded, (state: SliceState, action: PayloadAction<string>) => {
71+
builder.addCase(deleteTodo, (state: CounterSliceState, action: PayloadAction<string>) => {
2172
// stuff
2273
});
2374
}
24-
});
75+
})

‎packages/rtk-codemods/transforms/createSliceBuilder/__testfixtures__/basic.input.js

Lines changed: 41 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,46 @@
1-
const slice1 = createSlice({
2-
name: "a",
3-
initialState: {},
4-
extraReducers: {
5-
[todoAdded1a]: (state, action) => {
6-
// stuff
7-
},
8-
[todoAdded1b]: (state, action) => action.payload,
9-
[todoAdded1c + "test"]: (state, action) => {
10-
// stuff
11-
},
12-
[todoAdded1d](state, action) {
13-
// stuff
14-
},
15-
[todoAdded1e]: function(state, action) {
16-
// stuff
17-
},
18-
todoAdded1f: (state, action) => {
19-
//stuff
1+
import { createAsyncThunk, createEntityAdapter, createSlice } from '@reduxjs/toolkit';
2+
3+
export const todoAdapter = createEntityAdapter();
4+
5+
const todoInitialState = todoAdapter.getInitialState();
6+
7+
const fetchCount = (amount = 1) => {
8+
return new Promise((resolve) => setTimeout(() => resolve({ data: amount }), 500));
9+
};
10+
11+
export const incrementAsync = createAsyncThunk('counter/fetchCount', async (amount) => {
12+
const response = await fetchCount(amount);
13+
return response.data;
14+
});
15+
16+
const todoSlice = createSlice({
17+
name: 'todo',
18+
initialState: todoInitialState,
19+
reducers: {
20+
deleteTodo: todoAdapter.removeOne
2021
},
21-
[todoAdded1g]: someFunc,
22-
todoAdded1h: adapter.someFunc
23-
}
22+
extraReducers: {
23+
[incrementAsync.pending]: (state, action) => {
24+
// stuff
25+
},
26+
[incrementAsync.rejected]: todoAdapter.removeAll,
27+
todoAdded: todoAdapter.addOne
28+
}
2429
});
2530

31+
export const { deleteTodo } = todoSlice.actions;
2632

27-
const slice2 = createSlice({
28-
name: "b",
29-
initialState: {},
30-
extraReducers: {
31-
[todoAdded2a]: (state, action) => {
32-
// stuff
33-
},
34-
[todoAdded2b](state, action) {
35-
// stuff
36-
},
37-
[todoAdded2c]: function(state, action) {
38-
// stuff
33+
const counterInitialState = {
34+
value: 0,
35+
status: 'idle'
36+
};
37+
38+
const counterSlice = createSlice({
39+
name: 'counter',
40+
initialState: counterInitialState,
41+
extraReducers: {
42+
[deleteTodo](state, action) {
43+
// stuff
44+
}
3945
}
40-
}
41-
});
46+
});

‎packages/rtk-codemods/transforms/createSliceBuilder/__testfixtures__/basic.output.js

Lines changed: 38 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,50 @@
1-
const slice1 = createSlice({
2-
name: "a",
3-
initialState: {},
1+
import { createAsyncThunk, createEntityAdapter, createSlice } from '@reduxjs/toolkit';
42

5-
extraReducers: (builder) => {
6-
builder.addCase(todoAdded1a, (state, action) => {
7-
// stuff
8-
});
3+
export const todoAdapter = createEntityAdapter();
94

10-
builder.addCase(todoAdded1b, (state, action) => action.payload);
5+
const todoInitialState = todoAdapter.getInitialState();
116

12-
builder.addCase(todoAdded1c + "test", (state, action) => {
13-
// stuff
14-
});
7+
const fetchCount = (amount = 1) => {
8+
return new Promise((resolve) => setTimeout(() => resolve({ data: amount }), 500));
9+
};
1510

16-
builder.addCase(todoAdded1d, (state, action) => {
17-
// stuff
18-
});
11+
export const incrementAsync = createAsyncThunk('counter/fetchCount', async (amount) => {
12+
const response = await fetchCount(amount);
13+
return response.data;
14+
});
1915

20-
builder.addCase(todoAdded1e, (state, action) => {
21-
// stuff
22-
});
16+
const todoSlice = createSlice({
17+
name: 'todo',
18+
initialState: todoInitialState,
2319

24-
builder.addCase(todoAdded1f, (state, action) => {
25-
//stuff
26-
});
20+
reducers: {
21+
deleteTodo: todoAdapter.removeOne
22+
},
2723

28-
builder.addCase(todoAdded1g, someFunc);
29-
builder.addCase(todoAdded1h, adapter.someFunc);
30-
}
31-
});
24+
extraReducers: (builder) => {
25+
builder.addCase(incrementAsync.pending, (state, action) => {
26+
// stuff
27+
});
3228

29+
builder.addCase(incrementAsync.rejected, todoAdapter.removeAll);
30+
builder.addCase(todoAdded, todoAdapter.addOne);
31+
}
32+
});
3333

34-
const slice2 = createSlice({
35-
name: "b",
36-
initialState: {},
34+
export const { deleteTodo } = todoSlice.actions;
3735

38-
extraReducers: (builder) => {
39-
builder.addCase(todoAdded2a, (state, action) => {
40-
// stuff
41-
});
36+
const counterInitialState = {
37+
value: 0,
38+
status: 'idle'
39+
};
4240

43-
builder.addCase(todoAdded2b, (state, action) => {
44-
// stuff
45-
});
41+
const counterSlice = createSlice({
42+
name: 'counter',
43+
initialState: counterInitialState,
4644

47-
builder.addCase(todoAdded2c, (state, action) => {
48-
// stuff
49-
});
50-
}
51-
});
45+
extraReducers: (builder) => {
46+
builder.addCase(deleteTodo, (state, action) => {
47+
// stuff
48+
});
49+
}
50+
});

‎packages/rtk-codemods/transforms/createSliceBuilder/createSliceBuilder.test.ts

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
1-
import path from 'path';
2-
import transform, { parser } from './index';
1+
import path from 'node:path'
2+
import { runTransformTest } from '../../transformTestUtils'
3+
import transform, { parser } from './index'
34

4-
import { runTransformTest } from '../../transformTestUtils';
5-
6-
runTransformTest('createSliceBuilder', transform, parser, path.join(__dirname, '__testfixtures__'));
5+
runTransformTest(
6+
'createSliceBuilder',
7+
transform,
8+
parser,
9+
path.join(__dirname, '__testfixtures__')
10+
)

0 commit comments

Comments
 (0)