diff --git a/packages/util-user-agent-browser/src/index.native.ts b/packages/util-user-agent-browser/src/index.native.ts
index aca09d7ce7f3..a8a1ae0ea82e 100644
--- a/packages/util-user-agent-browser/src/index.native.ts
+++ b/packages/util-user-agent-browser/src/index.native.ts
@@ -2,15 +2,19 @@ import { Provider, UserAgent } from "@smithy/types";
 
 import { DefaultUserAgentOptions } from "./configurations";
 
+export interface PreviouslyResolved {
+  userAgentAppId: Provider<string | undefined>;
+}
+
 /**
  * @internal
  *
  * Default provider to the user agent in ReactNative. It's a best effort to infer
  * the device information. It uses bowser library to detect the browser and virsion
  */
-export const defaultUserAgent =
-  ({ serviceId, clientVersion }: DefaultUserAgentOptions): Provider<UserAgent> =>
-  async () => {
+export const createDefaultUserAgentProvider =
+  ({ serviceId, clientVersion }: DefaultUserAgentOptions): ((config?: PreviouslyResolved) => Promise<UserAgent>) =>
+  async (config?: PreviouslyResolved) => {
     const sections: UserAgent = [
       // sdk-metadata
       ["aws-sdk-js", clientVersion],
@@ -30,5 +34,16 @@ export const defaultUserAgent =
       sections.push([`api/${serviceId}`, clientVersion]);
     }
 
+    const appId = await config?.userAgentAppId?.();
+    if (appId) {
+      sections.push([`app/${appId}`]);
+    }
+
     return sections;
   };
+
+/**
+ * @internal
+ * @deprecated use createDefaultUserAgentProvider
+ */
+export const defaultUserAgent = createDefaultUserAgentProvider;
diff --git a/packages/util-user-agent-browser/src/index.ts b/packages/util-user-agent-browser/src/index.ts
index c3d0b23cdd42..8cc1af612b42 100644
--- a/packages/util-user-agent-browser/src/index.ts
+++ b/packages/util-user-agent-browser/src/index.ts
@@ -14,7 +14,7 @@ export interface PreviouslyResolved {
  * the device information. It uses bowser library to detect the browser and version
  */
 export const createDefaultUserAgentProvider =
-  ({ serviceId, clientVersion }: DefaultUserAgentOptions): ((config: PreviouslyResolved) => Promise<UserAgent>) =>
+  ({ serviceId, clientVersion }: DefaultUserAgentOptions): ((config?: PreviouslyResolved) => Promise<UserAgent>) =>
   async (config?: PreviouslyResolved) => {
     const parsedUA =
       typeof window !== "undefined" && window?.navigator?.userAgent
@@ -49,10 +49,7 @@ export const createDefaultUserAgentProvider =
   };
 
 /**
- *
  * @internal
- *
  * @deprecated use createDefaultUserAgentProvider
- *
  */
 export const defaultUserAgent = createDefaultUserAgentProvider;