reactioncommerce / kinetic Goto Github PK

If you enter an account that does not exist I get this message, however I am unable to locate a "Sign Up" option

PLACEHOLDER STORY
As an operator, I want to filter the records of the customer table by:

• Last Order Date - date range
• Registered Date - date range
• Order Number range
• Total Spend range

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A12788

Acceptance Criteria:
TBD

Address Validation
Main https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18412
Edit https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18452

I want to see a list of my address validation plug ins and be able to edit the countries in which those address validation plug ins are used.
I should not be able to use two different validation services in a single country
If I identify a specific country for a plug in, that should override any plug ins that are assigned globally

So what I would consider the definition of done for this would be:
Docs:

• How we plan for define permissions (with examples)
• How we plan to integrate both API permissions and client permissions (probably sort of query and merge)

Proof of Concept:

• Some working examples of permissions:
  • Cannot access a top level item at all (if we have the example plugin might tie in well with this)
  • Can create but not delete Shipping Methods
  • Can view but not modify Tax Rates

** This ticket will be updated once our approach to filtering has been defined more**

• User can type in the search field and the list presents results that match the search based on the Promo name or ID
• User can paste a comma separate list of Promo IDs and see those promos in the results
• User can use the Date filter to find any promotion with a scheduled day that falls in the filter date range
• User can filter results using our standard filtering functionality (which is TBD for now)
• User can click the Filter dropdown and filter by
• Promo Type
• Action
• Trigger
• Status
• Inclusions
• Exclusions

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2137%3A47901

As an operator, I want to search the customer table so that I can easily find the customer I'm looking for. I would like the search field to search the following:

• Customer Name
• User ID
• Email

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

Acceptance Criteria

• User can type a text string in the search box, hit Enter key, and the records in the table reflect that string with any records that have matching string in Customer Name, User ID, and Email
• Search string is not case sensitive

As a user I want to clearly understand what the options for Conditions are in the dropdown menu on the Add/Edit Shipping Restriction screens. Change the text for each option according to the below: (old text) --> (updated text)
eq --> equals
gt --> greater than
lt --> less than
ne --> not equal to
match --> matches

Groups have a description which would be useful to see in the table to provide some context on what a group means. Can we add a column to this table to show description.

As a operator, I want to take an Action on my Promo Listing page including Creating a New promotion, Duplicate, Enable, Disable, and Archive

Acceptance Criteria

• User can click the Actions dropdown menu and see the follow options:

• Create New

• Duplicate

• Enable

• Disable

• Archive

• User can choose Create New and be brought to a Create page for a new promotion

• User can choose Duplicate, and the current selected promo(s) will be duplicated in the list with "Copy of" added to the beginning of the promo name. The state of these new duplicated promos will be Disabled regardless of the original's state

• User can Enable the selected promotions. If selected promos are already enabled, their state does not change

• User can Disable the selected promotions. If selected promos are already disabled, their state does not change

• User can Archive the selected promotions. Archived promotions will not appear in future lists for any users (except Admins)

• When Archiving promotions, user should receive a warning dialogue that explains "You are about to Archive, the selected promotion(s) will no longer be visible to you"

Mockup link: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

Customers in Kinetic is where operators can search and view Customer details, including contact info, orders, and Loyalty program information

https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18359

Acceptance Criteria:
User can set a promotion as Never Stackable
Never Stackable promotions are applied only when no other promotions are present on a cart
If a customer attempts to trigger a Never Stackable promotion and it conflicts with existing promotions, the customer receives a prompt in the cart to choose which promotion to keep

When a user chooses to create (or duplicate a promotion) the system should automatically assign a promotion with a randomly generated up to 20 character numeric promotion ID so that the promotion is easily identifiable by internal systems

• User creates a new promotion and an ID is automatically assigned

• User duplicates a promotion and the new promotion has an ID automatically assigned

• 20 character max for ID

• No two promotions can have the same ID

• ID is shown in header of promotion detail page

Mockup: (Promotion Detail Page) https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

The status column in the listing page should show a status badge based the scheduled dates of the promotion, today's date, and whether the promotion is enabled or disabled.

