Skip to main content

useTypeLayoutConfig

Reference​

useTypeLayoutConfig hook is called layout API to take data from server. if we call this same API again then this hook is taking configuration details from cache data

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

const { useTypeLayoutConfig} = protrakUtils;

const config = useTypeLayoutConfig(pageContext.instanceType, 'create');

Parameters​

  • useTypeLayoutConfig function has 2 parameters:
    • typeName : Instance type name
    • configType : Pass config type like 'create', 'view', 'edit', 'dashboard', 'report'

Returns​

  • useTypeLayoutConfig function returns a layout configuration

Usage​

function CreateLayoutTest(pageContext) {
  // Each custom widget can also use platform provided customWidgetContext
  const { protrakUtils, protrakComponents } =
    React.useContext(customWidgetContext);
  const [count, setCount] = React.useState(0);

  // to use protrakUtils
  const { useProtrakApi, protrakApiClient, useTypeLayoutConfig} 
  = protrakUtils; 
  // to use protrakComponents
  const { Box, H3, Button, H4 } = protrakComponents;
  const config = useTypeLayoutConfig(pageContext.instanceType, 'create');
  console.log(config);
 
  const headerStyle = {
    margin: '40px',
    border: '5px solid #2d82a6',
    textAlign: 'center',
    padding: '20px',
  };

  return (
    <Box style={headerStyle}>
      <H3>Your UI code goes here</H3>
      <Button text={'Click me'} onClick={() => setCount(count + 1)} />
      <H4>Count: {count}</H4>
    </Box>
  );
}

Troubleshooting​

  • check if valid arguments are passed to useTypeLayoutConfig function