diff --git a/apps/storefront/package-lock.json b/apps/storefront/package-lock.json index c62e5b77..bf49c8de 100644 --- a/apps/storefront/package-lock.json +++ b/apps/storefront/package-lock.json @@ -4,6 +4,12 @@ "lockfileVersion": 1, "requires": true, "dependencies": { + "@types/lodash": { + "version": "4.14.190", + "resolved": "https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.190.tgz", + "integrity": "sha512-5iJ3FBJBvQHQ8sFhEhJfjUP+G+LalhavTkYyrAYqz5MEJG+erSv0k9KJLb6q7++17Lafk1scaTIFXcMJlwK8Mw==", + "dev": true + }, "@types/prop-types": { "version": "15.7.5", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", diff --git a/apps/storefront/package.json b/apps/storefront/package.json index ee4842f4..8843c2bc 100644 --- a/apps/storefront/package.json +++ b/apps/storefront/package.json @@ -23,7 +23,6 @@ "@mui/x-date-pickers": "^5.0.0-beta.0", "@rollup/plugin-graphql": "^1.1.0", "@types/babel__core": "^7.1.19", - "@types/lodash": "^4.14.190", "date-fns": "^2.28.0", "http-server": "^14.1.1", "lodash": "^4.17.21", @@ -39,6 +38,7 @@ "@b3/tsconfig": "*", "@testing-library/react": "^13.3.0", "@testing-library/user-event": "^14.2.5", + "@types/lodash": "^4.14.190", "@types/react": "^18.0.0", "@types/react-dom": "^18.0.0", "@types/react-infinite-scroller": "^1.2.3", diff --git a/apps/storefront/src/pages/address/Address.tsx b/apps/storefront/src/pages/address/Address.tsx index 3b1a60d1..b846b3c9 100644 --- a/apps/storefront/src/pages/address/Address.tsx +++ b/apps/storefront/src/pages/address/Address.tsx @@ -75,8 +75,10 @@ const Address = () => { state: { role, isB2BUser, + isAgenting, + salesRepCompanyId, companyInfo: { - id: companyId, + id: companyInfoId, }, addressConfig, }, @@ -95,6 +97,10 @@ const Address = () => { first: 9, }) + const companyId = role === 3 && isAgenting ? salesRepCompanyId : companyInfoId + const hasAdminPermission = isB2BUser && (!role || (role === 3 && isAgenting)) + const isBCPermission = !isB2BUser || (role === 3 && !isAgenting) + const [isMobile] = useMobile() useEffect(() => { @@ -102,7 +108,7 @@ const Address = () => { const handleGetAddressFields = async () => { setIsRequestLoading(true) try { - const addressFields = await getAddressFields(isB2BUser) + const addressFields = await getAddressFields(!isBCPermission) setAddressFields(addressFields) } catch (err) { console.log(err) @@ -124,7 +130,7 @@ const Address = () => { count, } = pagination - if (isB2BUser) { + if (!isBCPermission) { const { addresses: { edges: addressList = [], @@ -216,14 +222,12 @@ const Address = () => { const [isOpenDelete, setIsOpenDelete] = useState(false) const [currentAddress, setCurrentAddress] = useState() - const isAdmin = !isB2BUser || !role || role === 3 - const getEditPermission = async () => { - if (!isB2BUser) { + if (isBCPermission) { setEditPermission(true) return } - if (!role || role === 3) { + if (hasAdminPermission) { try { let configList = addressConfig if (!configList) { @@ -240,7 +244,7 @@ const Address = () => { }) } - const key = !role ? 'address_admin' : 'address_sales_rep' + const key = role === 3 ? 'address_sales_rep' : 'address_admin' const editPermission = (configList || []).find((config: AddressConfigItem) => config.key === key)?.isEnabled === '1' setEditPermission(editPermission) @@ -254,38 +258,24 @@ const Address = () => { getEditPermission() }, []) - const checkPermission = () => { - if (!isAdmin) { - return false - } - if (!editPermission) { - return false - } - return true - } - const handleCreate = () => { - if (!checkPermission()) { + if (!editPermission) { snackbar.error('You do not have permission to add new address, please contact store owner ') return } - // TODO show create modal - addEditAddressRef.current?.handleOpenAddEditAddressClick('add', 111) - console.log('create') + addEditAddressRef.current?.handleOpenAddEditAddressClick('add') } const handleEdit = (row: any) => { - if (!checkPermission()) { + if (!editPermission) { snackbar.error('You do not have permission to edit address, please contact store owner ') return } - // TODO show edit modal addEditAddressRef.current?.handleOpenAddEditAddressClick('edit', row) - console.log('edit') } const handleDelete = (address: AddressItemType) => { - if (!checkPermission()) { + if (!editPermission) { snackbar.error('You do not have permission to delete address, please contact store owner ') return } @@ -303,7 +293,7 @@ const Address = () => { } const AddButtonConfig = { - isEnabled: isAdmin, + isEnabled: editPermission, customLabel: 'Add new address', } @@ -338,6 +328,8 @@ const Address = () => { onEdit={() => handleEdit(row)} onDelete={handleDelete} onSetDefault={handleSetDefault} + editPermission={editPermission} + isBCPermission={isBCPermission} /> )} /> @@ -345,28 +337,33 @@ const Address = () => { updateAddressList={updateAddressList} addressFields={addressFields} ref={addEditAddressRef} + companyId={companyId} + isBCPermission={isBCPermission} /> { - isAdmin && isB2BUser && ( - + editPermission && !isBCPermission && ( + ) } { - isAdmin && ( + editPermission && ( ) } diff --git a/apps/storefront/src/pages/address/components/AddressForm.tsx b/apps/storefront/src/pages/address/components/AddressForm.tsx index 40c22f8f..baa5b437 100644 --- a/apps/storefront/src/pages/address/components/AddressForm.tsx +++ b/apps/storefront/src/pages/address/components/AddressForm.tsx @@ -30,6 +30,10 @@ import { b2bShippingBilling, } from '../shared/config' +import { + snackbar, +} from '@/utils' + import { GlobaledContext, } from '@/shared/global' @@ -77,16 +81,9 @@ const deepClone = (data: any) => { const AddressForm = ({ addressFields, updateAddressList, + companyId, + isBCPermission, }: any, ref: Ref | undefined) => { - const { - state: { - isB2BUser, - companyInfo: { - id: companyId, - }, - }, - } = useContext(GlobaledContext) - const [open, setOpen] = useState(false) const [type, setType] = useState('') const [countries, setCountries] = useState([]) @@ -103,6 +100,8 @@ const AddressForm = ({ isDefaultBilling: false, }) + const isB2BUser = !isBCPermission + const { control, handleSubmit, @@ -225,6 +224,7 @@ const AddressForm = ({ if (type === 'add') { await createB2BAddress(params) + snackbar.success('New address is added') } else if (type === 'edit') { const { id, @@ -234,6 +234,8 @@ const AddressForm = ({ ...params, id: +id, }) + + snackbar.success('Edit address success') } setOpen(false) @@ -298,6 +300,7 @@ const AddressForm = ({ if (type === 'add') { await createBcAddress(params) + snackbar.success('New address is added') } else if (type === 'edit') { const { bcAddressId, @@ -307,6 +310,7 @@ const AddressForm = ({ ...params, id: +bcAddressId, }) + snackbar.success('Edit address success') } setOpen(false) @@ -443,7 +447,7 @@ const AddressForm = ({ setValue('state', '') - setAllAddressFields(allAddressFields) + setAllAddressFields([...allAddressFields]) } const handleChangeAddressType = (check: boolean, name: string) => { diff --git a/apps/storefront/src/pages/address/components/AddressItemCard.tsx b/apps/storefront/src/pages/address/components/AddressItemCard.tsx index 5a871a99..6d089bcb 100644 --- a/apps/storefront/src/pages/address/components/AddressItemCard.tsx +++ b/apps/storefront/src/pages/address/components/AddressItemCard.tsx @@ -1,7 +1,3 @@ -import { - useContext, -} from 'react' - import Card from '@mui/material/Card' import CardContent from '@mui/material/CardContent' import Box from '@mui/material/Box' @@ -19,10 +15,6 @@ import { Theme, } from '@mui/material' -import { - GlobaledContext, -} from '@/shared/global' - import { AddressItemType, } from '../../../types/address' @@ -36,6 +28,8 @@ export interface OrderItemCardProps { onEdit: (data: AddressItemType) => void onDelete: (data: AddressItemType) => void onSetDefault: (data: AddressItemType) => void + editPermission: boolean + isBCPermission: boolean } interface TagBoxProps { @@ -70,19 +64,12 @@ export const AddressItemCard = (props: OrderItemCardProps) => { onEdit, onDelete, onSetDefault, + editPermission: hasPermission, + isBCPermission, } = props const theme = useTheme() - const { - state: { - role, - isB2BUser, - }, - } = useContext(GlobaledContext) - - const hasPermission = !isB2BUser || !role || role === 3 - return ( { hasPermission && ( { - isB2BUser && ( + !isBCPermission && (