Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Doc Feature][Custom activity icons in activity feed notifications][3679852] #12543

Open
wants to merge 15 commits into
base: main
Choose a base branch
from

Conversation

v-kushals
Copy link
Collaborator

No description provided.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@v-kushals v-kushals marked this pull request as draft March 26, 2025 12:35
@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@v-kushals v-kushals requested a review from Copilot March 26, 2025 13:38
Copilot

This comment was marked as outdated.

This comment was marked as outdated.

This comment was marked as outdated.

@v-kushals v-kushals changed the title [Doc Feature][Custom icons in activity feed notifications][3679852] [Doc Feature][Custom activity icons in feed][3679852] Mar 28, 2025
@v-kushals v-kushals changed the title [Doc Feature][Custom activity icons in feed][3679852] [Doc Feature][Custom activity icons in activiity feed notifications][3679852] Mar 28, 2025
@v-kushals v-kushals changed the title [Doc Feature][Custom activity icons in activiity feed notifications][3679852] [Doc Feature][Custom activity icons in activity feed notifications][3679852] Mar 28, 2025
@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

@v-kushals v-kushals marked this pull request as ready for review March 28, 2025 09:23
@acrolinxatmsft1

This comment was marked as outdated.

This comment was marked as outdated.

Copy link
Collaborator

@ChetanSharma-msft ChetanSharma-msft left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added my review comments.

@@ -13,6 +13,7 @@ An app package is a file format that has the required resources to install and r

* **[App manifest](#app-manifest)**: Describes how your app is configured, including its capabilities, required resources, and other important attributes.
* **[App icons](#app-icons)**: Each package requires a color and outline icon for your app.
* **[Custom activity icons](/graph/teams-send-activityfeednotifications?toc=%2Fmicrosoftteams%2Fplatform%2Ftoc.json&bc=%2Fmicrosoftteams%2Fplatform%2Fbreadcrumb%2Ftoc.json&tabs=desktop%2Chttp#custom-activity-icons-in-activity-feed-notifications)**: Tailor-made icons that you can use in activity feed notifications.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't we redirect to specific section which actually explains how to configure it and what configuration we need to add it in the manifest?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ChetanSharma-msft, the link redirects to the specific section on how to configure it and what configuration we need to add it in the manifest. However, since the PR in the graph docs isn't live yet, it redirects to the top of the page.

@@ -40,6 +40,10 @@ The following variants show the kinds of activity feed notification cards you ca

:::image type="content" source="../../assets/images/activity-feed/activity-feed-card-types.png" alt-text="Variants of Teams activity feed cards." lightbox="../../assets/images/activity-feed/activity-feed-card-types.png":::

## Custom activity icons

You can add custom activity icons in activity feed notifications to increase user engagement for your app. For more information, see [custom activity icons in activity feed notifications](/graph/teams-send-activityfeednotifications?toc=%2Fmicrosoftteams%2Fplatform%2Ftoc.json&bc=%2Fmicrosoftteams%2Fplatform%2Fbreadcrumb%2Ftoc.json&tabs=desktop%2Chttp#custom-activity-icons-in-activity-feed-notifications).
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't we redirect to specific section in the documentation?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ChetanSharma-msft, same as above.

@@ -46,6 +46,8 @@ landingContent:
linkLists:
- linkListType: whats-new
links:
- text: Use custom activity icons in activity feed notifications
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't we redirect to specific section in the documentation?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ChetanSharma-msft, same as above.

@@ -888,53 +888,75 @@ Define the properties your app uses to post a user activity feed.
|`type`|String|32 characters|✔️|The notification type.|
|`description`|String|128 characters|✔️|A brief description of the notification.|
|`templateText`|String|128 characters|✔️|Ex: "{actor} created task {taskId} for you"|
|`allowedIconIds`|Array of strings| | |A list of custom icon IDs valid for that activity.|
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we check Maximum Size with the Engineering team and update it?

Copy link
Collaborator Author

@v-kushals v-kushals Mar 31, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ChetanSharma-msft, I'll ask Mehak and update.


|Name| Type| Maximum size | Required | Description|
|---|---|---|---|---|
|`id`|String| |✔️|Defines the unique icon ID.|
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What are the maximum size for id and iconFIle?
Can we check with the Engineering team and update here?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ChetanSharma-msft, Mehak mentioned that it was probably 20 but is yet to be confirmed. I have updated it as 20 for now.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@v-kushals as per dev's confirmation, please change 20 to 50. Thanks!

"description": "leadership Announcements",
"templateText": "{actor} shared an announcement",
"allowedIconIds" : [
"announcementCreated"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can't we put placeholders here if this is an example?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've updated the code snippet with placeholder names, @ChetanSharma-msft.

@acrolinxatmsft1
Copy link
Collaborator

Acrolinx Scorecards

We currently enforce a minimum score of 80.

Click the scorecard links for each article to review the Acrolinx feedback on grammar, spelling, punctuation, writing style, and terminology:

Article Score Issues Scorecard Processed
msteams-platform/concepts/build-and-test/apps-package.md 92 8 link
msteams-platform/concepts/deploy-and-publish/appsource/prepare/teams-store-validation-guidelines.md 90 160 link
msteams-platform/concepts/design/activity-feed-notifications.md 96 1 link
msteams-platform/mstdd-landing.yml 87 9 link
msteams-platform/resources/schema/manifest-schema-dev-preview.md 86 160 link
msteams-platform/whats-new.md 90 101 link

More info about Acrolinx

Use the Acrolinx extension, or sidebar, in Visual Studio Code to check spelling, grammar, style, tone, clarity, and key terminology when you're creating or updating content. For more information, see Use the Visual Studio Code extension to run Acrolinx locally.

Copy link
Contributor

Learn Build status updates of commit 32cc1c0:

✅ Validation status: passed

File Status Preview URL Details
msteams-platform/concepts/build-and-test/apps-package.md ✅Succeeded View
msteams-platform/concepts/deploy-and-publish/appsource/prepare/teams-store-validation-guidelines.md ✅Succeeded View
msteams-platform/concepts/design/activity-feed-notifications.md ✅Succeeded View
msteams-platform/mstdd-landing.yml ✅Succeeded View
msteams-platform/resources/schema/manifest-schema-dev-preview.md ✅Succeeded View
msteams-platform/whats-new.md ✅Succeeded View

For more details, please refer to the build report.

For any questions, please:

Copy link
Collaborator

@luywang luywang left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please address my comments, thank you for helping with these docs!

* The outline icon mustn't contain any additional padding around the symbol.
* Ensure that the outline icon size is 32x32 pixels.
* The icon must be either white with a transparent background or transparent with a white background. No other colors are allowed.
* The outline icon mustn't contain any additional padding around the symbol.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Line 82 & 83: can we reuse the exact wording from store validation guidelines? @v-kushals

  • The size of icon must be 32x32 pixels.
  • The icon must be enterprise-safe.
  • The icon can't be random or irrelevant and needs to match the information in the notification.
  • The icon must be designed with good accessibility.


|Name| Type| Maximum size | Required | Description|
|---|---|---|---|---|
|`id`|String| |✔️|Defines the unique icon ID.|
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@v-kushals as per dev's confirmation, please change 20 to 50. Thanks!

}
]
}
//...
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@v-kushals is "//..." required? Line 906 and line 956.

"type": "taskCreated",
"description": "task created activity",
"templateText": "Pradeep Gupta created a new task item for you.",
// No icons are associated with this activity type. When you send a notification using this activity type, Teams shows the default brand logo.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"default brand logo" should be changed to "app icon". @v-kushals

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants