capacitor-3rddigital-appupdate 1.0.0

package/README.md

@@ -0,0 +1,122 @@
+# capacitor-3rddigital-appupdate
+
+A Capacitor + React library for **seamless Over-The-Air (OTA) updates** with:
+
+- 🔄 Automatic version checks
+- 📥 Bundle download & installation (iOS & Android)
+- ⚡ Configurable user prompts (dialogs)
+- 🛠️ CLI tool for building & uploading bundles to your update server
+
+## 🚀 Installation
+
+```sh
+npm install capacitor-3rddigital-appupdate
+# or
+yarn add capacitor-3rddigital-appupdate
+```
+
+This package has peer dependencies that also need to be installed:
+
+```sh
+npm install @capacitor/core @capacitor/device @capgo/capacitor-updater
+```
+
+Run pod install for iOS:
+
+```sh
+cd ios && pod install
+```
+
+## 📦 Usage in Your App
+
+- Use the useCapacitorUpdater hook to check for updates and handle modal UI:
+
+```sh
+import React from "react";
+import { UpdaterModal, useCapacitorUpdater } from "capacitor-3rddigital-appupdate";
+
+const App = () => {
+  const { isUpdateModalVisible, updateInfo, handleUpdate, setUpdateModalVisible } = useCapacitorUpdater({
+    iosPackage: "com.example.ios",
+    androidPackage: "com.example.android",
+    key: "example-key",
+  });
+
+  return (
+    <div>
+      {/* Your app content */}
+      {isUpdateModalVisible && updateInfo && (
+        <UpdaterModal
+          visible={isUpdateModalVisible}
+          updateInfo={updateInfo}
+          onConfirm={() => handleUpdate()}
+          onCancel={() => setUpdateModalVisible(false)}
+        />
+      )}
+    </div>
+  );
+};
+
+export default App;
+```
+
+## ⚙️ API Reference
+
+🔹 useCapacitorUpdater(options?: { iosPackage?: string; androidPackage?: string })
+
+- Checks the server for available updates and manages the modal prompt.
+
+Returns:
+
+| Key                     | Type             | Description                         |
+| ----------------------- | ---------------- | ----------------------------------- |
+| `updateInfo`            | `UpdateInfo`     | Metadata about the available update |
+| `isUpdateModalVisible`  | `boolean`        | Whether the update modal is visible |
+| `setUpdateModalVisible` | `(bool) => void` | Show/hide modal manually            |
+| `handleUpdate`          | `() => void`     | Downloads and installs the update   |
+
+🔹 UpdaterModal
+
+- Global modal component for prompting users to update.
+
+Props:
+
+| Key           | Type       | Default              | Description                         |
+| ------------- | ---------- | -------------------- | ----------------------------------- |
+| `visible`     | boolean    | ❌                   | Show/hide modal                     |
+| `updateInfo`  | UpdateInfo | ❌                   | Update metadata                     |
+| `onConfirm`   | function   | ❌                   | Callback when user confirms update  |
+| `onCancel`    | function   | ❌                   | Callback when user cancels update   |
+| `customUI`    | function   | ❌                   | Custom render for the modal UI      |
+| `title`       | string     | `"Update Available"` | Modal title                         |
+| `message`     | string     | `undefined`          | Modal message                       |
+| `confirmText` | string     | `"Update"`           | Confirm button text                 |
+| `cancelText`  | string     | `"Cancel"`           | Cancel button text                  |
+| `styles`      | object     | `{}`                 | Style overrides for modal & buttons |
+
+## 🖥️ CLI Tool – appupdate
+
+- This package provides a CLI for building & uploading OTA bundles.
+
+Build & Upload
+
+```sh
+npx appupdate android
+npx appupdate ios
+npx appupdate all
+```
+
+You will be prompted for:
+
+- API Token
+- Project ID
+- Environment (development / production)
+- Version
+- Build Number
+- Force Update (true/false)
+
+What it does
+
+- Builds your React web app
+- Creates Capgo zip bundle
+- Uploads bundle + metadata to your update server (https://dev.3rddigital.com/appupdate-api/api/)

package/dist/UpdaterModal.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import type { UpdaterModalProps } from "./types.js";
+export declare const UpdaterModal: React.FC<UpdaterModalProps>;

package/dist/UpdaterModal.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const UpdaterModal = ({ visible, updateInfo, onConfirm, onCancel, customUI, title = "Update Available", message, confirmText = "Update", cancelText = "Cancel", styles = {}, }) => {
+    if (!visible || !updateInfo)
+        return null;
+    if (customUI)
+        return customUI(updateInfo, onConfirm, onCancel);
+    const { overlay = {}, container = {}, title: titleStyle = {}, message: messageStyle = {}, buttonRow = {}, confirmButton = {}, cancelButton = {}, } = styles;
+    return (_jsx("div", { style: {
+            position: "fixed",
+            inset: 0,
+            background: "rgba(0,0,0,0.5)",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            zIndex: 9999,
+            ...overlay,
+        }, children: _jsxs("div", { style: {
+                background: "#fff",
+                borderRadius: 8,
+                padding: 20,
+                width: 320,
+                textAlign: "center",
+                ...container,
+            }, children: [_jsx("h3", { style: { margin: "0 0 10px", ...titleStyle }, children: title }), _jsx("p", { style: { marginBottom: 20, ...messageStyle }, children: message ||
+                        `A new version (${updateInfo.availableVersion}) is available.` }), _jsxs("div", { style: {
+                        marginTop: 16,
+                        display: "flex",
+                        gap: 10,
+                        justifyContent: "center",
+                        ...buttonRow,
+                    }, children: [_jsx("button", { onClick: onConfirm, style: {
+                                background: "#007bff",
+                                color: "#fff",
+                                border: "none",
+                                padding: "8px 16px",
+                                borderRadius: 4,
+                                cursor: "pointer",
+                                ...confirmButton,
+                            }, children: confirmText }), _jsx("button", { onClick: onCancel, style: {
+                                background: "#ccc",
+                                border: "none",
+                                padding: "8px 16px",
+                                borderRadius: 4,
+                                cursor: "pointer",
+                                ...cancelButton,
+                            }, children: cancelText })] })] }) }));
+};

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./UpdaterModal.js";
+export * from "./useCapacitorUpdater.js";

package/dist/index.js

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./UpdaterModal.js";
+export * from "./useCapacitorUpdater.js";

package/dist/types.d.ts

@@ -0,0 +1,26 @@
+export interface UpdateInfo {
+    availableVersion: number;
+    url: string;
+    forceUpdate: boolean;
+    bundleId: string;
+}
+export interface UpdaterModalProps {
+    visible: boolean;
+    updateInfo: UpdateInfo | null;
+    onConfirm: () => void;
+    onCancel: () => void;
+    customUI?: (info: UpdateInfo, onConfirm: () => void, onCancel: () => void) => React.ReactNode;
+    title?: string;
+    message?: string;
+    confirmText?: string;
+    cancelText?: string;
+    styles?: {
+        overlay?: React.CSSProperties;
+        container?: React.CSSProperties;
+        title?: React.CSSProperties;
+        message?: React.CSSProperties;
+        buttonRow?: React.CSSProperties;
+        confirmButton?: React.CSSProperties;
+        cancelButton?: React.CSSProperties;
+    };
+}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/dist/useCapacitorUpdater.d.ts

@@ -0,0 +1,11 @@
+import type { UpdateInfo } from "./types.js";
+export declare function useCapacitorUpdater(options?: {
+    iosPackage?: string;
+    androidPackage?: string;
+    apiKey?: string;
+}): {
+    updateInfo: UpdateInfo | null;
+    isUpdateModalVisible: boolean;
+    setUpdateModalVisible: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    handleUpdate: (info?: UpdateInfo | null) => Promise<void>;
+};

package/dist/useCapacitorUpdater.js

@@ -0,0 +1,98 @@
+import { Capacitor, CapacitorHttp } from "@capacitor/core";
+import { Device } from "@capacitor/device";
+import { CapacitorUpdater } from "@capgo/capacitor-updater";
+import { message } from "antd";
+import { useEffect, useState } from "react";
+const API_BASE_URL = "https://dev.3rddigital.com/appupdate-api/api";
+export function useCapacitorUpdater(options) {
+    const [isUpdateModalVisible, setUpdateModalVisible] = useState(false);
+    const [updateInfo, setUpdateInfo] = useState(null);
+    useEffect(() => {
+        (async () => {
+            if (!Capacitor.isNativePlatform())
+                return;
+            try {
+                await CapacitorUpdater.notifyAppReady();
+                const response = await CapacitorHttp.get({
+                    url: `${API_BASE_URL}/projects/get-bundle`,
+                    params: {
+                        key: options?.apiKey ?? "",
+                        iosPackage: options?.iosPackage ?? "",
+                        androidPackage: options?.androidPackage ?? "",
+                    },
+                });
+                const platformData = Capacitor.getPlatform() === "android"
+                    ? response.data.android
+                    : response.data.ios;
+                const { version: availableVersion = 0, url, forceUpdate = false, bundleId, } = platformData;
+                const currentBundle = await CapacitorUpdater.current();
+                const currentVersion = currentBundle.bundle.version === "builtin"
+                    ? 0
+                    : Number(currentBundle.bundle.version);
+                if (availableVersion > currentVersion) {
+                    const info = {
+                        availableVersion,
+                        url,
+                        forceUpdate,
+                        bundleId,
+                    };
+                    setUpdateInfo(info);
+                    setUpdateModalVisible(true);
+                    if (forceUpdate)
+                        await handleUpdate(info);
+                }
+            }
+            catch (err) {
+                console.warn("[CapacitorUpdater] Failed to fetch update:", err);
+                message.error("Failed to check for updates.");
+            }
+        })();
+    }, [options?.apiKey, options?.iosPackage, options?.androidPackage]);
+    const handleUpdate = async (info = updateInfo) => {
+        if (!info)
+            return;
+        setUpdateModalVisible(false);
+        const hideLoader = message.loading("Downloading update...", 0);
+        try {
+            const data = await CapacitorUpdater.download({
+                version: info.availableVersion.toString(),
+                url: info.url,
+            });
+            await CapacitorUpdater.set(data);
+            await CapacitorHttp.post({
+                url: `${API_BASE_URL}/bundles/${info.bundleId}/count`,
+                headers: { "Content-Type": "application/json" },
+                data: { status: "success" },
+            });
+            hideLoader();
+            message.success("Update installed successfully!");
+            console.log("[CapacitorUpdater] Update installed");
+        }
+        catch (err) {
+            const deviceinfo = await Device.getInfo();
+            await CapacitorHttp.post({
+                url: `${API_BASE_URL}/bundles/${info.bundleId}/count`,
+                headers: { "Content-Type": "application/json" },
+                data: {
+                    status: "failure",
+                    error: err?.message ?? "Failed to install update.",
+                    deviceInfo: {
+                        model: deviceinfo.model,
+                        brand: deviceinfo.manufacturer,
+                        systemName: deviceinfo.operatingSystem,
+                        systemVersion: deviceinfo.osVersion,
+                    },
+                },
+            });
+            hideLoader();
+            message.error("Failed to install update.");
+            console.error("[CapacitorUpdater] Failed to install update:", err);
+        }
+    };
+    return {
+        updateInfo,
+        isUpdateModalVisible,
+        setUpdateModalVisible,
+        handleUpdate,
+    };
+}

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "capacitor-3rddigital-appupdate",
+  "version": "1.0.0",
+  "description": "Auto OTA update handler for Capacitor + React apps",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "tsc",
+    "clean": "rm -rf dist",
+    "prepublishOnly": "npm run clean && npm run build",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/latest3rddigital/capacitor-3rddigital-appupdate.git"
+  },
+  "keywords": [
+    "capacitor",
+    "react",
+    "ota",
+    "update",
+    "hot-reload"
+  ],
+  "author": "Sagar Bhavsar",
+  "license": "MIT",
+  "type": "module",
+  "bugs": {
+    "url": "https://github.com/latest3rddigital/capacitor-3rddigital-appupdate/issues"
+  },
+  "homepage": "https://github.com/latest3rddigital/capacitor-3rddigital-appupdate#readme",
+  "dependencies": {
+    "@capacitor/core": "^7.4.3",
+    "@capacitor/device": "^7.0.2",
+    "@capgo/capacitor-updater": "^7.18.2",
+    "@inquirer/prompts": "^7.8.6",
+    "antd": "^5.27.4",
+    "axios": "^1.12.2",
+    "form-data": "^4.0.4"
+  },
+  "peerDependencies": {
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.2",
+    "@types/react-dom": "^19.2.1",
+    "typescript": "^5.9.3"
+  },
+  "bin": {
+    "appupdate": "./scripts/bundle.cjs"
+  },
+  "files": [
+    "dist",
+    "src"
+  ]
+}