• User should see Enabled status when a promo is Enabled but has an upcoming Start Date
• User should see Active status when a promo is Enabled and today's date is within the range of the Start Date and End Date
• User should see Disabled status when a promo is Disabled and has an End date in the future, or no scheduled dates
• User should see Past status when a promo has an End Date that is before today

Mockup Link: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

As an operator I want to export the records shown in the Customer Table so that I can work with the information outside of Kinetic

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

Acceptance Criteria

• User can export a CSV file of the customer table records
• Records included in CSV are reflective of any active filters and sorting at the time of export

Choosing "Add a Store" from the menu brings you to the New Shop page. On the New Shop page, the text reads "Set up you shop". Change the text to read "Set up your shop" so that it is grammatically correct.

Figma Link: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1276%3A19847

As a user I want to edit a group so that I can update its Name, Description, and Permissions.

Name

• I want to be able to edit the text of the group Name

Description

• I want to be able to edit the text of the group Description

Permissions

• I want to be able to search Permissions to quickly find the one I am looking for
• I want to be able to toggle a Permission On or Off using a checkbox
• I want to see my Permissions organized in an accordion menu by Permission Group (Accounts, Orders, Groups, Fulfillment etc) which I can expand or collapse in order to view the Permissions within that Group
• I want to be able to a toggle all Permissions within a Permission Group On or Off using the group checkbox
• I want to see a count of the number of Permissions I've selected within a Permission Group

Save and Cancel

• I want to be able to Save or Cancel my changes

Payments https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18319

I want to Enable or Disable payment method plug ins using a toggle

As an admin I want to manage Checkout settings so that I can manage Payments, Taxes, and Address Validation for my shop.

Checkout Detail Page Navigation - I want to navigate between separate tabs to manage Payments, Taxes, and Address Validation

Payments https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18319

• I want to Enable or Disable payment method plug ins using a toggle

Taxes https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18359

• I want to be able to designate a Primary Method and a Fallback Method for my tax plug ins

Address Validation
Main https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18412
Edit https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18452

• I want to see a list of my address validation plug ins and be able to edit the countries in which those address validation plug ins are used.
• I should not be able to use two different validation services in a single country
• If I identify a specific country for a plug in, that should override any plug ins that are assigned globally

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

As an operator, I want to navigate the records displayed in my Customer listing page's Customer Table through pagination so that I can expect the results to load quickly and in a volume that is preferable to me. I would like the option to choose the number of records displayed in the table:

• 10 (Default)
• 50
• 100
• 500

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

Acceptance Criteria

