Skip to main content

queryStringUtils

Reference

Utilities for converting between JavaScript objects and URL query strings.

const { protrakUtils } = React.useContext(customWidgetContext);
const { toQueryString, parseQueryString } = protrakUtils;

toQueryString(obj)

Converts a plain object into a URL-encoded query string using dot-notation for nested objects.

Parameters:

ParamTypeDescription
objobjectThe object to serialise

Returns: string — URL query string (without leading ?)

toQueryString({ page: 1, filter: 'active' });
// → "page=1&filter=active"

toQueryString({ typeName: 'Agreement', skip: 0, take: 20 });
// → "typeName=Agreement&skip=0&take=20"

parseQueryString(queryString)

Parses a URL query string back into a plain object.

Parameters:

ParamTypeDescription
queryStringstringThe query string to parse (with or without leading ?)

Returns: object

parseQueryString('page=1&filter=active');
// → { page: '1', filter: 'active' }

parseQueryString('?typeName=Agreement&skip=0');
// → { typeName: 'Agreement', skip: '0' }

Usage Example

function DeepLinkWidget(pageContext) {
const { protrakUtils, protrakComponents } =
React.useContext(customWidgetContext);
const { toQueryString, useRouter } = protrakUtils;
const { Button, ButtonEnums } = protrakComponents;

const router = useRouter();

const handleNavigate = () => {
const params = toQueryString({
filter: 'active',
instanceType: pageContext.instanceType,
});
router.redirect(`/${pageContext.instanceType}/dashboard?${params}`);
};

return (
<Button
text="View Active Records"
appearance={ButtonEnums.Appearance.Link}
onClick={handleNavigate}
/>
);
}