Preparing to work with the configuration file and accessing data for iOS

This article describes how to prepare the White Label App configuration file for further work and how to get access to the data for flights and hotel searches.

Note! Before proceeding to the steps in this instruction, please read the Steps before creating an application with the White Label App. If you do not fulfill these conditions, you will not be able to create a fully functioning app.

1. Preparing to work with the configuration file

First, you need to download the archive with the application from GitHub.

After downloading the archive, follow the steps below:

  1. Create or log in to your developer.apple.com account. The account must have developer access.
  2. Xcode:
    • Download and install the Xcode program.
    • Move Xcode to the "Applications" folder on your computer if it didn't move there automatically.
    • Launch the terminal.
      • Execute the command sudo xcode-select -s /Applications/Xcode.app
    • Xcode is ready to work.
  3. Unzip the archive with the application.
  4. Launch the Terminal
    • Execute the command /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" (installation of the HomeBrew manager)
    • Execute the command brew install fastlane
    • Enter the command: cd /path/to/travel-app-ios ("path/to/travel-app-ios" is the path to the unpacked project folder)
    • Execute the command fastlane initialize (installation of cocoapods, xcodegen, needle)
    • Execute the command fastlane setup (you will need to repeat this command every time you make any changes to the project, including working with the configuration file, to apply these changes to the build).

      Important! If the window appears with the following text: "Application 'project_configurator' cannot be opened because it could not be checked for malware": 
      • Go to "Settings” → “Security & Privacy." 
      • Select "Open Anyway" for the "project_configurator" application.
      • Repeat the fastlane setup command (while in the project directory) in the terminal.
  5. The travel-app.xcworkspace will appear in the project folder - click on it, and the project will open in Xcode.
  1. Log in to your developer account in Xcode with your Apple ID ("Xcode" → "Preferences").

Done, the project is ready for configuration.

2. Working with the Configuration File

The configuration file is located in the project folder, in white-label-app-ios-main/configuration.json.

Using this file you will be able to customize the app to your brand (change the color, adjust styles, add a logo, etc.) and set up data access so users can search for tickets and hotels.

It's recommended to use Xcode for editing the configuration.json file, as Xcode will be needed for building the project (although you can edit the file with any text editor).

Example configuration.json

{
  "base_configuration": {
    "identifier": {
      "android": {
        "id": "com.travelapp",

        "versionName" : "1.0.0",
        "versionCode" : 1
      },
      "apple": {
        "id": "superpuper.travel-app",
        "team_id": "ID",

        "version": "1.0.0",

        "build_number": 0
      }
    },
    "display_name": {
      "base": "en",
      "localized": {
        "en": "Travel App EN Git",
        "es": "Travel App ES Git"
      }
    }
  },
  "constants": {
    "host" : "ios.superpuper.travel-app",
    "api_key" : "test_api_key"
    "policy_url": {
      "base": "en",
      "localized": {
        "en": "https://google.com",
        "es": "https://www.google.es"
      }
    },
    "advertising": {
      "appodeal_api_key": "",
      "google_admob_app_id": "",
      "placements": {
        "air_ticket_placement_interstitial": "",
        "air_ticket_placement_banner": "",
        "hotels_placement_interstitial": "",
        "hotels_placement_banner": ""
      }
    },
    "feedback_email": "test@test.com",
    "google_maps_api_key": "token",
    "appstore_id": "",
    "marker": marker,
    "client_device_host": "iphone.apartments"
  },
  "style": {
    "base_color": "#7648C5", // Hex value of the base color palette
    "corners_type": "default", // Corner type {sharp, default, round}
    "icons_type": "filled" // Style of used icons {filled, tint, line}

    "palette": "lab" // The principle of generating a palette
  },
  "info_screen_config": {
    "items_to_display": [
      "favorites", // Favorites section
      "about_app", // About the app section
      "rate_app", // Rate this app section
      "share_app" // Share app section
    ],
    "about_app_info": {
      "description": {
        "base": "en",
        "localized": {
          "en": "Application description",
          "es": "Descripción de la aplicación"
        }
      },
      "developer": {
        "base": "en",
        "localized": {
          "en": "CleverPunpkin Ltd.",
          "es": "OOO CleverPumpkin"
        }
      },
      "partner_url": {
        "base": "en",
        "localized": {
          "en": "https://www.google.com",
          "es": "https://www.google.es"
        }
      }
    }
  },
  "white_label_config": {
    "screens_to_display": [
      {
        "type": "flights" // Flights tab
      },
      {
        "type": "hotels" // Hotel tab
      },
      {
        "type": "other", // Other tab
        "parameters": {
          "id": "Other1",
          "icon": "ic_default_other",
          "title": {
            "base": "en",
            "localized": {
              "en": "Other",
              "es": "Otros"
            }
          },
          "url": {
            "base": "en",
            "localized": {
              "en": "https://www.google.com",
              "es": "https://www.google.es"
            }
          }
        }
      },
      {
        "type": "other", // Other tab 2
        "parameters": {
          "id": "Other2",
          "icon": "ic_default_other",
          "title": {
            "base": "en",
            "localized": {
              "en": "Other 2",
              "es": "Otros 2"
            }
          },
          "url": {
            "base": "en",
            "localized": {
              "en": "https://www.google.com",
              "es": "https://www.google.es"
            }
          }
        }
      }
    ]
  }
}

Important! After making any changes to configuration.json:

  1. Save the changes in the file.
  2. Execute the command fastlane setup in the terminal.
    After entering the terminal command, a window may appear. In that case, choose "Read From Disk."
  3. Rebuild and launch the build by clicking "▶."

3. Adding the application ID

To build the application, it is necessary to add the application's ID (bundle identifier) and Team ID to the configuration file. To do this:

1. Find the following code in the configuration file
2. Insert your values in the id and team_id parameters:

…     
"identifier": {
     ... 
      "apple": {
        "id": "superpuper.travel-app",
        "team_id": "ID"
      }
    },
… 

For iOS, it is mandatory to have the id and team_id to be able to build and run the application on a device.

3. For the iOS application, remove the android {}  block from identifier {} since it contains parameters for the Android application.

4. Access to data

To access the functionality related to flight and/or hotel searches, it is necessary to replace some default data in the configuration file. To do this

1. Find the following part of the code in the file:

...   
"constants": {  
    "api_key" : "test_api_key",
    ... 
    "marker": marker,
    "client_device_host": "iphone.apartments"
  },
...

2. Make changes to the following parameters: 

  • api_key — insert your API token to access flight tickets and hotels data. You can find the API token in your Travelpayouts account on the White Label Page:
  • marker — insert your Travelpayouts ID. You can also find it in your Travelpayouts account on the White Label App page:
  • client_device_host — specify your host, which is written like this: “[platform].[app]”
    • platform - ios 
    • app – the id of your application that you passed to identifier.apple.id
      Example: "ios.super.travel-app"

Next steps

Once you add the bundle and team ID, and get access to the data, your application is generally ready for publication in the App Store. However, to make it unique and increase the chances of successful reviews by the store, we recommend customizing your application. For example, you can change:

  • Name
  • Colors and application palette
  • Icon style
  • Search screen headings
  • Input field labels, etc.

We have compiled information on all available settings in the article Setting up and Customizing the White Label App for iOS.