H5 Mall UI BizBundle

Last Updated on : 2023-10-08 03:08:47download

H5 Mall UI BizBundle provides the iOS container that hosts the value-added service App Mall. You can leverage various mall capabilities to monetize the user traffic through your in-app store. An app mall is a global e-commerce platform built into the app. For more information, see App Mall.

Integrate with the UI BizBundle

Add the components of the H5 Mall UI BizBundle to the Podfile and run the command pod update.

source "https://github.com/tuya/tuya-pod-specs"
source 'https://cdn.cocoapods.org/'
platform :ios, '11.0'

target 'your_target_name' do
  # ThingSmart SDK
  pod "ThingSmartHomeKit"
  # Adds H5 Mall UI BizBundle
  pod 'ThingSmartMallBizBundle'
end

Service protocols

Provide services

The UI BizBundle relies on the implementation of ThingMallProtocol to provide services. You can view the ThingMallProtocol.h file in the ThingModuleServices component.

#import <Foundation/Foundation.h>
#import "ThingMallInfo.h"

typedef NS_ENUM(NSUInteger, ThingMallPageType) {
    ThingMallPageTypeHome,      // Mall home page
    ThingMallPageTypeOrders,    // Mall orders page
};

typedef void(^ThingMallInfoCompletion)(ThingMallInfo * _Nullable mall, NSError * _Nullable error);

@protocol ThingMallProtocol <NSObject>


/**
 * Get the store jump link and switch information.
 * Only one successful request will be executed per app lifecycle, and thereafter the cached data will be returned.
 * Always use cache first.
 */
- (void)fetchMallInfoWithCompletion:(ThingMallInfoCompletion)completion;

/**
 * Request special mall page with `ThingMallPageType`
 * You should replace the mall page every time after the logged user has changed.
 * @param pageType Mall page type
 */
- (void)requestMallPage:(ThingMallPageType)pageType completionBlock:(void(^)(__kindof UIViewController *page, NSError *error))callback;

/**
 * Request special mall page with url
 * You should replace the mall page every time after the logged user has changed.
 * @param url Mall url
 */
- (void)requestMallPageWithUrl:(NSString *)url completionBlock:(void(^)(__kindof UIViewController *page, NSError *error))callback;

/**
 * After the successful call of the fetchMallInfoWithCompletion method, you can directly obtain the cached information.
 */
- (ThingMallInfo * _Nullable)cachedMallInfo;

/**
 * Mall view controller, maybe MiniApp Container, H5 Container
 */
- (UIViewController *)mallViewController;


#pragma mark deprecated

/**
 * Check if mall is enabled for currently logged user.
 * You should check this every time after logged user changed.
 */
- (void)checkIfMallEnableForCurrentUser:(void(^)(BOOL enable, NSError *error))callback __attribute__((deprecated("use fetchMallInfoWithCompletion: instead.")));

/**
 * Request special mall url with `ThingMallPageType`
 * @param pageType Mall page type
 */
- (void)requestMallUrlWithPage:(ThingMallPageType)pageType completionBlock:(void(^)(NSString *url, NSError *error))callback __attribute__((deprecated("use fetchMallInfoWithCompletion: instead.")));


@end

Depend on services

None.

API list

Things to note

  1. Before the call of any API method, make sure that the user has logged in to the app.
  2. Before the mall pages are returned, check whether the App Mall service is enabled for the region in which the current user is registered. The App Mall service is strongly correlated with user information.
  3. If the user status is changed, you must check the availability of the H5 Mall UI BizBundle to reload the mall pages.
  4. The mall pages are returned as UIViewController. UINavigationController must be used to call the push or present method.
  5. The mall pages depend on the navigation controller, and navigation content settings are required. The view controller needs to be wrapped in the navigation controller.

Get mall pages (UIViewController)

The following mall pages are returned:

  • Home: ThingMallPageTypeHome
  • Orders: ThingMallPageTypeOrders

You can integrate with the UI BizBundle and get these pages as needed. New pages pushed later must be wrapped with NavigationController. Otherwise, navigation to subsequent pages will fail.

ObjC:

#import <ThingSmartBizCore/ThingSmartBizCore.h>
#import <ThingModuleServices/ThingMallProtocol.h>

id<ThingMallProtocol> mallImpl = [[ThingSmartBizCore sharedInstance] serviceOfProtocol:@protocol(ThingMallProtocol)];
[impl requestMallPage:ThingMallPageTypeHome completionBlock:^(__kindof UIViewController *page, NSError *error) {
    UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:page];
    [self presentViewController:nav animated:YES completion:nil];
}];

Swift:

let mallImpl = ThingSmartBizCore.sharedInstance().service(of: ThingMallProtocol.self)
(mallImpl as? ThingMallProtocol)?.request(.home, completionBlock: { (mallVc, error) in
    if let e = error {
        print("\(e)")
        return
    }
    // push
    yourNaviController.pushViewController(mallVc!, animated: true)
    // present
    let naviVc = UINavigationController.init(rootViewController: mallVc!)
    yourViewController.present(naviVc, animated: true, completion: nil)
})

