Welcome to @convep_mobilogy/react-native-qms-plugin

A React Native plugin that provides **QMS (Quality Management System)** components and APIs for defect management, dashboard visualization, and QMS workflow operations.

Installation

Install using npm:

npm install @convep_mobilogy/react-native-qms-plugin

Or using Yarn:

yarn add @convep_mobilogy/react-native-qms-plugin

iOS Setup

Autolinking should set up everything automatically.

1. Navigate to your iOS folder:

cd ios
pod install

Android Setup

Autolinking should set up everything automatically, but you need to add our private Maven repo and enable core library desugaring.

1. In your android/build.gradle, add the Maven repo with your credentials:

allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url = uri("https://www.jitpack.io") } // keep JitPack if RN needs it

        maven {
            url = uri("https://raw.githubusercontent.com/ConvepMobilogy/QMS_framework/main/maven-repo")
        }
    }
}

2. In android/app/build.gradle, enable core library desugaring (inside dependencies):

dependencies {
    // ...
    coreLibraryDesugaring("com.android.tools:desugar_jdk_libs:2.0.4")
}

3. In android/app/build.gradle, enable core library desugaring (inside android):

android {
    compileOptions {
        // you can match whatever your rootProject uses, 11 is safe
        sourceCompatibility JavaVersion.VERSION_11
        targetCompatibility JavaVersion.VERSION_11

        // this is what your AAR is demanding
        coreLibraryDesugaringEnabled true
    }
}

Usage

Use QmsDashboardView to render the native QMS screen.

import React from 'react';
import {
  BackHandler,
  Button,
  StyleSheet,
  View,
} from 'react-native';
import { QmsDashboardView } from '@convep_mobilogy/react-native-qms-plugin';

export default function App() {
  const [showQms, setShowQms] = React.useState(false);

  const clientID = '<ClientID>';
  const clientCode = '<CompanyCode>';
  const userToken = '<UserToken>';

  return (
    <View style={styles.container}>
      {showQms ? (
        <QmsDashboardView
          style={styles.container}
          clientID={clientID}
          clientCode={clientCode}
          userToken={userToken}
          onClose={() => {
            setShowQms(false);
          }}
          onAnalyticsScreen={(screenName, screenClass) => {
            console.log('screen:', screenName, screenClass);
          }}
          onAnalyticsEvent={(eventName, params) => {
            console.log('event:', eventName, params);
          }}
        />
      ) : (
        <View style={styles.center}>
          <Button title="Open QMS" onPress={() => setShowQms(true)} />
        </View>
      )}
    </View>
  );
}

const styles = StyleSheet.create({
  container: { flex: 1 },
  center: { flex: 1, justifyContent: 'center', gap: 12, paddingHorizontal: 24 },
});

QmsDashboardView props

• clientID (string): QMS client ID.
• clientCode (string): Company code.
• userToken (string): User auth token.
• onClose ((event?) => void): Called when dashboard exits.
• onAnalyticsScreen ((screenName?, screenClass?) => void): Screen tracking callback.
• onAnalyticsEvent ((eventName?, params?) => void): Event tracking callback.
• themeColor, headerThemeColor, accentColor (string): Theme overrides.
• fontFamily (string): Custom font family.
• payload (Record<string, unknown> | null): Optional data payload.

Backwards-compatible prop aliases are also supported: ClientID, ClientCode, user_token, and token.

In-App Notification Usage

Use QmsPlugin.emitInAppNotification(payload) to forward a notification into the native SDK layer.

import messaging from '@react-native-firebase/messaging';
import { QmsPlugin } from '@convep_mobilogy/react-native-qms-plugin';

const unsubscribeOnMessage = messaging().onMessage(async (message) => {

  QmsPlugin.emitInAppNotification({
    title: message.notification?.title,
    body: message.notification?.body,
    data: message.data,
  });
});

Payload:

• title?: string
• body?: string
• data?: Record<string, unknown>

License

MIT © Convep