Installing Nana MiniApps SDK

Follow these steps to install the Nana MiniApps SDK into your project:

Unzip the Plugin File: Start by unzipping the nana-app-plugin file provided by the Nana team.
Place the Plugin Folder: Place the nana-app-plugin folder in the root directory of your project.
Change Directory: Open your terminal and change the directory to the nana-app-plugin folder:
```
cd nana-app-plugin
```
Install Dependencies: Run the following command to install the necessary dependencies:
```
npm install
```
Build the Plugin: Run the build command to generate the compiled version of the plugin:
```
npm run build
```
Modify Return Values for Testing: Navigate to /dist/esm/web.js inside the nana-app-plugin folder and modify the example return values to test different scenarios.
Switch Back to Project Root: Navigate back to the root directory of your project:
```
cd ..
```
Add Plugin to Dependencies: Add the nana-app-plugin to the dependencies in your package.json file:
```
"dependencies": {
  "nana-app-plugin": "file:nana-app-plugin"
}
```
Install Plugin in Project: Run npm install in your project root directory to ensure the plugin is properly linked:
```
npm install
```
Import the Plugin: Now, you can import the nana-app-plugin into your code:
```
import { NanaAppPlugin } from "nana-app-plugin";
```

Notes on Using the SDK

App Token: Always provide the correct miniapp token when making requests to the Nana SDK.
Error Handling: Ensure you handle potential errors (e.g., network issues, permissions) while interacting with the SDK to provide a smooth user experience.
Languages: The SDK returns data in English (en) and Arabic (ar). Make sure to implement language checks in your miniapp to cater to users in their preferred language.

Interacting with the Nana MiniApps SDK

To interact with the SDK, you will need a miniapp token provided by the Nana team. The token will be used to authenticate requests and establish communication between your miniapp and the Nana App.

Available SDK Methods

Below are the available SDK methods for various features you can integrate into your miniapp:

1. Check If User Is Logged In

Method: isLoggedIn()

Description: Checks if the user is currently logged in to the Nana App.

Returns: A promise that resolves with an object containing a boolean value.

Usage Example:

const loggedInStatus = await NanaAppPlugin.isLoggedIn();
if (loggedInStatus.value) {
    console.log("User is logged in");
} else {
    console.log("User is not logged in");
}

2. Log In User

Method: login()

Description: Opens a login prompt for the user if they are not already logged in. This method allows users to log in to access exclusive miniapp features.

Returns: A promise that resolves with an object containing a boolean value.

Usage Example:

await NanaAppPlugin.login();
const isLoggedIn = await NanaAppPlugin.isLoggedIn();
if (isLoggedIn.value) {
    console.log("User successfully logged in");
}

3. Get Platform Information

Method: platform()

Description: Returns the mobile platform type (e.g., 'ios', 'android') for the user device.

Returns: A promise that resolves with an object containing a string value.

Usage Example:

const platformInfo = await NanaAppPlugin.platform();
console.log("Platform:", platformInfo.value); // Example output: 'ios'

4. Get User Language Preference

Method: language()

Description: Fetches the current language of the user (e.g., 'en' for English, 'ar' for Arabic).

Returns: A promise that resolves with an object containing a string value.

Usage Example:

const userLanguage = await NanaAppPlugin.language();
console.log("User Language:", userLanguage.value); // Example output: 'en'

5. Register a Reward

Method: registerReward(options)

Description: Registers a reward for the user. This could be used to provide in-app currency or bonuses.

Parameters:

options: An object containing:
- appToken: The token provided for your miniapp.
- miniapp_reward_id: The ID of the reward to register.
- value: The value of the reward.
- description_en: Description of the reward in English.
- description_ar: Description of the reward in Arabic.

Returns: A promise that resolves with an object containing the status of the registration.

Usage Example:

const response = await NanaAppPlugin.registerReward({
    appToken: "your-miniapp-token",
    miniapp_reward_id: "10",
    value: "5",
    description_en: "Collected 5 coins",
    description_ar: "تم جمع 5 عملات"
});
console.log(response.value); // Output: "{status: 'success', message: 'Reward registered successfully'}"

6. Get Available Rewards

Method: availableRewards(options)

Description: Retrieves available rewards for the user, including reward limits and remaining rewards.

Parameters:

options: An object containing:
- appToken: The token provided for your miniapp.

Returns: A promise that resolves with an object containing a list of available rewards.

Usage Example:

const rewardsData = await NanaAppPlugin.availableRewards({ appToken: "your-miniapp-token" });
const rewards = JSON.parse(rewardsData.value);
console.log("Available Rewards:", rewards);

7. Register a Try

Method: activityLog(options)

Description: Logs an activity when the user starts a try, which could represent participation in a game or action.

Parameters:

options: An object containing:
- appToken: The token provided for your miniapp.
- activity_type: Type of the activity (e.g., 'started_try').
- description_en: Description of the activity in English.
- description_ar: Description of the activity in Arabic.

Returns: A promise that resolves with an object containing the status of the activity registration.

Usage Example:

const tryResponse = await NanaAppPlugin.activityLog({
    appToken: "your-miniapp-token",
    activity_type: "started_try",
    description_en: "Started a new try",
    description_ar: "بدأ محاولة جديدة"
});
console.log(tryResponse.value); // Output: "{status: 'success', message: 'Activity logged successfully'}"

8. Get Available Tries

Method: availableTries(options)

Description: Fetches the number of available tries left for the user, along with additional information such as reset dates.

Parameters:

options: An object containing:
- appToken: The token provided for your miniapp.

Returns: A promise that resolves with an object containing information on available tries.

Usage Example:

const triesData = await NanaAppPlugin.availableTries({ appToken: "your-miniapp-token" });
const tries = JSON.parse(triesData.value);
console.log("Available Tries:", tries);

9. Get User ID

Method: userId()

Description: Retrieves the user's unique ID in the Nana system. This can be used to reference the user during reward or activity tracking.

Returns: A promise that resolves with an object containing the user ID.

Usage Example:

const userIdData = await NanaAppPlugin.userId();
console.log("User ID:", userIdData.value); // Output: "[email protected]"

Notes on Using the SDK

App Token: Always provide the correct miniapp token when making requests to the Nana SDK.
Error Handling: Ensure you handle potential errors (e.g., network issues, permissions) while interacting with the SDK to provide a smooth user experience.
Languages: The SDK returns data in English (en) and Arabic (ar). Make sure to implement language checks in your miniapp to cater to users in their preferred language.

Conclusion

With the Nana MiniApps SDK, you can enhance your miniapp's capabilities and provide a more personalized experience for users. Utilize the features mentioned in this guide to integrate rewards, track tries, manage authentication, and more.

If you have any questions or need further assistance, please contact the Nana development team.