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?