diff --git a/package-lock.json b/package-lock.json index 52b20280..055922d2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,7 @@ "name": "p2p", "version": "0.0.0", "dependencies": { - "@deriv-com/api-hooks": "^0.1.13", + "@deriv-com/api-hooks": "^0.1.15", "@deriv-com/ui": "latest", "@deriv-com/utils": "latest", "@deriv/deriv-api": "^1.0.15", @@ -1620,9 +1620,9 @@ } }, "node_modules/@deriv-com/api-hooks": { - "version": "0.1.13", - "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-0.1.13.tgz", - "integrity": "sha512-GtXI+xTL3c62kUtpbt3uaQ3WS0yUGpXStohcc/Yyn28oZGScDYPY7b9gCBN2+shY9HE8ReqR9AxccV4t3YfFwA==", + "version": "0.1.15", + "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-0.1.15.tgz", + "integrity": "sha512-ZErwEix6R2Yhfyu2HhhNEmf9UIgtfHl+nKt3ukE3GHUtqtv/n1AZhUXo9umRcqzFLrUhKhdsWCqGTKG0/zsoDQ==", "dependencies": { "@deriv-com/utils": "^0.0.11", "@deriv/api-types": "^1.0.177", @@ -19900,9 +19900,9 @@ } }, "@deriv-com/api-hooks": { - "version": "0.1.13", - "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-0.1.13.tgz", - "integrity": "sha512-GtXI+xTL3c62kUtpbt3uaQ3WS0yUGpXStohcc/Yyn28oZGScDYPY7b9gCBN2+shY9HE8ReqR9AxccV4t3YfFwA==", + "version": "0.1.15", + "resolved": "https://registry.npmjs.org/@deriv-com/api-hooks/-/api-hooks-0.1.15.tgz", + "integrity": "sha512-ZErwEix6R2Yhfyu2HhhNEmf9UIgtfHl+nKt3ukE3GHUtqtv/n1AZhUXo9umRcqzFLrUhKhdsWCqGTKG0/zsoDQ==", "requires": { "@deriv-com/utils": "^0.0.11", "@deriv/api-types": "^1.0.177", diff --git a/package.json b/package.json index 2fff4c78..c260dba3 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "scripts": { "dev": "vite", "build": "vite build", + "build:dev": "tsc && vite build", "fix": "eslint \"./src/**/*.?(js|jsx|ts|tsx)\" --fix", "preview": "vite preview", "test:lint": "prettier --log-level silent --write . && eslint \"./src/**/*.?(js|jsx|ts|tsx)\"", @@ -14,7 +15,7 @@ "prepare": "husky install" }, "dependencies": { - "@deriv-com/api-hooks": "^0.1.13", + "@deriv-com/api-hooks": "^0.1.15", "@deriv-com/ui": "latest", "@deriv-com/utils": "latest", "@deriv/deriv-api": "^1.0.15", diff --git a/src/__mocks__/mock-data.ts b/src/__mocks__/mock-data.ts new file mode 100644 index 00000000..d44f6244 --- /dev/null +++ b/src/__mocks__/mock-data.ts @@ -0,0 +1,95 @@ +import { TAdvertType, TType01 } from 'types'; + +export const mockAdvertValues = { + account_currency: 'USD', + advertiser_details: { + completed_orders_count: 0, + id: '96', + is_blocked: 0 as TType01, + is_favourite: 0 as TType01, + is_online: 1 as TType01, + is_recommended: 0 as TType01, + last_online_time: 1714031576, + loginid: 'CR90000533', + name: 'client CR90000533', + rating_average: null, + rating_count: 0, + recommended_average: null, + recommended_count: null, + total_completion_rate: null, + has_not_been_recommended: true, + }, + block_trade: 0 as TType01, + counterparty_type: 'buy' as 'buy' | 'sell', + country: 'id', + created_time: 1714017654, + description: 'Created by script. Please call me 02203400', + effective_rate: 16183.8, + effective_rate_display: '16183.80', + eligibility_status: ['join_date' as 'join_date' | 'country' | 'completion_rate' | 'rating_average'], + eligible_countries: ['af', 'al'], + id: '236', + is_active: true, + is_buy: true, + is_sell: false, + is_block_trade: false, + is_deleted: false, + active_orders: 2, + amount: 10, + amount_display: '10', + contact_info: '02203400', + days_until_archive: 4, + is_eligible: 0 as TType01, + is_visible: true, + local_currency: 'IDR', + max_order_amount_limit: 50, + max_order_amount_limit_display: '50.00', + min_join_days: 15, + min_order_amount_limit: 1, + min_order_amount_limit_display: '1.00', + order_expiry_period: 3600, + payment_method: '', + payment_method_names: ['Alipay'], + price: 16183.8, + price_display: '16183.80', + rate: -0.1, + rate_display: '-0.10', + rate_type: 'float' as 'float' | 'fixed', + type: 'sell' as 'sell' | 'buy', + is_floating: true, + deleted: 1 as const, + max_order_amount: 50, + max_order_amount_display: '50.00', + min_completion_rate: 0, + min_order_amount: 5, + min_order_amount_display: '5.00', + min_rating: 0, + payment_info: 'Your bank details', + payment_method_details: { + '1': { + display_name: 'Alipay', + fields: { + account: { + display_name: 'Alipay ID', + required: 1, + type: 'text' as 'text' | 'memo', + value: '12345', + }, + instructions: { + display_name: 'Instructions', + required: 0, + type: 'memo' as 'text' | 'memo', + value: 'Alipay instructions', + }, + }, + is_enabled: 1 as TType01, + method: 'alipay', + type: 'ewallet' as 'ewallet' | 'other' | 'bank', + used_by_adverts: ['1'], + used_by_orders: ['1'], + }, + }, + remaining_amount: 10, + remaining_amount_display: '10', + visibility_status: ['advertiser_temp_ban'] as TAdvertType['visibility_status'], +}; diff --git a/src/components/BuySellForm/BuySellPaymentSection/__tests__/BuySellPaymentSection.spec.tsx b/src/components/BuySellForm/BuySellPaymentSection/__tests__/BuySellPaymentSection.spec.tsx index 98bdd778..42fc550a 100644 --- a/src/components/BuySellForm/BuySellPaymentSection/__tests__/BuySellPaymentSection.spec.tsx +++ b/src/components/BuySellForm/BuySellPaymentSection/__tests__/BuySellPaymentSection.spec.tsx @@ -1,7 +1,10 @@ +import { TWalletType } from 'types'; import { render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import BuySellPaymentSection from '../BuySellPaymentSection'; +type TType = 'text' | 'memo'; + const mockProps = { availablePaymentMethods: [], onSelectPaymentMethodCard: jest.fn(), @@ -14,22 +17,22 @@ const mockAvailablePaymentMethods = { account: { display_name: 'Account ID / phone number / email', required: 0, - type: 'text', + type: 'text' as TType, }, instructions: { display_name: 'Instructions', required: 0, - type: 'memo', + type: 'memo' as TType, }, name: { display_name: 'Payment method name', required: 1, - type: 'text', + type: 'text' as TType, }, }, id: '67', isAvailable: true, - type: 'other', + type: 'other' as TWalletType, }; jest.mock('@deriv-com/ui', () => ({ ...jest.requireActual('@deriv-com/ui'), diff --git a/src/components/BuySellForm/__tests__/BuySellForm.spec.tsx b/src/components/BuySellForm/__tests__/BuySellForm.spec.tsx index 350eea54..12f17aa9 100644 --- a/src/components/BuySellForm/__tests__/BuySellForm.spec.tsx +++ b/src/components/BuySellForm/__tests__/BuySellForm.spec.tsx @@ -1,3 +1,4 @@ +import { mockAdvertValues } from '@/__mocks__/mock-data'; import { floatingPointValidator } from '@/utils'; import { useDevice } from '@deriv-com/ui'; import { render, screen } from '@testing-library/react'; @@ -56,26 +57,8 @@ jest.mock('@/utils', () => ({ })); const mockFloatingPointValidator = floatingPointValidator as jest.Mock; -const mockAdvertValues = { - account_currency: 'USD', - advertiser_details: { - name: 'name', - rating_average: 5, - rating_count: 5, - }, - description: 'description', - id: 'id', - is_buy: true, - local_currency: 'USD', - max_order_amount_limit_display: '1000', - min_order_amount_limit: 1, - min_order_amount_limit_display: '1', - order_expiry_period: 30, - payment_method_names: ['alipay'], - rate: 1, - rate_type: 'fixed', - type: 'sell', -}; +type TNumber = 0 | 1; + const mockProps = { advert: mockAdvertValues, advertiserBuyLimit: 1000, @@ -83,6 +66,25 @@ const mockProps = { { display_name: 'alipay', id: '1', + fields: { + account: { + display_name: 'Alipay ID', + required: 1, + type: 'text' as 'text' | 'memo', + value: '12345', + }, + instructions: { + display_name: 'Instructions', + required: 0, + type: 'memo' as 'text' | 'memo', + value: 'Alipay instructions', + }, + }, + is_enabled: 1 as TNumber, + method: 'alipay', + type: 'ewallet' as 'ewallet' | 'other' | 'bank', + used_by_adverts: ['1'], + used_by_orders: ['1'], }, ], advertiserSellLimit: 1000, @@ -94,7 +96,22 @@ const mockProps = { paymentMethods: [ { display_name: 'alipay', - type: 'online', + id: '1', + fields: { + account: { + display_name: 'Alipay ID', + required: 1, + type: 'text' as 'text' | 'memo', + value: '12345', + }, + instructions: { + display_name: 'Instructions', + required: 0, + type: 'memo' as 'text' | 'memo', + value: 'Alipay instructions', + }, + }, + type: 'ewallet' as 'ewallet' | 'other' | 'bank', }, ], }; diff --git a/src/components/Modals/OrderDetailsComplainModal/OrderDetailsComplainModal.tsx b/src/components/Modals/OrderDetailsComplainModal/OrderDetailsComplainModal.tsx index 4b22cdec..54e2e51a 100644 --- a/src/components/Modals/OrderDetailsComplainModal/OrderDetailsComplainModal.tsx +++ b/src/components/Modals/OrderDetailsComplainModal/OrderDetailsComplainModal.tsx @@ -1,4 +1,5 @@ import { useEffect, useState } from 'react'; +import { THooks } from 'types'; import { FullPageMobileWrapper } from '@/components/FullPageMobileWrapper'; import { api } from '@/hooks'; import { Button, Modal, Text, useDevice } from '@deriv-com/ui'; @@ -18,6 +19,7 @@ type TComplainFooterProps = { onRequestClose: () => void; }; +type TDisputeReason = Parameters[0]['dispute_reason']; const ComplainExplanation = () => { const { isMobile } = useDevice(); const textSize = isMobile ? 'sm' : 'xs'; @@ -73,7 +75,7 @@ const OrderDetailsComplainModal = ({ const disputeOrderRequest = () => { mutate({ - dispute_reason: disputeReason, + dispute_reason: disputeReason as TDisputeReason, id, }); }; diff --git a/src/components/PaymentMethodCard/__tests__/PaymentMethodCard.spec.tsx b/src/components/PaymentMethodCard/__tests__/PaymentMethodCard.spec.tsx index c3a6bb63..03056037 100644 --- a/src/components/PaymentMethodCard/__tests__/PaymentMethodCard.spec.tsx +++ b/src/components/PaymentMethodCard/__tests__/PaymentMethodCard.spec.tsx @@ -1,3 +1,4 @@ +import { TWalletType } from 'types'; import { render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import PaymentMethodCard from '../PaymentMethodCard'; @@ -12,9 +13,9 @@ const mockProps = { paymentMethod: { fields: {}, id: 'test', - is_enabled: 0, + is_enabled: 0 as 0 | 1, method: '', - type: 'other', + type: 'other' as TWalletType, used_by_adverts: null, used_by_orders: null, }, diff --git a/src/hooks/__tests__/usePoiPoaStatus.spec.tsx b/src/hooks/__tests__/usePoiPoaStatus.spec.tsx index 5b3c8379..33d13466 100644 --- a/src/hooks/__tests__/usePoiPoaStatus.spec.tsx +++ b/src/hooks/__tests__/usePoiPoaStatus.spec.tsx @@ -45,7 +45,7 @@ describe('usePoiPoaStatus', () => { identity: { status: 'verified', }, - needs_verification: false, + needs_verification: [], }, p2p_poa_required: 0, }, diff --git a/src/hooks/api/advertiser/p2p-advertiser/useAdvertiserCreate.ts b/src/hooks/api/advertiser/p2p-advertiser/useAdvertiserCreate.ts index 0aeb19b8..d84d6de7 100644 --- a/src/hooks/api/advertiser/p2p-advertiser/useAdvertiserCreate.ts +++ b/src/hooks/api/advertiser/p2p-advertiser/useAdvertiserCreate.ts @@ -1,8 +1,8 @@ import { useCallback, useMemo } from 'react'; import { useP2PAdvertiserCreate } from '@deriv-com/api-hooks'; +import useInvalidateQuery from '../../useInvalidateQuery'; -//TODO: fix the file after updating with api-hooks -type TCreateAdvertisePayload = string; +type TCreateAdvertiserPayload = Parameters['mutate']>[0]; /** A custom hook that creates a P2P advertiser. This can only be used when the user is authorized. * @@ -16,22 +16,19 @@ type TCreateAdvertisePayload = string; * */ const useAdvertiserCreate = () => { - // const invalidate = useInvalidateQuery(); + const invalidate = useInvalidateQuery(); const { data, - // mutate: _mutate, + mutate: _mutate, ...rest } = useP2PAdvertiserCreate({ - // onSuccess: () => { - // invalidate('p2p_advertiser_info'); - // }, + onSuccess: () => { + invalidate('p2p_advertiser_info'); + }, }); - // eslint-disable-next-line no-underscore-dangle, no-console, react-hooks/exhaustive-deps - const _mutate = (payload: TCreateAdvertisePayload) => console.log(payload); - const mutate = useCallback( - (payload: TCreateAdvertisePayload) => { + (payload: TCreateAdvertiserPayload) => { _mutate(payload); }, [_mutate] diff --git a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelations.ts b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelations.ts index 97c0a4f8..d58d54cf 100644 --- a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelations.ts +++ b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelations.ts @@ -1,10 +1,10 @@ -import { useP2pAdvertiserRelations } from '@deriv-com/api-hooks'; +import { useP2PAdvertiserRelations } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; /** This hook returns favourite and blocked advertisers and the mutation function to update the block list of the current user. */ const useAdvertiserRelations = () => { const invalidate = useInvalidateQuery(); - const { data, mutate, ...mutate_rest } = useP2pAdvertiserRelations({ + const { data, mutate, ...mutate_rest } = useP2PAdvertiserRelations({ onSuccess: () => { invalidate('p2p_advertiser_relations'); invalidate('p2p_advertiser_list'); diff --git a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsAddBlocked.ts b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsAddBlocked.ts index 46db9290..ac1199ae 100644 --- a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsAddBlocked.ts +++ b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsAddBlocked.ts @@ -5,7 +5,7 @@ import useAdvertiserRelations from './useAdvertiserRelations'; const useAdvertiserRelationsAddBlocked = () => { const { mutate, data, ...rest } = useAdvertiserRelations(); - const addBlockedAdvertiser = useCallback((id: number[]) => mutate({ payload: { add_blocked: id } }), [mutate]); + const addBlockedAdvertiser = useCallback((id: number[]) => mutate({ add_blocked: id }), [mutate]); return { data, diff --git a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsRemoveBlocked.ts b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsRemoveBlocked.ts index eabdd851..170c196f 100644 --- a/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsRemoveBlocked.ts +++ b/src/hooks/api/counterparty/p2p-advertiser-relations/useAdvertiserRelationsRemoveBlocked.ts @@ -5,10 +5,7 @@ import useAdvertiserRelations from './useAdvertiserRelations'; const useAdvertiserRelationsRemoveBlocked = () => { const { mutate, data, ...rest } = useAdvertiserRelations(); - const removeBlockedAdvertiser = useCallback( - (id: number[]) => mutate({ payload: { remove_blocked: id } }), - [mutate] - ); + const removeBlockedAdvertiser = useCallback((id: number[]) => mutate({ remove_blocked: id }), [mutate]); return { data, diff --git a/src/hooks/api/order-dispute/p2p-order-dispute/useOrderDispute.ts b/src/hooks/api/order-dispute/p2p-order-dispute/useOrderDispute.ts index b3ca7b85..35dac94c 100644 --- a/src/hooks/api/order-dispute/p2p-order-dispute/useOrderDispute.ts +++ b/src/hooks/api/order-dispute/p2p-order-dispute/useOrderDispute.ts @@ -2,7 +2,7 @@ import { useCallback, useMemo } from 'react'; import { useP2pOrderDispute } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; -type TOrderDisputePayload = NonNullable['mutate']>>[0]['payload']; +type TOrderDisputePayload = Parameters['mutate']>[number]; /** A custom hook that disputes a P2P order. * @@ -28,13 +28,13 @@ const useOrderDispute = () => { const mutate = useCallback( (payload: TOrderDisputePayload) => { - _mutate({ payload }); + _mutate(payload); }, [_mutate] ); const modified_data = useMemo(() => { - const p2p_order_dispute = data?.p2p_order_dispute; + const p2p_order_dispute = data; if (!p2p_order_dispute) return undefined; diff --git a/src/hooks/api/order-review/p2p-order-review/useOrderReview.ts b/src/hooks/api/order-review/p2p-order-review/useOrderReview.ts index 0635d2dd..41c57afe 100644 --- a/src/hooks/api/order-review/p2p-order-review/useOrderReview.ts +++ b/src/hooks/api/order-review/p2p-order-review/useOrderReview.ts @@ -1,8 +1,8 @@ import { useCallback, useMemo } from 'react'; -import { useP2pOrderReview } from '@deriv-com/api-hooks'; +import { useP2POrderReview } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; -type TOrderReviewPayload = NonNullable['mutate']>>[0]['payload']; +type TOrderReviewPayload = NonNullable['mutate']>>[0]; /** A custom hook that creates a review for a specified order * @@ -21,7 +21,7 @@ const useOrderReview = () => { data, mutate: _mutate, ...rest - } = useP2pOrderReview({ + } = useP2POrderReview({ onSuccess: () => { invalidate('p2p_order_list'); }, @@ -29,7 +29,7 @@ const useOrderReview = () => { const mutate = useCallback( (payload: TOrderReviewPayload) => { - _mutate({ payload }); + _mutate(payload); }, [_mutate] ); diff --git a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useAdvertiserPaymentMethods.ts b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useAdvertiserPaymentMethods.ts index b0876145..4665636a 100644 --- a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useAdvertiserPaymentMethods.ts +++ b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useAdvertiserPaymentMethods.ts @@ -1,10 +1,10 @@ import { useMemo } from 'react'; -import { useP2pAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; +import { useP2PAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; /** A custom hook that returns the list of P2P Advertiser Payment Methods */ const useAdvertiserPaymentMethods = (is_enabled = true) => { - const { data, ...rest } = useP2pAdvertiserPaymentMethods({ - options: { enabled: is_enabled }, + const { data, ...rest } = useP2PAdvertiserPaymentMethods({ + enabled: is_enabled, }); // Modify the response to add additional information diff --git a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useCreateAdvertiserPaymentMethods.ts b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useCreateAdvertiserPaymentMethods.ts index c065f263..4e5eb5c6 100644 --- a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useCreateAdvertiserPaymentMethods.ts +++ b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useCreateAdvertiserPaymentMethods.ts @@ -1,20 +1,18 @@ import { useCallback } from 'react'; -import { useP2pAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; +import { useP2PAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; -type TPayloads = NonNullable< - NonNullable['mutate']>[0]>['payload'] ->; -type TCreatePayload = NonNullable[0]; +type TPayloads = Parameters['mutate']>; +type TCreatePayload = TPayloads[number]['create']; /** A custom hook that sends a request to create a new p2p advertiser payment method. */ const useCreateAdvertiserPaymentMethods = () => { const invalidate = useInvalidateQuery(); - const { data, mutate, ...rest } = useP2pAdvertiserPaymentMethods({ + const { data, mutate, ...rest } = useP2PAdvertiserPaymentMethods({ onSuccess: () => invalidate('p2p_advertiser_payment_methods'), }); - const create = useCallback((values: TCreatePayload) => mutate({ payload: { create: [{ ...values }] } }), [mutate]); + const create = useCallback((values: TCreatePayload) => mutate({ create: [{ ...values }] }), [mutate]); return { data, diff --git a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useDeleteAdvertiserPaymentMethods.ts b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useDeleteAdvertiserPaymentMethods.ts index 4cf180da..215cf868 100644 --- a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useDeleteAdvertiserPaymentMethods.ts +++ b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useDeleteAdvertiserPaymentMethods.ts @@ -1,14 +1,14 @@ import { useCallback } from 'react'; -import { useP2pAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; +import { useP2PAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; /** A custom hook that sends a request to delete an existing p2p advertiser payment method. */ const useDeleteAdvertiserPaymentMethods = () => { const invalidate = useInvalidateQuery(); - const { data, mutate, ...rest } = useP2pAdvertiserPaymentMethods({ + const { data, mutate, ...rest } = useP2PAdvertiserPaymentMethods({ onSuccess: () => invalidate('p2p_advertiser_payment_methods'), }); - const deletePaymentMethod = useCallback((id: number) => mutate({ payload: { delete: [id] } }), [mutate]); + const deletePaymentMethod = useCallback((id: number) => mutate({ delete: [id] }), [mutate]); return { data, diff --git a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useUpdateAdvertiserPaymentMethods.ts b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useUpdateAdvertiserPaymentMethods.ts index ef7ee959..88faf55b 100644 --- a/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useUpdateAdvertiserPaymentMethods.ts +++ b/src/hooks/api/payment-method/p2p-advertiser-payment-methods/useUpdateAdvertiserPaymentMethods.ts @@ -1,21 +1,19 @@ import { useCallback } from 'react'; -import { useP2pAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; +import { useP2PAdvertiserPaymentMethods } from '@deriv-com/api-hooks'; import useInvalidateQuery from '../../useInvalidateQuery'; -type TPayloads = NonNullable< - NonNullable['mutate']>[0]>['payload'] ->; -type TUpdatePayload = NonNullable[0]; +type TPayloads = Parameters['mutate']>; +type TUpdatePayload = TPayloads[number]['update']; /** A custom hook that sends a request to update an existing p2p advertiser payment method. */ const useUpdateAdvertiserPaymentMethods = () => { const invalidate = useInvalidateQuery(); - const { data, mutate, ...rest } = useP2pAdvertiserPaymentMethods({ + const { data, mutate, ...rest } = useP2PAdvertiserPaymentMethods({ onSuccess: () => invalidate('p2p_advertiser_payment_methods'), }); const update = useCallback( - (id: string, values: TUpdatePayload) => mutate({ payload: { update: { [id]: { ...values } } } }), + (id: string, values: TUpdatePayload) => mutate({ update: { [id]: { ...values } } }), [mutate] ); diff --git a/src/hooks/api/payment-method/p2p-payment-methods/usePaymentMethods.ts b/src/hooks/api/payment-method/p2p-payment-methods/usePaymentMethods.ts index 4159fa66..3e29b21c 100644 --- a/src/hooks/api/payment-method/p2p-payment-methods/usePaymentMethods.ts +++ b/src/hooks/api/payment-method/p2p-payment-methods/usePaymentMethods.ts @@ -1,19 +1,20 @@ import { useMemo } from 'react'; -import { useAuthData, usePaymentMethods as useAvailablePaymentMethods } from '@deriv-com/api-hooks'; +import { useP2pPaymentMethods } from '@deriv-com/api-hooks'; /** A custom hook that returns a list of P2P available payment methods **/ const usePaymentMethods = (enabled = true) => { - const { isAuthorized: isSuccess } = useAuthData(); - const { data, ...rest } = useAvailablePaymentMethods({ - options: { enabled: isSuccess && enabled, refetchOnWindowFocus: false }, + const { data, ...rest } = useP2pPaymentMethods({ + enabled, + refetchOnWindowFocus: false, }); + // Modify the data to add additional information. const modified_data = useMemo(() => { const p2p_payment_methods = data; if (!p2p_payment_methods) return undefined; - return Object.keys(p2p_payment_methods).map(key => { + return Object.keys(p2p_payment_methods).map((key: string) => { const payment_method = p2p_payment_methods[key]; return { ...payment_method, diff --git a/src/hooks/api/useInvalidateQuery.ts b/src/hooks/api/useInvalidateQuery.ts index b2568de0..7d5ae143 100644 --- a/src/hooks/api/useInvalidateQuery.ts +++ b/src/hooks/api/useInvalidateQuery.ts @@ -8,7 +8,7 @@ const useInvalidateQuery = () => { const invalidate = useCallback( (name: T | T[], options?: TOptions) => { - return queryClient.invalidateQueries(Array.isArray(name) ? name : [name], options); + return queryClient.invalidateQueries({ queryKey: [name], ...options }); }, [queryClient] ); diff --git a/src/hooks/custom-hooks/useIsAdvertiser.ts b/src/hooks/custom-hooks/useIsAdvertiser.ts index c2b1ce2e..cfd49ef8 100644 --- a/src/hooks/custom-hooks/useIsAdvertiser.ts +++ b/src/hooks/custom-hooks/useIsAdvertiser.ts @@ -12,7 +12,7 @@ const useIsAdvertiser = (): boolean => { const [isAdvertiser, setIsAdvertiser] = useState(!error && !isEmptyObject(data)); useEffect(() => { - if (error && error.code === ERROR_CODES.ADVERTISER_NOT_FOUND) { + if (error && error?.error.code === ERROR_CODES.ADVERTISER_NOT_FOUND) { setIsAdvertiser(false); } else if (!error && !isEmptyObject(data)) { setIsAdvertiser(true); diff --git a/src/hooks/custom-hooks/useSendbird.ts b/src/hooks/custom-hooks/useSendbird.ts index 06d3c3c9..b0e654dd 100644 --- a/src/hooks/custom-hooks/useSendbird.ts +++ b/src/hooks/custom-hooks/useSendbird.ts @@ -8,15 +8,15 @@ import { api } from '..'; /** * The function renames the files by removing any non ISO-8859-1 code point from filename and returns a new blob object with the updated file name. - * @returns {Blob} + * @returns {File} */ export const renameFile = (file: File) => { - const newFile = new Blob([file], { type: file.type }); - newFile.name = file.name + const { name, type } = file; + const newName = name .split('') .filter(char => char.charCodeAt(0) >= 32 && char.charCodeAt(0) <= 126) .join(''); - return newFile; + return new File([file], newName, { type }); }; const ChatMessageStatus = { diff --git a/src/pages/buy-sell/components/SortDropdown/SortDropdown.tsx b/src/pages/buy-sell/components/SortDropdown/SortDropdown.tsx index 15fbd8df..e209bb56 100644 --- a/src/pages/buy-sell/components/SortDropdown/SortDropdown.tsx +++ b/src/pages/buy-sell/components/SortDropdown/SortDropdown.tsx @@ -1,3 +1,4 @@ +import { MutableOption } from 'types'; import { TSortByValues } from '@/utils'; import { LabelPairedChevronDownMdRegularIcon } from '@deriv/quill-icons'; import { Button, Dropdown, useDevice } from '@deriv-com/ui'; @@ -31,7 +32,7 @@ const SortDropdown = ({ list, onSelect, setIsFilterModalOpen, value }: TSortDrop } label='Sort by' - list={list} + list={list as unknown as MutableOption[]} name='Sort by' onSelect={(value: string) => onSelect(value as TSortByValues)} value={value} diff --git a/src/pages/my-ads/components/AdConditionsSection/AdConditionsSection.tsx b/src/pages/my-ads/components/AdConditionsSection/AdConditionsSection.tsx index 0c4bf4d2..6880cd0b 100644 --- a/src/pages/my-ads/components/AdConditionsSection/AdConditionsSection.tsx +++ b/src/pages/my-ads/components/AdConditionsSection/AdConditionsSection.tsx @@ -1,6 +1,6 @@ import { MouseEventHandler } from 'react'; import { useFormContext } from 'react-hook-form'; -import { TCountryListItem } from 'types'; +import { TCountryListItem, TCurrency } from 'types'; import { AD_CONDITION_TYPES } from '@/constants'; import { Text, useDevice } from '@deriv-com/ui'; import { AdConditionBlockSelector } from '../AdConditionBlockSelector'; @@ -10,12 +10,12 @@ import { PreferredCountriesSelector } from '../PreferredCountriesSelector'; type TAdConditionsSection = { countryList: TCountryListItem; - currency: string; + currency: TCurrency; getCurrentStep: () => number; getTotalSteps: () => number; goToNextStep: MouseEventHandler; goToPreviousStep: MouseEventHandler; - localCurrency?: string; + localCurrency?: TCurrency; rateType: string; }; @@ -43,7 +43,7 @@ const AdConditionsSection = ({ countryList, currency, localCurrency, rateType, .
({ ...jest.requireActual('react-hook-form'), useFormContext: () => ({ formState: { errors: {}, isValid: true }, - getValues: (name: string) => mockGetValues[name], + getValues: (name: keyof typeof mockGetValues) => mockGetValues[name], setValue: mockFn, }), })); @@ -66,12 +67,12 @@ jest.mock('../../OrderTimeSelection', () => ({ OrderTimeSelection: () =>
OrderTimeSelection
, })); const mockProps = { - currency: 'USD', + currency: 'USD' as TCurrency, getCurrentStep: () => jest.fn(), getTotalSteps: () => jest.fn(), goToNextStep: jest.fn(), goToPreviousStep: jest.fn(), - localCurrency: 'IDR', + localCurrency: 'IDR' as TCurrency, rateType: 'fixed', }; diff --git a/src/pages/my-ads/components/AdSummary/__tests__/AdSummary.spec.tsx b/src/pages/my-ads/components/AdSummary/__tests__/AdSummary.spec.tsx index f55a80d2..38b20d67 100644 --- a/src/pages/my-ads/components/AdSummary/__tests__/AdSummary.spec.tsx +++ b/src/pages/my-ads/components/AdSummary/__tests__/AdSummary.spec.tsx @@ -4,7 +4,7 @@ import AdSummary from '../AdSummary'; const mockProps = { currency: 'USD' as TCurrency, - localCurrency: 'IDR', + localCurrency: 'IDR' as TCurrency, offerAmount: '', priceRate: 0, rateType: 'fixed', diff --git a/src/pages/my-ads/components/AdTypeSection/AdTypeSection.tsx b/src/pages/my-ads/components/AdTypeSection/AdTypeSection.tsx index a5c61f80..1bc3ed7b 100644 --- a/src/pages/my-ads/components/AdTypeSection/AdTypeSection.tsx +++ b/src/pages/my-ads/components/AdTypeSection/AdTypeSection.tsx @@ -1,5 +1,6 @@ import { MouseEventHandler } from 'react'; import { Controller, useFormContext } from 'react-hook-form'; +import { TCurrency } from 'types'; import { FloatingRate, RadioGroup } from '@/components'; import { BUY_SELL, RATE_TYPE } from '@/constants'; import { useQueryString } from '@/hooks/custom-hooks'; @@ -113,7 +114,7 @@ const AdTypeSection = ({ currency, localCurrency, onCancel, rateType, ...props } changeHandler={e => restrictDecimalPlace(e, onChange)} errorMessages={error?.message ?? ''} fiatCurrency={currency} - localCurrency={localCurrency ?? ''} + localCurrency={localCurrency as TCurrency} onChange={onChange} value={value} /> diff --git a/src/pages/my-ads/components/BuyAdPaymentSelection/BuyAdPaymentSelection.tsx b/src/pages/my-ads/components/BuyAdPaymentSelection/BuyAdPaymentSelection.tsx index 178620ba..de7fdb01 100644 --- a/src/pages/my-ads/components/BuyAdPaymentSelection/BuyAdPaymentSelection.tsx +++ b/src/pages/my-ads/components/BuyAdPaymentSelection/BuyAdPaymentSelection.tsx @@ -13,7 +13,7 @@ type TBuyAdPaymentSelectionProps = { const BuyAdPaymentSelection = ({ onSelectPaymentMethod, selectedPaymentMethods }: TBuyAdPaymentSelectionProps) => { // Enabled for payment method modal - const { data: paymentMethodList } = api.paymentMethods.useGet(false); + const { data: paymentMethodList = [] } = api.paymentMethods.useGet(false); const list = ( paymentMethodList?.map(paymentMethod => ({ text: paymentMethod.display_name, @@ -29,7 +29,7 @@ const BuyAdPaymentSelection = ({ onSelectPaymentMethod, selectedPaymentMethods } const { display_name: name, type } = paymentMethodObjects[method] ?? {}; return (
- +