Query availability status

ObjC:

#import <ThingSmartBizCore/ThingSmartBizCore.h>
#import <ThingModuleServices/ThingMallProtocol.h>

id<ThingMallProtocol> mallImpl = [[ThingSmartBizCore sharedInstance] serviceOfProtocol:@protocol(ThingMallProtocol)];
[mallImpl fetchMallInfoWithCompletion:^(ThingMallInfo * _Nullable mall, NSError * _Nullable error) {
        if (error) {
            // Return error on failure.
            NSLog(@"%@",error);
        } else {
            if (mall.enableMall) {
                // When enable is true, the mall is available. Otherwise, the mall is not available.
                NSLog(@"%@",@(enable));
        }
    }
}];

Swift:

let mallImpl = ThingSmartBizCore.sharedInstance().service(of: ThingMallProtocol.self) as? ThingMallProtocol
mallImpl?.fetchMallInfo(completion: { mallInfo, error in
    if let e = error {
        print("\(e)")
        return
    }
    if ((mallInfo?.enableMall()) != nil) {

    }
})

Get mall pages (PageUrl)

The following mall pages are returned:

  • Home: ThingMallPageTypeHome
  • Orders: ThingMallPageTypeOrders

You can integrate with the UI BizBundle and get routing URLs of these pages as needed. ViewController can be obtained based on Url. After Url is returned, you can modify certain parameters on your terms.

ObjC:

#import <ThingSmartBizCore/ThingSmartBizCore.h>
#import <ThingModuleServices/ThingMallProtocol.h>

id<ThingMallProtocol> mallImpl = [[ThingSmartBizCore sharedInstance] serviceOfProtocol:@protocol(ThingMallProtocol)];
[mallImpl fetchMallInfoWithCompletion:^(ThingMallInfo * _Nullable mall, NSError * _Nullable error) {
    f (error) {

    } else if (mall.mallURL) {

    }
}];

Swift:

let mallImpl = ThingSmartBizCore.sharedInstance().service(of: ThingMallProtocol.self) as? ThingMallProtocol
mallImpl?.fetchMallInfo(completion: { mallInfo, error in
    if let e = error {
        print("\(e)")
        return
    }
    if let url = mallInfo?.mallURL() {

    }
})

Get ViewController based on page Url

For the service that is included in the domain name allowlist, you can use this method to generate a ViewController based on the Url of the service page.

ObjC:

#import <ThingSmartBizCore/ThingSmartBizCore.h>
#import <ThingModuleServices/ThingMallProtocol.h>

id<ThingMallProtocol> mallImpl = [[ThingSmartBizCore sharedInstance] serviceOfProtocol:@protocol(ThingMallProtocol)];
[impl requestMallPageWithUrl:@"https://mallpage/pagetext/target" completionBlock:^(__kindof UIViewController *page, NSError *error) {
		UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:page];
    [self presentViewController:nav animated:YES completion:nil];
}];

Swift:

let mallImpl = ThingSmartBizCore.sharedInstance().service(of: ThingMallProtocol.self)
(mallImpl as? ThingMallProtocol)?.requestMallPageWithUrl("https://mallpage/pagetext/target", completionBlock: { (mallVc, error) in
    if let e = error {
        print("\(e)")
        return
    }
    // push
    yourNaviController.pushViewController(mallVc!, animated: true)
    // present
    let naviVc = UINavigationController.init(rootViewController: mallVc!)
    yourViewController.present(naviVc, animated: true, completion: nil)
})

FAQs

The system asynchronously checks whether to display the mall and a latency exists in the process of loading the tab page. How do I optimize this process?

After successful login to the app, checkIfMallEnableForCurrentUser can be called to determine whether to display the mall. At the end of the callback, the mall tab page can be reloaded. This asynchronous operation is required.

After a floating window appears above the mall page or after navigation to a custom page, the tab bar disappears. How do I fix this problem?

  1. To deal with the navigation from the mall tab page to a custom page, apply this setting: self.navigationController.navigationBarHidden = NO.
  2. To deal with the navigation from a custom page to the mall tab page, apply this setting: self.navigationController.navigationBarHidden = YES.

An error has occurred while loading the mall tab page. How do I fix the problem?

  1. Check whether the test device has the system time modified.
  2. Check whether the app domain name is correct.

The navigation to the mall page failed. How do I fix the problem?

By default, ‘self.navigationController Push’ is used to implement the navigation. The UIViewController, returned by the mall service, must be wrapped with UINavigationController before being added to UITabbarController.

How can I modify the logic of displaying the mall tab page?

  1. requestMallUrlWithPage is used to obtain the URL of the homepage or orders page for the mall.
  2. Modify the parameters in UrlParams:
    • _ty_hideNav=1: displays the mall tab page.
    • _ty_hideNav=0: hides the mall tab page.