B2B

The B2B plugin enables a professional shopping experience for corporate users by adding advanced features such as quote requests, saved carts, and store-specific product selection. Perfect for businesses that manage high-volume or repeat purchases.

Installation Method

You can use the following command to install the extension with the latest plugins:

npx @akinon/projectzero@latest --plugins

Setup Instructions

Routes

File path: src/routes/index.ts

enum ACCOUNT_ROUTES {
  ...,
  ACCOUNT_MY_QUOTATIONS = '/users/my-quotations'
}

Account Menu

File path: src/views/account/account-menu.tsx

const ACCOUNT_MENU_ITEMS = [
 ...,
 {
   translationKey: 'account.base.menu.my_quotations',
   href: ROUTES.ACCOUNT_MY_QUOTATIONS,
   testId: 'account-my-quotations',
 },
];

Translations

Account Menu

File path: public/locales/en/account.json

"my_quotations": "My Quotations"

File path: public/locales/tr/account.json

"my_quotations": "Tüm Tekliflerim"

Store Select Modal

File path: public/locales/en/product.json

"store_select_modal": {
 "title": "CHOOSE STORE",
 "store_name": "STORE NAME",
 "quantity": "QUANTITY",
 "add_to_basket": "Add to Basket",
 "valid_quantity": "Please select a store and enter a valid quantity"
}

File path: public/locales/tr/product.json

"store_select_modal": {
 "title": "MAĞAZA SEÇ",
 "store_name": "MAĞAZA ADI",
 "quantity": "ADET",
 "add_to_basket": "SEPETE EKLE",
 "valid_quantity": "Lütfen bir mağaza seçin ve geçerli bir miktar girin"
}

Basket

Add the translation inside the basket object. Apply this for every language

File path: public/locales/en/basket.json

"b2b": {
   "my_cart": "My Cart",
   "back_to_shopping": "BACK TO SHOPPING",
   "save_cart": "SAVE CART",
   "request_quote": "REQUEST A QUOTE",
   "total_price": "Catalog Total Price (Excl. Tax)",
   "save_cart_modal": {
     "title": "SAVE CART",
     "cart_name": "Cart Name",
     "save_cart_button": "SAVE CART"
   },
   "request_quote_modal": {
     "title": "REQUEST A QUOTE",
     "quotation_name": "Quotation Name",
     "button": "SAVE"
   },
   "remove_product_modal": {
     "title": "DELETE AND ADD TO FAVORITES",
     "description": "Would you like to add this product you want to delete to your favorites?",
     "add_to_favorites_button": "ADD TO FAVORITES",
     "delete_product_button": "delete product"
   },
   "upload_file_modal": {
     "select_file": "Select File",
     "upload": "Upload",
     "no_file_selected": "No file selected",
     "error": {
       "upload_failed": "An error occurred while uploading the file",
       "no_file_selected": "Please select a file before uploading."
     }
   },
   "empty": {
     "title": "Your cart is empty, would you like to continue with your saved carts?",
     "button": "SELECT CART",
     "choose_cart_placeholder": "Chose a cart"
   },
   "table": {
     "basket_qty": "<Qty /> Products",
     "delete": "Delete",
     "name_sku": "NAME & SKU",
     "price": "PRICE",
     "quantity": "QTY",
     "store_name": "STORE NAME",
     "store_qty": "STORE QTY",
     "subtotal": "SUBTOTAL"
   }
 }

File path: public/locales/tr/basket.json

"b2b": {
   "my_cart": "Sepetim",
   "back_to_shopping": "ALIŞVERİŞE GERİ DÖN",
   "save_cart": "SEPETİ KAYDET",
   "request_quote": "TEKLİF İSTE",
   "total_price": "Katalog Toplam Fiyatı (Vergi Hariç)",
   "save_cart_modal": {
     "title": "SEPETİ KAYDET",
     "cart_name": "Sepet Adı",
     "save_cart_button": "SEPETİ KAYDET"
   },
   "request_quote_modal": {
     "title": "TEKLİF İSTE",
     "quotation_name": "Teklif Adı",
     "button": "KAYDET"
   },
   "remove_product_modal": {
     "title": "SİL VE FAVORİLERE EKLE",
     "description": "Silmek istediğiniz bu ürünü favorilerinize eklemek ister misiniz?",
     "add_to_favorites_button": "FAVORİLERE EKLE",
     "delete_product_button": "ürünü sil"
   },
   "upload_file_modal": {
     "select_file": "Dosya Seç",
     "upload": "Yükle",
     "no_file_selected": "Dosya seçilmedi",
     "error": {
       "upload_failed": "Dosya yüklenirken bir hata oluştu",
       "no_file_selected": "Lütfen yüklemeden önce bir dosya seçin"
     }
   },
   "empty": {
     "title": "Sepetiniz boş, kaydettiğiniz sepetlerle devam etmek ister misiniz?",
     "button": "SEPETİ SEÇ",
     "choose_cart_placeholder": "Bir sepet seçin"
   },
   "table": {
     "basket_qty": "<Qty /> Ürün",
     "delete": "Sil",
     "name_sku": "AD & SKU",
     "price": "FİYAT",
     "quantity": "ADET",
     "store_name": "MAĞAZA ADI",
     "store_qty": "MAĞAZA ADEDİ",
     "subtotal": "ARA TOPLAM"
   }
 }

Rewrite URLs

File path: src/settings.js

rewrites: [
 {
   source: ROUTES.BASKET,
   destination: '/basket-b2b',
 },
 {
   source: ROUTES.ACCOUNT_MY_QUOTATIONS,
   destination: '/account/my-quotations',
 },
];

Enable the Plugin

File path: src/plugin.js

module.exports = ['...', 'pz-b2b'];

Product Page Integration

File path: src/views/product/product-info.tsx

Add imports

import { useB2b, StoreModal } from '@akinon/pz-b2b';

Add useB2b hook

const {
 openSelectStoreModal,
 setOpenSelectStoreModal,
 divisions,
 divisionLoading,
 B2bButton
} = useB2b();

Add open modal button

<B2bButton buttonText={t('product.add_to_cart')} />

Add the end in the return

{
 !divisionLoading && (
   <StoreModal
     storeData={divisions}
     productPk={data.product.pk}
     open={openSelectStoreModal}
     setOpen={setOpenSelectStoreModal}
   />
 );
}

Last updated

Was this helpful?