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:
| Param | Type | Description |
|---|---|---|
obj | object | The 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:
| Param | Type | Description |
|---|---|---|
queryString | string | The 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}
/>
);
}