I Want to show a banner only for the checkout as company but not working

VsisodiyaDesign
Shopify Expert
59 2 9
I want to use usePurchasingCompany  hook to show a banner only for b2b customer not d2c customer .
Here is my code i put trarget properly .
But its not working even i have configuration properly -
 
scopes = "read_companies,read_customers,read_draft_orders,write_customers,write_draft_orders"
Thats are scopes, can anyone help me please
 
import React from "react";
import { Banner, usePurchasingCompany } from "@shopify/ui-extensions-react/checkout";

export function App() {
  const purchasingCompany = usePurchasingCompany();

  // Check if the checkout is being made by a company
  if (purchasingCompany) {
    // If yes, show the banner
    return (
      <Banner>Holiday impacts on draft orders</Banner>
    );
  } else {
    // If not, return null to show nothing
    return null;
  }
}
Looking for a skilled Shopify developer to handle tasks or provide monthly retainer services?
Please contact me at

 https://vsisodiyadesign.com

Replies 6 (6)

VsisodiyaDesign
Shopify Expert
59 2 9

Anyone please give your insight , i am stucking on this .

Thank you 

Looking for a skilled Shopify developer to handle tasks or provide monthly retainer services?
Please contact me at

 https://vsisodiyadesign.com

devrex
Shopify Partner
9 0 0

Hi,

I have the same issue. 

 

usePurchasingCompany return is undefined.

I already added a company to the customer.
I request for Level 1 customer data access.

I tried displaying the customer from useCustomer hook and it has results. 

Did I miss something to make to work?


VsisodiyaDesign
Shopify Expert
59 2 9
Did you gave proper scope ?
In my case - scopes = "read_companies,read_customers,read_draft_orders,write_customers,write_draft_orders"
Here is code thats working fine  if thats help to you 
 
import {
    reactExtension,
    Banner,
    usePurchasingCompany,
  } from '@shopify/ui-extensions-react/checkout';

  export default reactExtension(
    'purchase.checkout.payment-method-list.render-before',
    () => <Extension />,
  );

  function Extension() {

    const purchasingCompany = usePurchasingCompany();
  if(!purchasingCompany) {
    return null;
  }
 
  return (
    <Banner
      status="critical"
      title="Test Note"
    />
  );

  }
Looking for a skilled Shopify developer to handle tasks or provide monthly retainer services?
Please contact me at

 https://vsisodiyadesign.com

devrex
Shopify Partner
9 0 0

Hi VsisodiyaDesign,

 

Thank you for your response.

devrex
Shopify Partner
9 0 0

Hi,

 

I found the issue.

 

To be able to use usePurchasingCompany  hook for b2b customer.

 

You need to enable "New Customer accounts". (Settings > Customer accounts > Choose which version of customer accounts to use.)

 

devrex_0-1712017964817.png

 

VsisodiyaDesign
Shopify Expert
59 2 9

Got it .Yes new account is only support the b2b customer account .

 

Looking for a skilled Shopify developer to handle tasks or provide monthly retainer services?
Please contact me at

 https://vsisodiyadesign.com