Skip to main content
In-app messages are configured in the AppDNA Console and displayed automatically by the SDK when trigger conditions are met. No code is required to show messages.

How It Works

  1. You create an in-app message in the Console with content, layout, and trigger rules.
  2. The message definition is synced to the SDK via the config bundle.
  3. On every track() call, the SDK evaluates all active message triggers.
  4. If conditions match, the message is presented automatically.
In-app messages are fully server-driven. You can change the message content, trigger rules, and audience without an app update.

Message Types

TypeDescription
bannerSmall bar at the top or bottom of the screen
modalCentered overlay with a dimmed background
fullscreenFull-screen takeover
tooltipSmall popup anchored to a UI element

Module Access

const messages = AppDNA.inAppMessages;

Module Methods

MethodSignatureDescription
suppresssuppress(): voidSuppress all in-app messages
unsuppressunsuppress(): voidResume showing in-app messages

Suppressing Messages

Suppress messages during critical flows:
AppDNA.inAppMessages.suppress();
startPurchaseFlow();

// Resume after purchase completes
function onPurchaseComplete() {
  AppDNA.inAppMessages.unsuppress();
}

Event Listeners

const unsubPresented = AppDNA.inAppMessages.onPresented(
  (messageId: string, messageType: string) => {
    console.log(`Message shown: ${messageId} (${messageType})`);
  }
);

const unsubAction = AppDNA.inAppMessages.onAction(
  (messageId: string, action: string, url?: string) => {
    if (url) navigate(url);
  }
);

const unsubDismissed = AppDNA.inAppMessages.onDismissed(
  (messageId: string) => {
    console.log(`Message dismissed: ${messageId}`);
  }
);

// Clean up when no longer needed
unsubPresented();
unsubAction();
unsubDismissed();

Auto-Tracked Events

EventTrigger
message_presentedAn in-app message is displayed
message_actionUser taps an action in the message
message_dismissedMessage is closed

Full Example

import { AppDNA } from "@appdna/react-native-sdk";
import React, { useEffect } from "react";

function App() {
  useEffect(() => {
    const unsubPresented = AppDNA.inAppMessages.onPresented(
      (messageId, messageType) => {
        // Optionally track in your own analytics
      }
    );

    const unsubAction = AppDNA.inAppMessages.onAction(
      (messageId, action, url) => {
        if (action === "deep_link" && url) {
          navigation.navigate(url);
        }
      }
    );

    return () => {
      unsubPresented();
      unsubAction();
    };
  }, []);

  function startOnboarding() {
    AppDNA.inAppMessages.suppress();
    // Present onboarding flow...
  }

  function onboardingDidFinish() {
    AppDNA.inAppMessages.unsuppress();
  }

  return <>{/* App content */}</>;
}
In-app messages are created in the Console under Engagement > In-App Messages. Design the message, set trigger rules, and publish.