--- title: Connectivity API description: >- The Connectivity API provides access to device connectivity information, allowing you to monitor Internet connection status and respond to connectivity changes in real-time. The API enables both immediate connectivity checks and dynamic updates when network conditions change. api_version: 2025-04 api_name: pos-ui-extensions source_url: html: >- https://shopify.dev/docs/api/pos-ui-extensions/2025-04/target-apis/platform-apis/connectivity-api md: >- https://shopify.dev/docs/api/pos-ui-extensions/2025-04/target-apis/platform-apis/connectivity-api.md --- # Connectivity API The Connectivity API provides access to device connectivity information, allowing you to monitor Internet connection status and respond to connectivity changes in real-time. The API enables both immediate connectivity checks and dynamic updates when network conditions change. #### Use cases * **Network monitoring:** Monitor network connectivity and handle interruptions gracefully. * **Status indicators:** Display connectivity status to inform users about network availability. * **Data synchronization:** Queue API calls and sync operations when connectivity is restored. * **Retry logic:** Implement retry logic for failed network operations. Support Targets (17) ### Supported targets * [pos.​customer-details.​action.​menu-item.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/customer-details#customer-details-action-menu-item-) * [pos.​customer-details.​action.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/customer-details#customer-details-action-modal-) * [pos.​customer-details.​block.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/customer-details#customer-details-block-) * [pos.​draft-order-details.​action.​menu-item.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/draft-order-details#draft-order-details-action-menu-item-) * [pos.​draft-order-details.​action.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/draft-order-details#draft-order-details-action-modal-) * [pos.​draft-order-details.​block.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/draft-order-details#draft-order-details-block-) * [pos.​home.​modal.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/home-screen#home-screen-action-modal-) * [pos.​home.​tile.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/home-screen#home-screen-tile-) * [pos.​order-details.​action.​menu-item.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/order-details#order-details-action-menu-item-) * [pos.​order-details.​action.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/order-details#order-details-action-modal-) * [pos.​order-details.​block.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/order-details#order-details-block-) * [pos.​product-details.​action.​menu-item.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/product-details#product-details-action-menu-item-) * [pos.​product-details.​action.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/product-details#product-details-action-modal-) * [pos.​product-details.​block.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/product-details#product-details-block-) * [pos.​purchase.​post.​action.​menu-item.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/post-purchase#post-purchase-action-menu-item-) * [pos.​purchase.​post.​action.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/post-purchase#post-purchase-action-modal-) * [pos.​purchase.​post.​block.​render](https://shopify.dev/docs/api/pos-ui-extensions/2025-04/targets/post-purchase#post-purchase-block-) ## ConnectivityApi The `ConnectivityApi` object provides methods for monitoring network connectivity. Access these methods through `api.connectivity` to check connection status and subscribe to connectivity changes. * subscribable RemoteSubscribable\ required Creates a subscription to changes in connectivity. Provides an initial value and a callback to subscribe to value changes. Use for implementing connectivity-aware functionality and reactive connectivity handling. ### ConnectivityState Represents the current Internet connectivity status of the device. Indicates whether the device is connected or disconnected from the Internet. * internetConnected Whether the device is connected to the Internet. Returns either \`Connected\` or \`Disconnected\` to indicate the current Internet connectivity status. Use for implementing connectivity-aware functionality, displaying connectivity indicators, or controlling network-dependent features. ```ts ConnectivityStateSeverity ``` ```ts export interface ConnectivityState { /** * Whether the device is connected to the Internet. Returns either `Connected` or `Disconnected` to indicate the current Internet connectivity status. Use for implementing connectivity-aware functionality, displaying connectivity indicators, or controlling network-dependent features. */ internetConnected: ConnectivityStateSeverity; } ``` ### ConnectivityStateSeverity ```ts 'Connected' | 'Disconnected' ``` Examples ### Examples * #### Monitor network connectivity changes ##### Description Subscribe to connectivity state changes to respond when the device goes online or offline. This example demonstrates using the connectivity subscription to track network status and display the current connection state, allowing your extension to adapt behavior based on network availability. ##### React ```tsx import React from 'react'; import { Tile, useConnectivitySubscription, reactExtension, } from '@shopify/ui-extensions-react/point-of-sale'; const SmartGridTile = () => { const connectivity = useConnectivitySubscription(); return ( ); }; export default reactExtension('pos.home.tile.render', () => ); ``` ##### TS ```ts import { Tile, ConnectivityState, extension, } from '@shopify/ui-extensions/point-of-sale'; export default extension('pos.home.tile.render', (root, api) => { const tile = root.createComponent(Tile, { title: 'My App', enabled: true, }); api.Connectivity.subscribable.subscribe( (newConnectivity: ConnectivityState) => { tile.updateProps({ enabled: newConnectivity.internetConnected === 'Connected', }); }, ); root.append(tile); }); ``` ## Best practices * **Design for connectivity awareness:** Design your extension to handle network interruptions, informing users when network-dependent features are unavailable and providing clear guidance on next steps. * **Provide clear connectivity feedback:** Display connectivity status to users when it affects functionality, helping them understand why certain features may be limited or unavailable. * **Queue operations during outages:** Implement queuing mechanisms for non-critical operations that can be deferred until connectivity is restored. ## Limitations * The Connectivity API provides read-only access to connectivity information and can't be used to control or modify network settings on the device. * `RemoteSubscribable` supports only one subscription at a time. Use `makeStatefulSubscribable` if you need multiple components to subscribe to connectivity changes simultaneously. * Connectivity status reflects Internet connectivity only and may not indicate the quality or speed of the connection, which could affect API performance. * The API monitors general Internet connectivity but doesn't provide specific information about Shopify service availability or API endpoint availability.