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.

Sign up for GitHub

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

Enable transaction dispute details feature for all merchants (remove feature flag) #7365

Merged
merged 10 commits into from
Oct 5, 2023
Merged

Enable transaction dispute details feature for all merchants (remove feature flag) #7365

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
266fe7d
Remove transaction dispute details feature flag to enable feature by …
Jinksi Oct 4, 2023
7cc4546
Remove redundant payment details summary test
Jinksi Oct 4, 2023
868ab80
Group dispute-related payment details summary tests
Jinksi Oct 4, 2023
6c40af9
Update snapshot for dispute-reversal test
Jinksi Oct 4, 2023
c85be9b
Remove unused import
Jinksi Oct 4, 2023
28e14a5
Fix PHPCS errors
Jinksi Oct 4, 2023
030262e
Merge branch 'develop' into add/7289-remove-transaction-dispute-detai…
Jinksi Oct 4, 2023
171fe63
Add changelog entry
Jinksi Oct 4, 2023
520a379
Merge branch 'develop' into add/7289-remove-transaction-dispute-detai…
Jinksi Oct 4, 2023
bebbecd
Merge branch 'develop' into add/7289-remove-transaction-dispute-detai…
Jinksi Oct 5, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions changelog/add-7289-remove-transaction-dispute-details-feature-flag
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: major
Type: add

Display dispute information, recommended resolution steps, and actions directly on the transaction details screen to help merchants with dispute resolution.
Copy link
Contributor

Choose a reason for hiding this comment

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

Nice changelog!

1 change: 0 additions & 1 deletion client/globals.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ declare global {
customSearch: boolean;
isAuthAndCaptureEnabled: boolean;
paymentTimeline: boolean;
isDisputeOnTransactionPageEnabled: boolean;
};
fraudServices: unknown[];
testMode: boolean;
Expand Down
13 changes: 2 additions & 11 deletions client/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import DepositDetailsPage from 'deposits/details';
import TransactionsPage from 'transactions';
import PaymentDetailsPage from 'payment-details';
import DisputesPage from 'disputes';
import LegacyDisputeDetailsPage from 'disputes/details';
import RedirectToTransactionDetails from 'disputes/redirect-to-transaction-details';
import DisputeEvidencePage from 'disputes/evidence';
import AdditionalMethodsPage from 'wcpay/additional-methods-setup';
Expand Down Expand Up @@ -152,14 +151,8 @@ addFilter(
capability: 'manage_woocommerce',
} );