package/scripts/bundle.cjs

@@ -0,0 +1,187 @@
+#!/usr/bin/env node
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+const axios = require('axios');
+const FormData = require('form-data');
+const { input, select, confirm } = require('@inquirer/prompts');
+
+const API_BASE_URL = 'https://dev.3rddigital.com/appupdate-api/api/';
+
+function run(command) {
+  try {
+    console.log(`\n➡️ Running: ${command}\n`);
+    execSync(command, { stdio: 'inherit' });
+  } catch (err) {
+    console.error(`❌ Command failed: ${command}`);
+    console.error(err.message);
+    process.exit(1);
+  }
+}
+
+async function uploadBundle({ filePath, platform, config }) {
+  console.log(`📤 Uploading ${platform} bundle to server...`);
+
+  if (!fs.existsSync(filePath)) {
+    console.error(`❌ File not found: ${filePath}`);
+    process.exit(1);
+  }
+
+  const fileStream = fs.createReadStream(filePath);
+  const form = new FormData();
+  form.append('bundle', fileStream);
+  form.append('projectId', config.PROJECT_ID);
+  form.append('environment', config.ENVIRONMENT);
+  form.append('platform', platform);
+  form.append('version', config.VERSION);
+  form.append('buildNumber', String(config.BUILD_NUMBER));
+  form.append('forceUpdate', String(config.FORCE_UPDATE));
+
+  try {
+    const res = await axios.post(`${API_BASE_URL}/bundles`, form, {
+      headers: { ...form.getHeaders(), Authorization: `Bearer ${config.API_TOKEN}` },
+    });
+    console.log(`✅ ${platform} bundle uploaded! Response:`, JSON.stringify(res.data, null, 2));
+  } catch (err) {
+    console.error(`❌ ${platform} bundle upload failed!`);
+    if (err.response) {
+      console.error('Status:', err.response.status);
+      console.error('Data:', err.response.data);
+    } else {
+      console.error('Message:', err.message);
+    }
+    process.exit(1);
+  }
+}
+
+async function getCommonConfig() {
+  console.log(`\n⚙️  Enter common configuration for the app\n`);
+
+  const API_TOKEN = await input({
+    message: `Enter API Token:`,
+    validate: (val) => (val.trim() ? true : 'API Token required'),
+  });
+
+  const PROJECT_ID = await input({
+    message: `Enter Project ID:`,
+    validate: (val) => (val.trim() ? true : 'Project ID required'),
+  });
+
+  const ENVIRONMENT = await select({
+    message: `Select Environment:`,
+    choices: [
+      { name: 'development', value: 'development' },
+      { name: 'production', value: 'production' },
+    ],
+  });
+
+  return { API_TOKEN, PROJECT_ID, ENVIRONMENT };
+}
+
+async function getPlatformConfig(platform) {
+  console.log(`\n⚙️  Enter configuration for ${platform.toUpperCase()}\n`);
+
+  const VERSION = await input({
+    message: `(${platform}) Enter App Version (e.g. 1.0.0):`,
+    validate: (val) => (val.trim() ? true : 'Version required'),
+  });
+
+  const BUILD_NUMBER = await input({
+    message: `(${platform}) Enter Build Number:`,
+    validate: (val) => (!isNaN(val) && val.trim() !== '' ? true : 'Must be a number'),
+  });
+
+  const FORCE_UPDATE = await confirm({ message: `(${platform}) Force Update?`, default: false });
+
+  return { VERSION, BUILD_NUMBER, FORCE_UPDATE };
+}
+
+function getAppId() {
+  const configPath = path.join(process.cwd(), 'capacitor.config.ts');
+  if (!fs.existsSync(configPath)) {
+    console.error('❌ capacitor.config.ts not found!');
+    process.exit(1);
+  }
+  const content = fs.readFileSync(configPath, 'utf-8');
+  const match = content.match(/appId:\s*['"`](.*?)['"`]/);
+  if (!match) {
+    console.error('❌ Could not extract appId from capacitor.config.ts');
+    process.exit(1);
+  }
+  return match[1];
+}
+
+function getAppVersion() {
+  const pkgPath = path.join(process.cwd(), 'package.json');
+  if (!fs.existsSync(pkgPath)) {
+    console.error('❌ package.json not found!');
+    process.exit(1);
+  }
+  const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+  return pkg.version || '0.0.0';
+}
+
+function getLatestCapgoZip() {
+  const appId = getAppId();
+  const version = getAppVersion();
+  const expectedPrefix = `${appId}_${version}`;
+
+  const files = fs.readdirSync(process.cwd());
+  const zipFiles = files.filter((f) => f.endsWith('.zip') && f.startsWith(expectedPrefix));
+
+  if (!zipFiles.length) {
+    console.error(`❌ No Capgo bundle zip found matching: ${expectedPrefix}`);
+    process.exit(1);
+  }
+
+  zipFiles.sort((a, b) => fs.statSync(b).mtime.getTime() - fs.statSync(a).mtime.getTime());
+  return path.join(process.cwd(), zipFiles[0]);
+}
+
+function buildBundle() {
+  console.log('📦 Building web app and Capgo bundle...');
+
+  // Build web app once
+  run('npm run build');
+
+  // Create Capgo zip
+  run('npx @capgo/cli@latest bundle zip');
+
+  // Detect generated zip
+  const outputPath = getLatestCapgoZip();
+  console.log(`✅ Bundle created at ${outputPath}`);
+  return outputPath;
+}
+
+(async () => {
+  try {
+    const platformArg = process.argv[2];
+    if (!platformArg) {
+      console.error('❌ Please specify a platform: android | ios | all');
+      process.exit(1);
+    }
+
+    // Get common config once
+    const commonConfig = await getCommonConfig();
+
+    // Build bundle once
+    const bundleFile = buildBundle();
+
+    // Android upload
+    if (platformArg === 'android' || platformArg === 'all') {
+      const androidConfig = await getPlatformConfig('android');
+      await uploadBundle({ filePath: bundleFile, platform: 'android', config: { ...commonConfig, ...androidConfig } });
+    }
+
+    // iOS upload
+    if (platformArg === 'ios' || platformArg === 'all') {
+      const iosConfig = await getPlatformConfig('ios');
+      await uploadBundle({ filePath: bundleFile, platform: 'ios', config: { ...commonConfig, ...iosConfig } });
+    }
+
+    console.log('\n🎉 All tasks completed successfully!');
+  } catch (err) {
+    console.error('❌ Fatal error:', err.message);
+    process.exit(1);
+  }
+})();

package/src/UpdaterModal.tsx

@@ -0,0 +1,100 @@
+import React from "react";
+import type { UpdaterModalProps } from "./types.js";
+
+export const UpdaterModal: React.FC<UpdaterModalProps> = ({
+  visible,
+  updateInfo,
+  onConfirm,
+  onCancel,
+  customUI,
+  title = "Update Available",
+  message,
+  confirmText = "Update",
+  cancelText = "Cancel",
+  styles = {},
+}) => {
+  if (!visible || !updateInfo) return null;
+
+  if (customUI) return customUI(updateInfo, onConfirm, onCancel);
+
+  const {
+    overlay = {},
+    container = {},
+    title: titleStyle = {},
+    message: messageStyle = {},
+    buttonRow = {},
+    confirmButton = {},
+    cancelButton = {},
+  } = styles;
+
+  return (
+    <div
+      style={{
+        position: "fixed",
+        inset: 0,
+        background: "rgba(0,0,0,0.5)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        zIndex: 9999,
+        ...overlay,
+      }}
+    >
+      <div
+        style={{
+          background: "#fff",
+          borderRadius: 8,
+          padding: 20,
+          width: 320,
+          textAlign: "center",
+          ...container,
+        }}
+      >
+        <h3 style={{ margin: "0 0 10px", ...titleStyle }}>{title}</h3>
+        <p style={{ marginBottom: 20, ...messageStyle }}>
+          {message ||
+            `A new version (${updateInfo.availableVersion}) is available.`}
+        </p>
+
+        <div
+          style={{
+            marginTop: 16,
+            display: "flex",
+            gap: 10,
+            justifyContent: "center",
+            ...buttonRow,
+          }}
+        >
+          <button
+            onClick={onConfirm}
+            style={{
+              background: "#007bff",
+              color: "#fff",
+              border: "none",
+              padding: "8px 16px",
+              borderRadius: 4,
+              cursor: "pointer",
+              ...confirmButton,
+            }}
+          >
+            {confirmText}
+          </button>
+
+          <button
+            onClick={onCancel}
+            style={{
+              background: "#ccc",
+              border: "none",
+              padding: "8px 16px",
+              borderRadius: 4,
+              cursor: "pointer",
+              ...cancelButton,
+            }}
+          >
+            {cancelText}
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+};

package/src/index.ts

@@ -0,0 +1,3 @@
+export * from "./types.js";
+export * from "./UpdaterModal.js";
+export * from "./useCapacitorUpdater.js";

package/src/types.ts

@@ -0,0 +1,31 @@
+export interface UpdateInfo {
+  availableVersion: number;
+  url: string;
+  forceUpdate: boolean;
+  bundleId: string;
+}
+
+export interface UpdaterModalProps {
+  visible: boolean;
+  updateInfo: UpdateInfo | null;
+  onConfirm: () => void;
+  onCancel: () => void;
+  customUI?: (
+    info: UpdateInfo,
+    onConfirm: () => void,
+    onCancel: () => void
+  ) => React.ReactNode;
+  title?: string;
+  message?: string;
+  confirmText?: string;
+  cancelText?: string;
+  styles?: {
+    overlay?: React.CSSProperties;
+    container?: React.CSSProperties;
+    title?: React.CSSProperties;
+    message?: React.CSSProperties;
+    buttonRow?: React.CSSProperties;
+    confirmButton?: React.CSSProperties;
+    cancelButton?: React.CSSProperties;
+  };
+}

package/src/useCapacitorUpdater.ts

@@ -0,0 +1,123 @@
+import { Capacitor, CapacitorHttp } from "@capacitor/core";
+import { Device } from "@capacitor/device";
+import { CapacitorUpdater } from "@capgo/capacitor-updater";
+import { message } from "antd";
+import { useEffect, useState } from "react";
+import type { UpdateInfo } from "./types.js";
+
+const API_BASE_URL = "https://dev.3rddigital.com/appupdate-api/api";
+
+export function useCapacitorUpdater(options?: {
+  iosPackage?: string;
+  androidPackage?: string;
+  apiKey?: string;
+}) {
+  const [isUpdateModalVisible, setUpdateModalVisible] = useState(false);
+  const [updateInfo, setUpdateInfo] = useState<UpdateInfo | null>(null);
+
+  useEffect(() => {
+    (async () => {
+      if (!Capacitor.isNativePlatform()) return;
+
+      try {
+        await CapacitorUpdater.notifyAppReady();
+
+        const response = await CapacitorHttp.get({
+          url: `${API_BASE_URL}/projects/get-bundle`,
+          params: {
+            key: options?.apiKey ?? "",
+            iosPackage: options?.iosPackage ?? "",
+            androidPackage: options?.androidPackage ?? "",
+          },
+        });
+
+        const platformData =
+          Capacitor.getPlatform() === "android"
+            ? response.data.android
+            : response.data.ios;
+
+        const {
+          version: availableVersion = 0,
+          url,
+          forceUpdate = false,
+          bundleId,
+        } = platformData;
+
+        const currentBundle = await CapacitorUpdater.current();
+        const currentVersion =
+          currentBundle.bundle.version === "builtin"
+            ? 0
+            : Number(currentBundle.bundle.version);
+
+        if (availableVersion > currentVersion) {
+          const info: UpdateInfo = {
+            availableVersion,
+            url,
+            forceUpdate,
+            bundleId,
+          };
+          setUpdateInfo(info);
+          setUpdateModalVisible(true);
+
+          if (forceUpdate) await handleUpdate(info);
+        }
+      } catch (err) {
+        console.warn("[CapacitorUpdater] Failed to fetch update:", err);
+        message.error("Failed to check for updates.");
+      }
+    })();
+  }, [options?.apiKey, options?.iosPackage, options?.androidPackage]);
+
+  const handleUpdate = async (info = updateInfo) => {
+    if (!info) return;
+    setUpdateModalVisible(false);
+
+    const hideLoader = message.loading("Downloading update...", 0);
+
+    try {
+      const data = await CapacitorUpdater.download({
+        version: info.availableVersion.toString(),
+        url: info.url,
+      });
+
+      await CapacitorUpdater.set(data);
+
+      await CapacitorHttp.post({
+        url: `${API_BASE_URL}/bundles/${info.bundleId}/count`,
+        headers: { "Content-Type": "application/json" },
+        data: { status: "success" },
+      });
+
+      hideLoader();
+      message.success("Update installed successfully!");
+      console.log("[CapacitorUpdater] Update installed");
+    } catch (err: any) {
+      const deviceinfo = await Device.getInfo();
+      await CapacitorHttp.post({
+        url: `${API_BASE_URL}/bundles/${info.bundleId}/count`,
+        headers: { "Content-Type": "application/json" },
+        data: {
+          status: "failure",
+          error: err?.message ?? "Failed to install update.",
+          deviceInfo: {
+            model: deviceinfo.model,
+            brand: deviceinfo.manufacturer,
+            systemName: deviceinfo.operatingSystem,
+            systemVersion: deviceinfo.osVersion,
+          },
+        },
+      });
+
+      hideLoader();
+      message.error("Failed to install update.");
+      console.error("[CapacitorUpdater] Failed to install update:", err);
+    }
+  };
+
+  return {
+    updateInfo,
+    isUpdateModalVisible,
+    setUpdateModalVisible,
+    handleUpdate,
+  };
+}