aefbafea9b
* Inbox notification: Added layout changes (https://github.com/woocommerce/woocommerce-admin/pull/4256) * Added notes layout and image to the API Added note layout and note image to the API and the DB * Unit test modified Unit test where modified to adapt them to the new elements * Changed the frontend following the new designs. The fronted was changed to follow the new inbox messages design. * Changed default layout type in DB * Added all the requested visual element Changed the cards' js, css and actions to achieve the visual requirements * Added "layout" and "image" to inboxQuery * Modal confirmation buttons repaired * Added "layout" and "image" to docs examples. * Removed "updateNote" from action.js Removed "updateNote" from action.js, I left it by mistake. * Spelling error corrected The button text "Dismiss all message" was corrected * noteName removed and icon added to make code reviewing easier This commit removes the "noteName" from card.js and adds the icon to make code reviewing easier * Dismiss action button refactor Refactor of the dismiss action button in the InboxNoteCard class * Removed unnecessary control * Destructured all the note properties * Colors replaced by existing variable * Removed setting of layout and image in the creation of the notes * Removed blank lines added by mistake * Close dismiss dropdown when clicking away from the popover. * Prevented the closing of the inbox panel with an action in the modal * Added small design changes * Removed unused "Gridicon" import * Prevent showing the image tag when the layout is blank * The method name getDismissButton was changed to getDismissConfirmationButton * Removed unnecessary vendor-prefixed properties * Improved note filtering in unreadNotes method * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Inbox notification: Remove icons (https://github.com/woocommerce/woocommerce-admin/pull/4258) * Info icon removed from inbox notifications The info icon was removed from inbox notifications # Conflicts: # src/Notes/DataStore.php * Removed "icon" from inboxQuery * Tests repeared Some problems with the unit tests were repaired in this commit # Conflicts: # docs/examples/activity-panel-inbox.md # Conflicts: # tests/api/admin-notes.php * Removed icon from card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Inbox notification: Add dismiss functionality (https://github.com/woocommerce/woocommerce-admin/pull/4262) * Added is_deleted param to soft delete # Conflicts: # src/API/Notes.php # src/Install.php # src/Notes/DataStore.php # src/Notes/WC_Admin_Note.php # src/Notes/WC_Admin_Notes.php # tests/api/admin-notes.php * Added the Dismiss functionality # Conflicts: # client/header/activity-panel/panels/inbox/action.js * Where clause repeared * Added Snackbar after action. * API modified to dismiss notes * Small refactor in "get_item" method This commit adds a small refactor in "get_item" method to use "prepare_note_data_for_response" * Added missing logic to Dismiss note This commit adds missing client logic to Dismiss note. # Conflicts: # client/header/activity-panel/panels/inbox/action.js # client/header/activity-panel/panels/inbox/card.js * Moved the delete action to WC_Admin_Notes.php The delete action was moved to WC_Admin_Notes.php to follow the pattern. * Added changes to dismiss messages This commit addeds changes to the messages soft delete. * DataStore.php repaired This commits adds some code that was deleted by mistake and the param "is_deleted" has been escaped. * Spelling error corrected The button text "Dismiss all message" was corrected * Repaired "get_notes_where_clauses" method A problem with the deleted notes was repaired * Added a comment to DataStore.php * Stopped sending the "dismissType" to action.js The "dismissType" is not sent to action.js anymore. * Bugfix: now the method get_notes_with_name also returns deleted notes * Bugfix: repaired empty notification list This commit repairs a bug that happens when there isn't anything in the inbox notification list * Small refactor to not use "some" Lodash method anymore * Small refactor in rednderNotes method * Added check to set_layout * Added small refactor to delete_all_notes method * Fixed code comment error * Bugfix: repaired the "delete_note" call * Inbox notification: Added layout changes (https://github.com/woocommerce/woocommerce-admin/pull/4256) * Added notes layout and image to the API Added note layout and note image to the API and the DB * Unit test modified Unit test where modified to adapt them to the new elements * Changed the frontend following the new designs. The fronted was changed to follow the new inbox messages design. * Changed default layout type in DB * Added all the requested visual element Changed the cards' js, css and actions to achieve the visual requirements * Added "layout" and "image" to inboxQuery * Modal confirmation buttons repaired * Added "layout" and "image" to docs examples. * Removed "updateNote" from action.js Removed "updateNote" from action.js, I left it by mistake. * Spelling error corrected The button text "Dismiss all message" was corrected * noteName removed and icon added to make code reviewing easier This commit removes the "noteName" from card.js and adds the icon to make code reviewing easier * Dismiss action button refactor Refactor of the dismiss action button in the InboxNoteCard class * Removed unnecessary control * Destructured all the note properties * Colors replaced by existing variable * Removed setting of layout and image in the creation of the notes * Removed blank lines added by mistake * Close dismiss dropdown when clicking away from the popover. * Prevented the closing of the inbox panel with an action in the modal * Added small design changes * Removed unused "Gridicon" import * Prevent showing the image tag when the layout is blank * The method name getDismissButton was changed to getDismissConfirmationButton * Removed unnecessary vendor-prefixed properties * Improved note filtering in unreadNotes method * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Inbox notification: Remove icons (https://github.com/woocommerce/woocommerce-admin/pull/4258) * Info icon removed from inbox notifications The info icon was removed from inbox notifications # Conflicts: # src/Notes/DataStore.php * Removed "icon" from inboxQuery * Tests repeared Some problems with the unit tests were repaired in this commit # Conflicts: # docs/examples/activity-panel-inbox.md # Conflicts: # tests/api/admin-notes.php * Removed icon from card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Improved error handling for the set_layout method * Bugfix: fixed error handling clicks inside dropdowns * Bugfix: repaired dropdown onBlur handler This commit repairs a weird behavior that the dropdown onBlur handler method had sometimes. * Text error changed Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Inbox notification: Add undo snackbar button after deletion (https://github.com/woocommerce/woocommerce-admin/pull/4281) * Added undo snakbar button for a single note # Conflicts: # client/wc-api/notes/mutations.js # src/Notes/DataStore.php # src/Notes/WC_Admin_Notes.php * Added a button to undo the deletion of all notes # Conflicts: # client/wc-api/notes/operations.js # src/API/Notes.php * Code adapted to make code reviewing easier There was some code that also was present in another PR, that code was removed to make code reviewing easier. * UnitTest added This commit adds some unit tests * Added verification for API response * Added casting to $note_id * Inbox notification: Added layout changes (https://github.com/woocommerce/woocommerce-admin/pull/4256) * Added notes layout and image to the API Added note layout and note image to the API and the DB * Unit test modified Unit test where modified to adapt them to the new elements * Changed the frontend following the new designs. The fronted was changed to follow the new inbox messages design. * Changed default layout type in DB * Added all the requested visual element Changed the cards' js, css and actions to achieve the visual requirements * Added "layout" and "image" to inboxQuery * Modal confirmation buttons repaired * Added "layout" and "image" to docs examples. * Removed "updateNote" from action.js Removed "updateNote" from action.js, I left it by mistake. * Spelling error corrected The button text "Dismiss all message" was corrected * noteName removed and icon added to make code reviewing easier This commit removes the "noteName" from card.js and adds the icon to make code reviewing easier * Dismiss action button refactor Refactor of the dismiss action button in the InboxNoteCard class * Removed unnecessary control * Destructured all the note properties * Colors replaced by existing variable * Removed setting of layout and image in the creation of the notes * Removed blank lines added by mistake * Close dismiss dropdown when clicking away from the popover. * Prevented the closing of the inbox panel with an action in the modal * Added small design changes * Removed unused "Gridicon" import * Prevent showing the image tag when the layout is blank * The method name getDismissButton was changed to getDismissConfirmationButton * Removed unnecessary vendor-prefixed properties * Improved note filtering in unreadNotes method * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Inbox notification: Remove icons (https://github.com/woocommerce/woocommerce-admin/pull/4258) * Info icon removed from inbox notifications The info icon was removed from inbox notifications # Conflicts: # src/Notes/DataStore.php * Removed "icon" from inboxQuery * Tests repeared Some problems with the unit tests were repaired in this commit # Conflicts: # docs/examples/activity-panel-inbox.md # Conflicts: # tests/api/admin-notes.php * Removed icon from card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Inbox notification: Add dismiss functionality (https://github.com/woocommerce/woocommerce-admin/pull/4262) * Added is_deleted param to soft delete # Conflicts: # src/API/Notes.php # src/Install.php # src/Notes/DataStore.php # src/Notes/WC_Admin_Note.php # src/Notes/WC_Admin_Notes.php # tests/api/admin-notes.php * Added the Dismiss functionality # Conflicts: # client/header/activity-panel/panels/inbox/action.js * Where clause repeared * Added Snackbar after action. * API modified to dismiss notes * Small refactor in "get_item" method This commit adds a small refactor in "get_item" method to use "prepare_note_data_for_response" * Added missing logic to Dismiss note This commit adds missing client logic to Dismiss note. # Conflicts: # client/header/activity-panel/panels/inbox/action.js # client/header/activity-panel/panels/inbox/card.js * Moved the delete action to WC_Admin_Notes.php The delete action was moved to WC_Admin_Notes.php to follow the pattern. * Added changes to dismiss messages This commit addeds changes to the messages soft delete. * DataStore.php repaired This commits adds some code that was deleted by mistake and the param "is_deleted" has been escaped. * Spelling error corrected The button text "Dismiss all message" was corrected * Repaired "get_notes_where_clauses" method A problem with the deleted notes was repaired * Added a comment to DataStore.php * Stopped sending the "dismissType" to action.js The "dismissType" is not sent to action.js anymore. * Bugfix: now the method get_notes_with_name also returns deleted notes * Bugfix: repaired empty notification list This commit repairs a bug that happens when there isn't anything in the inbox notification list * Small refactor to not use "some" Lodash method anymore * Small refactor in rednderNotes method * Added check to set_layout * Added small refactor to delete_all_notes method * Fixed code comment error * Bugfix: repaired the "delete_note" call * Inbox notification: Added layout changes (https://github.com/woocommerce/woocommerce-admin/pull/4256) * Added notes layout and image to the API Added note layout and note image to the API and the DB * Unit test modified Unit test where modified to adapt them to the new elements * Changed the frontend following the new designs. The fronted was changed to follow the new inbox messages design. * Changed default layout type in DB * Added all the requested visual element Changed the cards' js, css and actions to achieve the visual requirements * Added "layout" and "image" to inboxQuery * Modal confirmation buttons repaired * Added "layout" and "image" to docs examples. * Removed "updateNote" from action.js Removed "updateNote" from action.js, I left it by mistake. * Spelling error corrected The button text "Dismiss all message" was corrected * noteName removed and icon added to make code reviewing easier This commit removes the "noteName" from card.js and adds the icon to make code reviewing easier * Dismiss action button refactor Refactor of the dismiss action button in the InboxNoteCard class * Removed unnecessary control * Destructured all the note properties * Colors replaced by existing variable * Removed setting of layout and image in the creation of the notes * Removed blank lines added by mistake * Close dismiss dropdown when clicking away from the popover. * Prevented the closing of the inbox panel with an action in the modal * Added small design changes * Removed unused "Gridicon" import * Prevent showing the image tag when the layout is blank * The method name getDismissButton was changed to getDismissConfirmationButton * Removed unnecessary vendor-prefixed properties * Improved note filtering in unreadNotes method * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Update client/header/activity-panel/panels/inbox/style.scss Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Inbox notification: Remove icons (https://github.com/woocommerce/woocommerce-admin/pull/4258) * Info icon removed from inbox notifications The info icon was removed from inbox notifications # Conflicts: # src/Notes/DataStore.php * Removed "icon" from inboxQuery * Tests repeared Some problems with the unit tests were repaired in this commit # Conflicts: # docs/examples/activity-panel-inbox.md # Conflicts: # tests/api/admin-notes.php * Removed icon from card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Improved error handling for the set_layout method * Bugfix: fixed error handling clicks inside dropdowns * Bugfix: repaired dropdown onBlur handler This commit repairs a weird behavior that the dropdown onBlur handler method had sometimes. * Text error changed Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Stopped sending the "dismissType" to action.js The "dismissType" is not sent to action.js anymore. # Conflicts: # client/header/activity-panel/panels/inbox/card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> * Bugfix: solved problem when a note was undismissed There was a problem with the undismiss functionality. When a note was undismissed, it always was recovered with "plain" layout. This commit solves this problem. * Inbox notification: add event recording (https://github.com/woocommerce/woocommerce-admin/pull/4320) * Added events recording This commit adds events recording to the inbox notifications # Conflicts: # client/header/activity-panel/panels/inbox/index.js * Added 'home_screen' verification Changed recorded name, now when the client is in the WooCommerce 'home' page we record 'home_screen' instead of 'wc-admin'. * Added a naming fix and a new prop to the recordEvent * bugfix: added control before interaction with bodyNotificationRef * Added more unit tests for new endpoints This commit adds tests for deleting a single note and for deleting all the notes, both without permission. * Modified variable name * Refactor: prop rename and small logic change * Screen name getter moved into the InboxNoteCard This commit moves the screen name getter inside the InboxNoteCard. # Conflicts: # client/header/activity-panel/panels/inbox/index.js * Removed "screen" from state Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Refactor in admin-notes unit tests Some unnecessary controls were removed from the admin-notes unit tests * Indentation fixed in Install.php. Replaced spaces with tabs. * Inbox notification: added new placeholder and empty card (https://github.com/woocommerce/woocommerce-admin/pull/4379) * Added a new placeholder and an empty card This commit adds a new placeholder and a new empty card to the inbox panel # Conflicts: # client/header/activity-panel/panels/inbox/index.js # client/header/activity-panel/panels/inbox/style.scss * Added border to read notes * Improved note filtering in unreadNotes method and validNotes # Conflicts: # client/header/activity-panel/panels/inbox/index.js * Actions render refactored The actions render was refactored in InboxNoteCard component * Refactor of InboxPanel component The methods getUnreadNotesCount and hasValidNotes were separated from the InboxPanel component # Conflicts: # client/header/activity-panel/panels/inbox/index.js * Refactor inbox panel subtitle classes * Added changes for when a note is undismissed This commit adds the requested changes in behavior and design for when a note is dismissed. # Conflicts: # client/header/activity-panel/panels/inbox/index.js * Bugfix: Added key to itemlist The InboxNotePlaceholder is shown as an itemlist but it didn't have a key. This commit adds it. * Removed unnecessary validation * Refactored actionList map This commit adds a refactor to the actionList map * Changes to the getUndoDismissRequesting functionality This commit adds a few changes to the getUndoDismissRequesting functionality * Changed className prop * Changed other className prop * Modified InboxPanel rendering * Removed unnecessary method in placeholder.js * Simplified the card.js renderActions method * Change renderActions return in card.js Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Inbox notification: add client unit tests (https://github.com/woocommerce/woocommerce-admin/pull/4386) * Added client unit tests * Added test cases for getUnreadNotesCount and hasValidNotes * Corrected typo error * Removed Enzyme and added React Testing Library * Removed unnecessary param Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> * Resolved some conflicts with master * Marketing note test repaired This commit repairs the marketing note test * Added note type 'marketing' to delete all functionality * Removed set_icon method from some notes and docs * Added set_icon method as deprecated to prevent errors. Co-authored-by: Fernando Marichal <contacto@fernandomarichal.com> Co-authored-by: Joshua T Flowers <joshuatf@gmail.com> |
||
|---|---|---|
| .. | ||
| test | ||
| README.md | ||
| index.js | ||
| placeholder.js | ||
| style.scss | ||
README.md
ActivityCard
A card designed for use in the activity panel. This is a very structured component, which expects at minimum a label and content. It can optionally also include a date, actions, an image, and a dropdown menu.
How to use:
import { ActivityCard } from 'components/activity-card';
render: function() {
return (
<ActivityCard
title="Insight"
icon={ <Gridicon icon="search" /> }
date="2018-07-10T00:00:00Z"
actions={ [ <a href="/">Action link</a>, <a href="/">Action link 2</a> ] }
>
Insight content goes in this area here. It will probably be a couple of lines long and may
include an accompanying image. We might consider color-coding the icon for quicker
scanning.
</ActivityCard>
);
}
Props
title: A title for this card (required).subtitle: An element rendered right under the title.children: Content used in the body of the action card (required).actions: A list of links or buttons shown in the footer of the card.date: The timestamp associated with this activity.icon: An icon or avatar used to identify this activity. Defaults to Gridicon "notice-outline".unread: If this prop is present, the card has a small red bubble indicating an "unread" item. Defaults to false.
ActivityCardPlaceholder
This component is similar to ActivityCard in output, but renders no real content, just loading placeholders. This is also hidden from any interaction with screen readers using aria-hidden.
How to use:
import { ActivityCardPlaceholder } from 'components/activity-card';
render: function() {
return (
<ActivityCardPlaceholder hasDate />
);
}
Props
hasAction: Boolean. If true, shows a placeholder block for an action. Default false.hasDate: Boolean. If true, shows a placeholder block for the date. Default false.hasSubtitle: Boolean. If true, shows a placeholder block for the subtitle. Default false.lines: Number. How many lines of placeholder content we should show. Default 1.