Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: rest of the errors fixed #31

Merged
merged 1 commit into from
Apr 26, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/components/AdvertsTableRow/AdvertsTableRow.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Fragment, memo, useEffect, useRef, useState } from 'react';
import clsx from 'clsx';
import { useHistory } from 'react-router-dom';
import { TAdvertsTableRowRenderer, TCurrency, TExchangeRate } from 'types';
import { TAdvertiserPaymentMethod, TAdvertsTableRowRenderer, TCurrency, TExchangeRate, TPaymentMethod } from 'types';
import { Badge, BuySellForm, PaymentMethodLabel, StarRating, UserAvatar } from '@/components';
import { ADVERTISER_URL, BUY_SELL } from '@/constants';
import { api } from '@/hooks';
Expand Down Expand Up @@ -50,7 +50,7 @@
target_currencies: [local_currency],
});
}
}, [local_currency]);

Check warning on line 53 in src/components/AdvertsTableRow/AdvertsTableRow.tsx

View workflow job for this annotation

GitHub Actions / build_to_cloudflare_pages

React Hook useEffect has a missing dependency: 'subscribeRates'. Either include it or remove the dependency array

const Container = isMobile ? 'div' : Fragment;

Expand Down Expand Up @@ -180,14 +180,14 @@
<BuySellForm
advert={props}
advertiserBuyLimit={Number(daily_buy_limit) - Number(daily_buy)}
advertiserPaymentMethods={advertiserPaymentMethods}
advertiserPaymentMethods={advertiserPaymentMethods as TAdvertiserPaymentMethod[]}
advertiserSellLimit={Number(daily_sell_limit) - Number(daily_sell)}
balanceAvailable={data?.balance_available ?? 0}
displayEffectiveRate={displayEffectiveRate}
effectiveRate={effectiveRate}
isModalOpen={isModalOpen}
onRequestClose={() => setIsModalOpen(false)}
paymentMethods={paymentMethods}
paymentMethods={paymentMethods as TPaymentMethod[]}
/>
)}
</div>
Expand Down
26 changes: 13 additions & 13 deletions src/components/BuySellForm/BuySellForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import { useEffect, useState } from 'react';
import { Control, Controller, FieldValues, useForm } from 'react-hook-form';
import { useHistory } from 'react-router-dom';
import { TAdvertType, TCurrency, THooks } from 'types';
import { TAdvertType, TCurrency, THooks, TPaymentMethod } from 'types';
import { BUY_SELL, ORDERS_URL, RATE_TYPE, VALID_SYMBOLS_PATTERN } from '@/constants';
import { api } from '@/hooks';
import {
Expand Down Expand Up @@ -98,7 +98,7 @@ const BuySellForm = ({
const shouldDisableField =
!isBuy &&
(parseFloat(balanceAvailable.toString()) === 0 ||
parseFloat(balanceAvailable.toString()) < min_order_amount_limit);
parseFloat(balanceAvailable.toString()) < (min_order_amount_limit ?? 1));

const {
control,
Expand All @@ -118,7 +118,7 @@ const BuySellForm = ({
//TODO: error handling after implementation of exchange rate
const rateValue = rate_type === RATE_TYPE.FIXED ? null : effectiveRate;
const payload: TPayload = {
advert_id: id,
advert_id: id as string,
amount: Number(getValues('amount')),
};
if (rateValue) {
Expand All @@ -138,7 +138,7 @@ const BuySellForm = ({
};

const calculatedRate = removeTrailingZeros(roundOffDecimal(effectiveRate, setDecimalPlaces(effectiveRate, 6)));
const initialAmount = removeTrailingZeros((min_order_amount_limit * Number(calculatedRate)).toString());
const initialAmount = removeTrailingZeros((min_order_amount_limit ?? 1 * Number(calculatedRate)).toString());

const onSelectPaymentMethodCard = (paymentMethodId: number) => {
if (selectedPaymentMethods.includes(paymentMethodId)) {
Expand All @@ -158,7 +158,7 @@ const BuySellForm = ({
return (
<form onSubmit={handleSubmit(onSubmit)}>
<BuySellFormDisplayWrapper
accountCurrency={account_currency}
accountCurrency={account_currency as TCurrency}
isBuy={isBuy}
isModalOpen={isModalOpen}
isValid={isValid}
Expand All @@ -176,26 +176,26 @@ const BuySellForm = ({
</div>
)}
<BuySellData
accountCurrency={account_currency}
accountCurrency={account_currency as TCurrency}
expiryPeriod={order_expiry_period ?? 3600}
instructions={description ?? '-'}
isBuy={isBuy}
localCurrency={local_currency}
name={advertiser_details?.name}
localCurrency={local_currency as TCurrency}
name={advertiser_details?.name ?? ''}
paymentMethodNames={payment_method_names}
paymentMethods={paymentMethods}
rate={displayEffectiveRate}
/>
<LightDivider />
{isBuy && payment_method_names?.length > 0 && (
{isBuy && payment_method_names && payment_method_names?.length > 0 && (
<BuySellPaymentSection
availablePaymentMethods={availablePaymentMethods}
availablePaymentMethods={availablePaymentMethods as TPaymentMethod[]}
onSelectPaymentMethodCard={onSelectPaymentMethodCard}
selectedPaymentMethodIds={selectedPaymentMethods}
/>
)}
<BuySellAmount
accountCurrency={account_currency}
accountCurrency={account_currency as TCurrency}
amount={initialAmount}
calculatedRate={calculatedRate}
control={control as unknown as Control<FieldValues>}
Expand All @@ -206,9 +206,9 @@ const BuySellForm = ({
isBuy,
advertiserBuyLimit,
advertiserSellLimit,
max_order_amount_limit_display
max_order_amount_limit_display ?? '0'
)}
minLimit={min_order_amount_limit_display}
minLimit={min_order_amount_limit_display ?? '0'}
/>
{isBuy && !payment_method_names?.length && (
<Controller
Expand Down
4 changes: 2 additions & 2 deletions src/components/PaymentMethodCard/PaymentMethodCard.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { HTMLAttributes } from 'react';
import clsx from 'clsx';
import { TPaymentMethod } from 'types';
import { TAdvertiserPaymentMethod, TPaymentMethod } from 'types';
import { LabelPairedPlusLgBoldIcon } from '@deriv/quill-icons';
import { Button, Text } from '@deriv-com/ui';
import { PaymentMethodCardBody } from './PaymentMethodCardBody';
Expand All @@ -15,7 +15,7 @@ type TPaymentMethodCardProps = HTMLAttributes<HTMLDivElement> & {
onDeletePaymentMethod?: () => void;
onEditPaymentMethod?: () => void;
onSelectPaymentMethodCard?: (paymentMethodId: number) => void;
paymentMethod: TPaymentMethod & { isAvailable?: boolean };
paymentMethod: (TAdvertiserPaymentMethod | TPaymentMethod) & { isAvailable?: boolean };
selectedPaymentMethodIds?: number[];
shouldShowPaymentMethodDisplayName?: boolean;
};
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { THooks } from 'types';
import { TAccount, TBankName, THooks, TName } from 'types';
import { Text } from '@deriv-com/ui';
import './PaymentMethodCardBody.scss';

type TPaymentMethodCardBodyProps = {
paymentMethod: THooks.AdvertiserPaymentMethods.Get[number];
paymentMethod: THooks.AdvertiserPaymentMethods.Get[number] | THooks.PaymentMethods.Get[number];
shouldShowPaymentMethodDisplayName?: boolean;
};

Expand All @@ -17,8 +17,10 @@ const PaymentMethodCardBody = ({
return (
<div className='payment-method-card__body'>
{isBankOrOther && !shouldShowPaymentMethodDisplayName ? null : <Text size='xs'>{displayName}</Text>}
<Text size='xs'>{paymentMethod.fields?.bank_name?.value ?? paymentMethod.fields?.name?.value}</Text>
<Text size='xs'>{paymentMethod.fields?.account?.value}</Text>
<Text size='xs'>
{(paymentMethod.fields?.bank_name as TBankName)?.value ?? (paymentMethod.fields?.name as TName)?.value}
</Text>
<Text size='xs'>{(paymentMethod.fields?.account as TAccount)?.value}</Text>
</div>
);
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ const mockProps = {
onEditPaymentMethod: jest.fn(),
onSelectPaymentMethodCard: jest.fn(),
paymentMethod: {
display_name: 'bank',
fields: {},
id: 'test',
is_enabled: 0 as 0 | 1,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { TFormState, THooks, TSelectedPaymentMethod } from 'types';
import { TFormState, THooks, TPaymentMethod, TSelectedPaymentMethod } from 'types';
import { Dropdown } from '@/components';
import { Button, Input, Text } from '@deriv-com/ui';
import CloseCircle from '../../../public/ic-close-circle.svg?react';
Expand Down Expand Up @@ -45,6 +45,13 @@ const PaymentMethodFormAutocomplete = ({
/>
);
}

const getValue = () => {
if (selectedPaymentMethod) {
return (selectedPaymentMethod as TPaymentMethod)?.display_name;
}
return '';
};
return (
<>
<Dropdown
Expand All @@ -62,7 +69,7 @@ const PaymentMethodFormAutocomplete = ({
}
}}
// TODO: Remember to translate this
value={selectedPaymentMethod?.display_name ?? ''}
value={getValue()}
variant='comboBox'
/>
<div className='mt-[0.2rem] ml-[1.6rem]'>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@ type THookPayload = Parameters<typeof useP2pAdvertiserList>[number];

//TODO: fix the types when updated from api-hooks
type ExtendedPayload = THookPayload & {
is_blocked?: boolean;
is_blocked?: number;
advertiser_name?: string;
trade_partners: number;
};
/**
* This custom hook returns the available advertisers who have had or currently have trades with the current advertiser.
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/custom-hooks/useSendbird.ts
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@
sendbirdApiRef.current.groupChannel.addGroupChannelHandler(
'P2P_SENDBIRD_GROUP_CHANNEL_HANDLER',
new GroupChannelHandler({
onMessageReceived: (messageReceivedChannel: BaseChannel, _receivedMessage: BaseMessage) =>
onMessageReceived: (_messageReceivedChannel: BaseChannel, _receivedMessage: BaseMessage) =>
setReceivedMessage(_receivedMessage),
})
);
Expand Down Expand Up @@ -278,7 +278,7 @@
} else {
initialiseChat();
}
}, [orderId, orderDetails?.chat_channel_url]);

Check warning on line 281 in src/hooks/custom-hooks/useSendbird.ts

View workflow job for this annotation

GitHub Actions / build_to_cloudflare_pages

React Hook useEffect has missing dependencies: 'createChat' and 'initialiseChat'. Either include them or remove the dependency array

return {
activeChatChannel: chatChannel,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const SortDropdown = ({ list, onSelect, setIsFilterModalOpen, value }: TSortDrop
label='Sort by'
list={list as unknown as MutableOption[]}
name='Sort by'
onSelect={(value: string) => onSelect(value as TSortByValues)}
onSelect={value => onSelect(value as TSortByValues)}
value={value}
/>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,8 +68,8 @@ jest.mock('../../OrderTimeSelection', () => ({
}));
const mockProps = {
currency: 'USD' as TCurrency,
getCurrentStep: () => jest.fn(),
getTotalSteps: () => jest.fn(),
getCurrentStep: jest.fn(() => 1),
getTotalSteps: jest.fn(() => 4),
goToNextStep: jest.fn(),
goToPreviousStep: jest.fn(),
localCurrency: 'IDR' as TCurrency,
Expand Down
4 changes: 2 additions & 2 deletions src/pages/my-ads/components/AdTypeSection/AdTypeSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,12 @@ import { AdFormTextArea } from '../AdFormTextArea';
import './AdTypeSection.scss';

type TAdTypeSectionProps = {
currency: string;
currency: TCurrency;
getCurrentStep: () => number;
getTotalSteps: () => number;
goToNextStep: MouseEventHandler<HTMLButtonElement>;
goToPreviousStep: () => void;
localCurrency?: string;
localCurrency?: TCurrency;
onCancel: () => void;
rateType: string;
};
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { TCurrency } from 'types';
import { render, screen } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import AdTypeSection from '../AdTypeSection';
Expand Down Expand Up @@ -50,12 +51,12 @@ jest.mock('@/hooks', () => ({
}));

const mockProps = {
currency: 'usd',
currency: 'usd' as TCurrency,
getCurrentStep: jest.fn(() => 1),
getTotalSteps: jest.fn(),
goToNextStep: jest.fn(),
goToPreviousStep: jest.fn(),
localCurrency: 'usd',
localCurrency: 'usd' as TCurrency,
onCancel: jest.fn(),
rateType: 'float',
};
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { TCurrency } from 'types';
import { useDevice } from '@deriv-com/ui';
import { render, screen } from '@testing-library/react';
import AdWizard from '../AdWizard';
Expand Down Expand Up @@ -25,10 +26,12 @@ jest.mock('../../AdProgressBar', () => ({
}));

const mockProps = {
currency: 'usd',
localCurrency: 'usd',
currency: 'usd' as TCurrency,
localCurrency: 'usd' as TCurrency,
rateType: 'float',
steps: [{ header: { title: 'step 1' } }, { header: { title: 'step 2' } }, { header: { title: 'step 3' } }],
onCancel: jest.fn(),
countryList: {},
};

describe('AdWizard', () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const BuyPaymentMethodsList = ({ list, onSelectPaymentMethod }: TBuyPaymentMetho
isFullWidth
list={list}
name='payment-method-list'
onSelect={onSelectPaymentMethod}
onSelect={value => onSelectPaymentMethod(value as string)}
placeholder='Add'
value=''
variant='prompt'
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { TPaymentMethod } from 'types';
import { TAdvertiserPaymentMethod } from 'types';
import { PaymentMethodCard } from '@/components';
import { api } from '@/hooks';
import { useIsAdvertiser } from '@/hooks/custom-hooks';
Expand All @@ -16,7 +16,7 @@ const SellAdPaymentSelection = ({ onSelectPaymentMethod, selectedPaymentMethodId

return (
<div className='sell-ad-payment-selection__card'>
{advertiserPaymentMethods?.map((paymentMethod: TPaymentMethod) => {
{advertiserPaymentMethods?.map((paymentMethod: TAdvertiserPaymentMethod) => {
const isDisabled =
selectedPaymentMethodIds.length >= 3 &&
!selectedPaymentMethodIds.includes(Number(paymentMethod.id));
Expand Down
9 changes: 5 additions & 4 deletions src/pages/my-ads/screens/CreateEditAd/CreateEditAd.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -183,9 +183,10 @@ const CreateEditAd = () => {
setValue('payment-method', Object.keys(advertInfo.payment_method_details ?? {}).map(Number));
} else {
const paymentMethodNames = advertInfo?.payment_method_names;
const paymentMethodKeys = paymentMethodNames?.map(
name => paymentMethodList.find(method => method.display_name === name)?.id
);
const paymentMethodKeys =
paymentMethodNames?.map(
name => paymentMethodList.find(method => method.display_name === name)?.id
) ?? [];
setValue('payment-method', paymentMethodKeys);
}
},
Expand All @@ -212,7 +213,7 @@ const CreateEditAd = () => {
<FormProvider {...methods}>
<form onSubmit={handleSubmit(onSubmit)}>
<AdWizard
countryList={countryList as object}
countryList={countryList as TCountryListItem}
currency={activeAccount?.currency as TCurrency}
localCurrency={p2pSettings?.localCurrency as TCurrency}
onCancel={onClickCancel}
Expand Down
3 changes: 2 additions & 1 deletion src/pages/my-ads/screens/MyAds/MyAdsTable/MyAdsTable.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { memo } from 'react';
import { NonUndefined } from 'react-hook-form';
import { THooks } from 'types';
import { Table } from '@/components';
import { api } from '@/hooks';
Expand All @@ -9,7 +10,7 @@ import MyAdsTableRowView from '../MyAdsTableRow/MyAdsTableRowView';
import MyAdsDisplayWrapper from './MyAdsDisplayWrapper';
import './MyAdsTable.scss';

export type TMyAdsTableRowRendererProps = Required<THooks.AdvertiserAdverts.Get>[0] & {
export type TMyAdsTableRowRendererProps = NonUndefined<THooks.AdvertiserAdverts.Get>[0] & {
balanceAvailable: number;
dailyBuyLimit: string;
dailySellLimit: string;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ import { PaymentMethodsList } from './PaymentMethodsList';
* **/
const PaymentMethods = () => {
const isAdvertiser = useIsAdvertiser();
const { data: p2pAdvertiserPaymentMethods, isLoading } = api.advertiserPaymentMethods.useGet(isAdvertiser);
const { data: p2pAdvertiserPaymentMethods, isPending: isLoading } =
api.advertiserPaymentMethods.useGet(isAdvertiser);
const [formState, dispatch] = useReducer(advertiserPaymentMethodsReducer, {});

const handleAddPaymentMethod = (selectedPaymentMethod?: TSelectedPaymentMethod) => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ type TPaymentMethodsListProps = {
onDelete: (selectedPaymentMethod?: TSelectedPaymentMethod) => void;
onEdit: (selectedPaymentMethod?: TSelectedPaymentMethod) => void;
onResetFormState: () => void;
p2pAdvertiserPaymentMethods: THooks.AdvertiserPaymentMethods.Get;
p2pAdvertiserPaymentMethods?: THooks.AdvertiserPaymentMethods.Get;
};

/**
Expand Down
Loading
Loading