Infer redux types when possible

This commit is contained in:
Alejandro Celaya 2025-11-14 14:21:14 +01:00
parent 145765e3fa
commit ae7aea0e2c
11 changed files with 18 additions and 38 deletions

View File

@ -1,8 +1,8 @@
import type { HttpClient } from '@shlinkio/shlink-js-sdk';
import { ShlinkApiClient } from '@shlinkio/shlink-js-sdk';
import type { GetState } from '../../container/types';
import type { ServerWithId } from '../../servers/data';
import { hasServerData } from '../../servers/data';
import type { GetState } from '../../store';
const apiClients: Map<string, ShlinkApiClient> = new Map();

View File

@ -1,15 +1 @@
import type { Settings } from '@shlinkio/shlink-web-component/settings';
import type { SelectedServer, ServersMap } from '../servers/data';
/** Deprecated Use RootState */
export type ShlinkState = {
servers: ServersMap;
selectedServer: SelectedServer;
settings: Settings;
appUpdated: boolean;
};
export type ConnectDecorator = (props: string[] | null, actions?: string[]) => any;
/** @deprecated */
export type GetState = () => ShlinkState;

View File

@ -1,6 +1,6 @@
import type { HttpClient } from '@shlinkio/shlink-js-sdk';
import pack from '../../../package.json';
import { createAsyncThunk } from '../../utils/helpers/redux';
import { createAsyncThunk } from '../../store/helpers';
import { hasServerData } from '../data';
import { ensureUniqueIds } from '../helpers';
import { createServers } from './servers';

View File

@ -4,7 +4,7 @@ import type { ShlinkHealth } from '@shlinkio/shlink-web-component/api-contract';
import { useCallback } from 'react';
import type { ShlinkApiClientBuilder } from '../../api/services/ShlinkApiClientBuilder';
import { useAppDispatch, useAppSelector } from '../../store';
import { createAsyncThunk } from '../../utils/helpers/redux';
import { createAsyncThunk } from '../../store/helpers';
import { versionToPrintable, versionToSemVer as toSemVer } from '../../utils/helpers/version';
import type { SelectedServer, ServerWithId } from '../data';

View File

@ -1,12 +1,6 @@
import type { ShlinkState } from '../../container/types';
export const migrateDeprecatedSettings = (state: Partial<ShlinkState>): Partial<ShlinkState> => {
if (!state.settings) {
return state;
}
export const migrateDeprecatedSettings = (state: any): any => {
// The "last180Days" interval had a typo, with a lowercase d
if (state.settings.visits && (state.settings.visits.defaultInterval as any) === 'last180days') {
if (state.settings?.visits?.defaultInterval === 'last180days') {
state.settings.visits.defaultInterval = 'last180Days';
}

View File

@ -4,8 +4,7 @@ import { mergeDeepRight } from '@shlinkio/data-manipulation';
import { getSystemPreferredTheme } from '@shlinkio/shlink-frontend-kit';
import type { Settings, ShortUrlsListSettings } from '@shlinkio/shlink-web-component/settings';
import { useCallback } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import type { ShlinkState } from '../../container/types';
import { useAppDispatch, useAppSelector } from '../../store';
import type { Defined } from '../../utils/types';
type ShortUrlsOrder = Defined<ShortUrlsListSettings['defaultOrdering']>;
@ -46,9 +45,9 @@ export const { setSettings } = actions;
export const settingsReducer = reducer;
export const useSettings = () => {
const dispatch = useDispatch();
const dispatch = useAppDispatch();
const setSettings = useCallback((settings: Settings) => dispatch(actions.setSettings(settings)), [dispatch]);
const settings = useSelector((state: ShlinkState) => state.settings);
const settings = useAppSelector((state) => state.settings);
return { settings, setSettings };
};

View File

@ -1,10 +1,10 @@
import type { AsyncThunkPayloadCreator } from '@reduxjs/toolkit';
import { createAsyncThunk as baseCreateAsyncThunk } from '@reduxjs/toolkit';
import type { ShlinkState } from '../../container/types';
import type { RootState } from '.';
export const createAsyncThunk = <Returned, ThunkArg>(
typePrefix: string,
payloadCreator: AsyncThunkPayloadCreator<Returned, ThunkArg, { state: ShlinkState, serializedErrorType: any }>,
payloadCreator: AsyncThunkPayloadCreator<Returned, ThunkArg, { state: RootState, serializedErrorType: any }>,
) => baseCreateAsyncThunk(
typePrefix,
payloadCreator,

View File

@ -24,7 +24,8 @@ export const setUpStore = (preloadedState = getStateFromLocalStorage()) => confi
export type StoreType = ReturnType<typeof setUpStore>;
export type AppDispatch = StoreType['dispatch'];
export type RootState = ReturnType<StoreType['getState']>;
export type GetState = StoreType['getState'];
export type RootState = ReturnType<GetState>;
// Typed versions of useDispatch() and useSelector()
export const useAppDispatch = useDispatch.withTypes<AppDispatch>();

View File

@ -3,7 +3,7 @@ import { render } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import type { PropsWithChildren, ReactElement } from 'react';
import { Provider } from 'react-redux';
import type { ShlinkState } from '../../src/container/types';
import type { RootState } from '../../src/store';
import { setUpStore } from '../../src/store';
export const renderWithEvents = (element: ReactElement, options?: RenderOptions) => ({
@ -12,7 +12,7 @@ export const renderWithEvents = (element: ReactElement, options?: RenderOptions)
});
export type RenderOptionsWithState = Omit<RenderOptions, 'wrapper'> & {
initialState?: Partial<ShlinkState>;
initialState?: Partial<RootState>;
};
export const renderWithStore = (

View File

@ -1,6 +1,5 @@
import type { ShlinkApiClient } from '@shlinkio/shlink-js-sdk';
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkState } from '../../../src/container/types';
import type { NonReachableServer, NotFoundServer, RegularServer } from '../../../src/servers/data';
import {
MAX_FALLBACK_VERSION,
@ -9,6 +8,7 @@ import {
selectedServerReducer as reducer,
selectServer,
} from '../../../src/servers/reducers/selectedServer';
import type { RootState } from '../../../src/store';
describe('selectedServerReducer', () => {
const dispatch = vi.fn();
@ -71,7 +71,7 @@ describe('selectedServerReducer', () => {
it('dispatches error when server is not found', async () => {
const id = crypto.randomUUID();
const getState = vi.fn(() => fromPartial<ShlinkState>({ servers: {} }));
const getState = vi.fn(() => fromPartial<RootState>({ servers: {} }));
const expectedSelectedServer: NotFoundServer = { serverNotFound: true };
await selectServer({ serverId: id, buildShlinkApiClient })(dispatch, getState, {});

View File

@ -1,6 +1,6 @@
import { fromPartial } from '@total-typescript/shoehorn';
import type { ShlinkState } from '../../../src/container/types';
import { migrateDeprecatedSettings } from '../../../src/settings/helpers';
import type { RootState } from '../../../src/store';
describe('settings-helpers', () => {
describe('migrateDeprecatedSettings', () => {
@ -9,7 +9,7 @@ describe('settings-helpers', () => {
});
it('updates settings as expected', () => {
const state = fromPartial<ShlinkState>({
const state = fromPartial<RootState>({
settings: {
visits: {
defaultInterval: 'last180days' as any,