Am I doing it wrong : Redux Thunk

let timeout;

const hide = dispatch => {
	clearTimeout(timeout);
	return new Promise(
		resolve =>
			(timeout = setTimeout(() => {
				dispatch(modalSlice.actions.hideModal());
				resolve();
			}, 4000))
	);
};

export const showModal = createAsyncThunk('/modal/show', async (props, thunkAPI) => {
	let { msg } = props;
	msg = msg || "Hold on I swear it won't take so long";
	const { fulfillWithValue, dispatch } = thunkAPI;
	hide(dispatch);
	return fulfillWithValue({ msg, visible: true });
});

Is this a preferred way to dispatch an action inside a thunk after a interval or is there any better way to achieve the same? Any helps will be appreciated :blush: