mobx-react-routing/query-params-field/query-params-presets.js

MobX react-router-dom integration

import { typeGuard } from 'yummies/type-guard';
export const queryParamsPresets = {
    'string[]': {
        deserialize: (value) => value?.split(',') ?? null,
        serialize: (value) => {
            if (!value?.length)
                return;
            return value.join(',');
        },
    },
    'number[]': {
        deserialize: (raw) => {
            const rawItems = queryParamsPresets['string[]'].deserialize(raw);
            if (!rawItems)
                return rawItems;
            const result = [];
            for (const item of rawItems) {
                if (item !== '' && typeGuard.isNumber(+item)) {
                    result.push(+item);
                }
            }
            return result;
        },
        serialize: (value) => queryParamsPresets['string[]'].serialize(value),
    },
    string: {
        deserialize: (value) => value ?? null,
        serialize: (value) => {
            if (!value)
                return;
            return value;
        },
    },
    boolean: {
        deserialize: (value) => value === '1',
        serialize: (value) => {
            if (!value || value !== true)
                return;
            return '1';
        },
    },
    number: {
        deserialize: (value) => {
            if (value === '' || !typeGuard.isNumber(+value))
                return null;
            return +value;
        },
        serialize: (value) => {
            if (!value)
                return;
            return value;
        },
    },
    json: {
        deserialize: (value) => {
            try {
                return JSON.parse(value || '');
            }
            catch {
                return {};
            }
        },
        serialize: (value) => {
            if (!value || Object.keys(value).length === 0)
                return;
            return JSON.stringify(value);
        },
    },
};