// If disputes on transaction page feature is enabled, set up a soft
// redirect component; otherwise register the (legacy) dispute details page.
const isDisputeOnTransactionPageEnabled =
window.wcpaySettings.featureFlags.isDisputeOnTransactionPageEnabled;
pages.push( {
container: isDisputeOnTransactionPageEnabled
? RedirectToTransactionDetails
: LegacyDisputeDetailsPage,
container: RedirectToTransactionDetails,
Copy link
Contributor

Choose a reason for hiding this comment

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

We can also remove LegacyDisputeDetailsPage completely.

Copy link
Member Author

Choose a reason for hiding this comment

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

I believe this is being handled in #7363 and is OK to merge after 6.6.

path: '/payments/disputes/details',
wpOpenMenu: menuID,
breadcrumbs: [
Expand All @@ -171,9 +164,7 @@ addFilter(
__( 'Dispute details', 'woocommerce-payments' ),
],
navArgs: {
id: isDisputeOnTransactionPageEnabled
? 'wc-payments-disputes-details-legacy-redirect'
: 'wc-payments-disputes-details',
id: 'wc-payments-disputes-details-legacy-redirect',
parentPath: '/payments/disputes',
},
capability: 'manage_woocommerce',
Expand Down
7 changes: 2 additions & 5 deletions client/payment-details/summary/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,10 +167,7 @@ const PaymentDetailsSummary: React.FC< PaymentDetailsSummaryProps > = ( {
charge.currency && balance.currency !== charge.currency;

const {
featureFlags: {
isAuthAndCaptureEnabled,
isDisputeOnTransactionPageEnabled,
},
featureFlags: { isAuthAndCaptureEnabled },
} = useContext( WCPaySettingsContext );

// We should only fetch the authorization data if the payment is marked for manual capture and it is not already captured.
Expand Down Expand Up @@ -463,7 +460,7 @@ const PaymentDetailsSummary: React.FC< PaymentDetailsSummaryProps > = ( {
</LoadableBlock>
</CardBody>

{ isDisputeOnTransactionPageEnabled && charge.dispute && (
{ charge.dispute && (
<>
{ isAwaitingResponse( charge.dispute.status ) ? (
<DisputeAwaitingResponseDetails
Expand Down
305 changes: 29 additions & 276 deletions client/payment-details/summary/test/__snapshots__/index.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2418,297 +2418,50 @@ exports[`PaymentDetailsSummary renders the information of a dispute-reversal cha
</li>
</ul>
</div>
</div>
<div
aria-hidden="true"
class="components-elevation css-91yjwm-View-Elevation-sx-Base-elevationClassName em57xhy0"
data-wp-c16t="true"
data-wp-component="Elevation"
/>
<div
aria-hidden="true"
class="components-elevation css-91yjwm-View-Elevation-sx-Base-elevationClassName em57xhy0"
data-wp-c16t="true"
data-wp-component="Elevation"
/>
</div>
</div>
`;

exports[`PaymentDetailsSummary renders the information of a disputed charge 1`] = `
<div>
<div
class="components-surface components-card css-nsno0f-View-Surface-getBorders-primary-Card-rounded em57xhy0"
data-wp-c16t="true"
data-wp-component="Card"
>
<div
class="css-mgwsf4-View-Content em57xhy0"
>
<div
class="components-card__body components-card-body css-1nwhnu3-View-Body-borderRadius-medium em57xhy0"
class="components-flex components-card__footer components-card-footer transaction-details-dispute-footer css-p1v47q-View-Flex-sx-Base-sx-Items-ItemsRow-Footer-borderRadius-borderColor-medium em57xhy0"
data-wp-c16t="true"
data-wp-component="CardBody"
data-wp-component="CardFooter"
>
<div
class="payment-details-summary"
class="components-flex css-1giw1wa-View-Flex-sx-Base-sx-Items-ItemsRow em57xhy0"
data-wp-c16t="true"
data-wp-component="Flex"
>
<div
class="payment-details-summary__section"
class="components-flex-item css-mw3lhz-View-Item-sx-Base em57xhy0"
data-wp-c16t="true"
data-wp-component="FlexItem"
>
<p
class="payment-details-summary__amount"
>
$20.00
<span
class="payment-details-summary__amount-currency"
>
usd
</span>
<span
class="chip chip-primary"
>
Disputed: Under review
</span>
</p>
<div
class="payment-details-summary__breakdown"
Good news! You won this dispute on -. The disputed amount and the dispute fee have been credited back to your account.
<a
href="https://woocommerce.com/document/woopayments/fraud-and-disputes/"
rel="noopener noreferrer"
target="_blank"
>
<p>
Deducted:
$-20.00
</p>
<p>
Fees:
$-15.70
<button
class="wcpay-tooltip__content-wrapper wcpay-tooltip--click__content-wrapper"
type="button"
>
<div
class="wcpay-tooltip__content-wrapper"
>
<div
aria-label="Fee breakdown"
role="button"
tabindex="0"
>
<svg
class="gridicon gridicons-help-outline"
height="16"
viewBox="0 0 24 24"
width="16"
xmlns="http://www.w3.org/2000/svg"
>
<g>
<path
d="M12 4c4.411 0 8 3.589 8 8s-3.589 8-8 8-8-3.589-8-8 3.589-8 8-8m0-2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm4 8a4 4 0 00-8 0h2c0-1.103.897-2 2-2s2 .897 2 2-.897 2-2 2a1 1 0 00-1 1v2h2v-1.141A3.991 3.991 0 0016 10zm-3 6h-2v2h2v-2z"
/>
</g>
</svg>
</div>
</div>
</button>
</p>

<p>
Net:
$-15.70
</p>
</div>
Learn more about preventing disputes
</a>
.
</div>
<div
class="payment-details-summary__section"
class="components-flex-item transaction-details-dispute-footer__actions css-mw3lhz-View-Item-sx-Base em57xhy0"
data-wp-c16t="true"
data-wp-component="FlexItem"
>
<div
class="payment-details-summary__id"
<a
data-link-type="wc-admin"
href="admin.php?page=wc-admin&path=%2Fpayments%2Fdisputes%2Fchallenge&id=dp_1"
>
Payment ID:
ch_38jdHA39KKA
</div>
<button
class="components-button is-secondary"
type="button"
>
View dispute details
</button>
</a>
</div>
</div>
</div>
<hr
aria-orientation="horizontal"
class="components-divider components-card__divider components-card-divider css-yo8r29-DividerView-renderBorder-renderSize-renderMargin-Divider-borderColor e19on6iw0"
data-wp-c16t="true"
data-wp-component="CardDivider"
role="separator"
/>
<div
class="components-card__body components-card-body css-1nwhnu3-View-Body-borderRadius-medium em57xhy0"
data-wp-c16t="true"
data-wp-component="CardBody"
>
<ul
class="woocommerce-list woocommerce-list--horizontal"
role="menu"
>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Date
</span>
<span
class="woocommerce-list__item-content"
>
Sep 19, 2019, 5:24pm
</span>
</div>
</div>
</li>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Channel
</span>
<span
class="woocommerce-list__item-content"
>
<span>
Online
</span>
</span>
</div>
</div>
</li>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Customer
</span>
<span
class="woocommerce-list__item-content"
>
<a
data-link-type="wc-admin"
href="admin.php?page=wc-admin&path=%2Fpayments%2Ftransactions&search%5B0%5D=Customer%20name%20(mock%40example.com)"
>
Customer name
</a>
</span>
</div>
</div>
</li>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Order
</span>
<span
class="woocommerce-list__item-content"
>
<a
data-link-type="external"
href="https://somerandomorderurl.com/?edit_order=45981"
>
45981
</a>
</span>
</div>
</div>
</li>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Payment method
</span>
<span
class="woocommerce-list__item-content"
>
<span
class="payment-method-details"
>
<button
class="wcpay-tooltip__content-wrapper"
type="button"
>
<div
class="wcpay-tooltip__content-wrapper"
>
<span
aria-label="Visa"
class="payment-method__brand payment-method__brand--visa"
/>
</div>
</button>
 •••• 
4242
</span>
</span>
</div>
</div>
</li>
<li
class="woocommerce-list__item"
>
<div
class="woocommerce-list__item-inner"
>
<div
class="woocommerce-list__item-text"
>
<span
class="woocommerce-list__item-title"
>
Risk evaluation
</span>
<span
class="woocommerce-list__item-content"
>
Normal
</span>
</div>
</div>
</li>
</ul>
</div>
</div>
<div
aria-hidden="true"
Expand Down
Loading
Loading