• User can select the number of rows they see in a page (10, 50, 100, or 500) via a dropdown
• The number of results they select will persist through future sessions until they change it. (User selects 100 results, logs out, logs in again and when the Customer Table loads it loads 100 results)
• User can navigate to Previous and Next Page
• User can navigate to a page of their choice (this isn't included in the mockup, is there a preset component we can leverage for this?)

• User can create a new promotion by duplicating an existing one

• The new promotion has a unique promotion ID

Now that we are setting the 'Homepage URL', we should update the 'View Storefront' link in the Sidebar to point to this URL. If a user clicks on this link, it should open in a new tab.

This epic contains stories related to the creation of a new promotion, including setting the

• Promotion name (issue 6629)
• Promotion ID (issue 6628)
• Promotion Type (issue 6632)
• Description (issue 6630)
• Duplicating a promotion (issue 6631)

The purpose of this ticket is to capture the various features of the layout, other tickets will go more in depth on the individual feature functionality (eg Search, Action, Status etc)

Acceptance Criteria:

• User can see a list of Promotions in a table, with columns that display

• Name

• Promo ID

• Promo Type

• Action

• Start Date

• End Date

• Status (issue 6625)

• User can access tab navigation that links to filtered views of the table with the following options (issue 6623)

• Active

• Upcoming

• Disabled

• Past

• All

• User can access search to find the promo they are looking for

• User can access filters to find the promo they are looking for

• User can sort the list ascending / descending by clicking on table headers

• User can access an Actions dropdown menu (issue 6622)

• User can select individual promotions in the table or select All by clicking the checkbox in the header

• User can navigate the list using standard pagination functionality

• User can access the Promotion Detail Page by clicking the Promotion Name

Mockup Link: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

As an operator, I want to be able to sort the contents of the Customer Table so that I can quickly find the information I am looking for. The columns I want to be able to sort are:

• Customer Name
• Email
• Date Registered
• Last Order Date
• Total Spend
• Number of Orders

Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

Acceptance Criteria

• User can click a column header and alternate between sort descending and sort ascending
• Sortable contents of table is based on the filters that have been applied (rather than sorting all customer records on the server)
• Sorting Customer Name should sort based on Last Name rather than First Name

Users should be able to filter the list based on some common presets, including Active, Upcoming, Disabled, View All, and Archived ( if user has See Archived Promotions permission)

• User can click a header and the list updates to show only promos with the relevant statuses
• Active view shows promos that are Enabled and have a Start date earlier than today, and an End date later than today
• Upcoming view shows promos that have a Start date after today
• Disabled view shows any promos that are currently Disabled
• View All shows all promos (except Archived)
• Archived promos should not appear in any view other than Archived

Currently when you create a user, even if they don't have shop permissions, it will prompt you to create a shop and then tell you you don't have permissions. The system should be modified so that this step is skipped if you don't have permissions

This is a pretty key setting that does not appear to be anywhere in Checkout Settings. Should probably just be under Shop Details.

Absence of this makes it impossible to fully configure checkout to work under Kinetic

• User can enter a description or notes in a free form text field that describe the promotion in detail
• 5000 character limit
• Text field should height should expand according to the length of the description input, so that the entire description is visible in the field if the description text is longer than the 3 line default

Mockups: (Promotion Detail Page) https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

Can we swap the store logo object-fit property from cover to contain. The logo is getting cut off with the current settings.

As an operator, when I arrive on the Customer Listing Page, I want to see a selectable list of customers in a table with the following information arranged in columns from left to right:

• Customer Name
• User ID
• Email
• Registered Date
• Number of Orders
• Total Spend
• Last Order Date

The layout of the page and customer table should reflect the Figma mockup:
Figma: https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1717%3A13491

Acceptance Criteria

• Customer Listing Page includes: Breadcrumbs, "Customers" page header, Search and Filter section, Table Header and action menu button, Customer Table, and Pagination for table results
• User is able to view Customer Name, User ID, Email, and Registered Date for every customer. Number of Orders, Total Spend, and Last Order Date may not be available or applicable to all customers so it's ok if those don't show for every customer
• Each record on the table should have a check box that indicates whether a record has been selected (eventually we will have actions that work off of those selections, for now it's ok to hide the checkboxes until we have actions)
• User can Select All visible records by clicking the checkbox in the header
• Select All should not select records that have been filtered out of the list

We should update the Property field on the Shipping Surcharges and Restrictions to be a select, rather than a free text field. This will require API work to unblock this ticket.

• Shipping Surcharge Property Condition
• Shipping Restriction Property Condition

• User can type an alpha numeric description of their promotion

• 280 character limit for name

Mockups: (Promotion Detail) https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

As we delve more into users and permissions this sprint, we should revisit an experience that allows users to add Groups. This should follow the same flow and designs as Editing an existing group.

https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1276%3A19847

Taxes https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=1275%3A18359

I want to be able to designate a Primary Method and a Fallback Method for my tax plug ins

This Epic outlines features and functionality related to the Promotions listing page

Mockup Link: Promotion Lister section https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

We keep all our base docker files here: https://github.com/reactioncommerce/docker-base so we should create one that builds on the node dev/prod images but adds pnpm

• User can click a Promotion Type dropdown and see the following options (ignore parenthesis in UI, these are notes for backend)

• Cart Discount (Discount: Order)

• Item Discount (Discount: Item)

• Shipping Promotion (Discount: Shipping)

• When user selects the Promotion Type, the Promotion Detail Page options for Action and Trigger will reflect any options related to the chosen Type

Mockup: (Promotion Detail Page) https://www.figma.com/file/vWot2cXXgjcsLpMq4SAX90/Kinetic?node-id=2020%3A54523

The current button used to add a flat rate in Shipping doesn't match with the other Add buttons in the Kinetic UI. Change this button from a "+" to a button that reads "Add flat rate" and right align it to match the Save Changes button alignment above