Custom Extensions, Live Preview & Analytics

Usage metrics in the dashboard may display "null" for device or browser categories when processing API requests. This prevents accurate reporting and attribution of traffic to specific platforms or devices.

Root cause

The calling client or integration script is not sending a User-Agent header in the HTTP request.

Resolution

1. Review all direct HTTP integrations, custom scripts, or backend services making API calls.
2. Ensure every request includes a valid and descriptive User-Agent header.
3. Verify that asset-heavy flows are not bypassing header configurations.

After updating the scripts to include a User-Agent header, monitor the usage logs or dashboard. If the "null" values are replaced by the specified User-Agent strings, the reporting discrepancy is resolved.

Integrating the DateTimePicker component in a custom UI may result in the popup being visible simultaneously with the input field. This prevents achieving a "click-to-show" behavior similar to standard text inputs.

Root cause

The DateTimePicker component does not include a native configuration to toggle visibility only on user interaction.

Resolution

1. Implement a state variable in the front-end code to manage visibility.
2. Use the onFocus event of the input field to set the state to show the picker.
3. Use the onBlur event of the input field to set the state to hide the picker.
4. Render the DateTimePicker component conditionally based on the state variable.

After implementing the conditional logic, click on the date input field in the application. If the popup UI appears only upon clicking the field and disappears on blur, the implementation is correct.

Enabling Live Preview in the CMS may result in a client-side exception error when new global fields are added. This prevents the real-time rendering of content changes in the preview pane.

Root cause

A TypeError occurs when the front-end application code attempts to render new global field data that is not yet supported by the existing implementation.

Resolution

1. Inspect the browser console to identify the specific field causing the TypeError.
2. Verify that the Live Preview SDK is correctly integrated and configured with valid API keys and delivery tokens.
3. Ensure the Preview URL in stack settings is correct.
4. Update the front-end code to handle the data structure of the newly added global field.
5. Clear browser cache and reload the preview window.
6. Refer to the official Live Preview documentation for complete front-end integration guidance.

After updating the front-end code to handle the new field structure, open the Live Preview window. If the preview renders without an application error, the issue is resolved.