-
Notifications
You must be signed in to change notification settings - Fork 86
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
Add UI feedback #4679
Add UI feedback #4679
Conversation
@@ -111,7 +114,25 @@ export function HighlightsService(api, $q, $cacheFactory, packages: IPackagesSer | |||
* Mark an item for a highlight | |||
*/ | |||
service.markItem = function(highlight, markedItem) { | |||
return api.save('marked_for_highlights', {highlights: [highlight], marked_item: markedItem._id}); | |||
dispatchEvent(new CustomEvent('highlights-loading', { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you abstract it into a function so if you want to use it for some other action you would only need to call a function, but wouldn't need to know about events?
function trackArticleActionProgress<T>(p: () => Promise<T>, successMessage: string, errorMessage: string): Promise<T> {
//
}
function markItem(highlight, markedItem) {
return trackArticleActionProgress(
() => api.save(
'marked_for_highlights',
{highlights: [highlight], marked_item: markedItem._id},
),
gettext('Item marked'),
gettext('Couldn\'t mark item'),
);
}
componentDidMount() { | ||
addEventListener('highlights-loading', this.handleHighlightsLoading); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's not couple it to highlights here. Just call it loading indicator. That way we'll be able to reuse it for other actions and will not be lying via naming.
scripts/core/helpers/network.tsx
Outdated
@@ -173,3 +174,30 @@ export function uploadFileWithProgress<T>( | |||
}); | |||
}); | |||
} | |||
|
|||
export function trackArticleActionProgress<T>( | |||
p: () => Promise<T>, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
getPromise
would be a better name. p
was a placeholder in my initial snippet.
scripts/core/helpers/network.tsx
Outdated
successMessage: string, | ||
errorMessage: string, | ||
): Promise<T> { | ||
dispatchEvent(new CustomEvent('action-loading', { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
would be good to call it article-action-loading
so if anyone is logging events they would discover quicker from which part is it coming from.
cherry pick to release/2.8 and update cp dev |
SDCP-854