Prerequisites

1. First, we have to create a Teams Application.
   The application should contain three files as follows:

   1. Icon-color.png

   2. Icon-outline.png

   3. manifest.json:

{
  "$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.16/MicrosoftTeams.schema.json",
  "manifestVersion": "1.16",
  "id": "$application_id",
  "version": "1.0.0",
  "packageName": "de.jtel.acd.teams",
  "developer": {
    "name": "jtel GmbH",
    "websiteUrl": "https://jtel.de/",
    "privacyUrl": "https://jtel.de/privacy-statement-eu/",
    "termsOfUseUrl": "https://jtel.de/en/legal",
    "mpnId": ""
  },
  "name": {
    "short": "jtel ACD",
    "full": "jtel ACD Client Tab"
  },
  "description": {
    "short": "jtel ACD Teams Client",
    "full": "The jtel ACD Client for Microsoft Teams provides seamless integration with jtel's Carrier Portal, enabling users to manage carrier operations directly within Teams. Access dashboards, monitor performance metrics, and collaborate with your team efficiently."
  },
  "icons": {
    "outline": "Icon-outline.png",
    "color": "Icon-color.png"
  },
  "accentColor": "#333333",
  "configurableTabs": [],
  "staticTabs": [
    {
      "entityId": "jtelACD",
      "name": "jtel ACD",
      "contentUrl": "$acd_portal_url",
      "websiteUrl": "$acd_portal_url",
      "scopes": [ "team", "personal" ]
    }
  ],
  "bots": [],
  "connectors": [],
  "composeExtensions": [],
  "permissions": [
    "identity",
    "messageTeamMembers"
  ],
  "validDomains": [
    "$acd_domain",
    "jtel.de"
  ],
  "webApplicationInfo": {
    "id": "$app_registration_id",
    "resource": "https://$acd_domain"
  }
}
  

Icon-color and Icon-outline are the App icons/logo.

P.S. Here is a tip to generate $application_id:

The following website Free Online GUID Generator allows you to generate our application ID.

The $acd_portal_url is the portal URL to log in. For example:

https://myacdsystem.mydomain.de/CarrierPortal/login/myResellersUID/myClientsUID

The $acd_domain should be myacdsystem.mydomain.de

The $app_registration_id is the "Application (client) ID" of the App registrations app in Microsoft Azure.

The Teams only accepts URL with https.

Finally, zip the three files together.

Example in the attachment:

jtelACDTeamsTab.zip

2. To create Teams Apps for your organization, you must be a Global Admin

Login to Microsoft 365 admin center with your admin credential and make sure of the role.

Install jtel app in Teams

1. Login to Dashboard - Microsoft Teams admin center

2. Go to Teams apps → Manage apps and click on Upload new app.

3. Follow the steps to upload the zip file created in the previous steps.
   
   

   
   
   

4. By successful upload, you should see the following popup:
   
   
   
   

5. You should be able to see the new app in All apps table by typing the filter jtel ACD
   
   
   
   

6. Go to Teams apps → Setup policies and click on Global (Org-wide default)

7. Under Installed apps click on Add apps and search for the added application by the name “jtel ACD“. Next click on Add.

8. Under Pinned apps, click on Add apps and add the new application.

9. Finally click on save button and you should see the following popup:
   
   
   
   

10. Restart the Teams application and go to Apps and search for jtel ACD.
    
    
    
    

11. Select the new application and click on Add button. The portal will be opened then.

P.S: The teams application doesn't get the changes immediately. If you don't see the new application in teams application, then verify with the teams web application.

Update an existing app

1. Update the app folder (manifest.json and icons if necessary).
2. In manifest.json, the id should be the same and the version should be incremented (1.0.1 for example).
3. Zip the folder.
4. Login to Dashboard - Microsoft Teams admin center.
5. Go to Teams apps → Manage apps and search for the jtel app.
6. Open the app and click on New version Upload file on the top of the screen.
7. Upload the new zip.