From 5eded0e25dccc5e80f8c4f064c7f10e417d0692a Mon Sep 17 00:00:00 2001 From: skrushna1506 Date: Tue, 17 Dec 2024 15:40:29 +0530 Subject: [PATCH] fix(open-spark): trade api route changes and other cosmetic changes 1. change trade api, now we are sending id to current trade status 2. on my trade page added pending icon logic 3. on dashboard , added pending icon logic to current trade --- .../components/energyPurchaseForm/index.tsx | 11 ++++- apps/open-spark/lib/types/dashboard.ts | 1 + apps/open-spark/pages/dashboard.tsx | 49 ++++++++++--------- apps/open-spark/pages/tradeDetails.tsx | 25 +++++++++- apps/open-spark/public/images/pending.svg | 3 ++ .../public/images/pendingStatus.svg | 3 ++ .../order-status-progress.tsx | 4 +- .../order-status-progress.types.ts | 1 + 8 files changed, 70 insertions(+), 27 deletions(-) create mode 100644 apps/open-spark/public/images/pending.svg create mode 100644 packages/becknified-components/public/images/pendingStatus.svg diff --git a/apps/open-spark/components/energyPurchaseForm/index.tsx b/apps/open-spark/components/energyPurchaseForm/index.tsx index 74f454d56..bef689298 100644 --- a/apps/open-spark/components/energyPurchaseForm/index.tsx +++ b/apps/open-spark/components/energyPurchaseForm/index.tsx @@ -102,7 +102,16 @@ export default function EnergyPurchaseForm({ preferenceType }: EnergyPurchaseFor if (response.status === 200 || response.status === 204) { console.log('Trade created successfully:', response.data) - router.push('/') + if (role !== ROLE.PRODUCER) { + router.push({ + pathname: '/', + query: { id: response.data?.id } + }) + } else { + router.push({ + pathname: '/' + }) + } } } catch (error) { console.error('Error creating trade:', error) diff --git a/apps/open-spark/lib/types/dashboard.ts b/apps/open-spark/lib/types/dashboard.ts index 7600618de..b0b128aff 100644 --- a/apps/open-spark/lib/types/dashboard.ts +++ b/apps/open-spark/lib/types/dashboard.ts @@ -12,6 +12,7 @@ export interface CurrentTradeData { symbol: string } export type StatusItem = { + isPending?: boolean label: string | React.ReactNode status?: string statusTime?: string diff --git a/apps/open-spark/pages/dashboard.tsx b/apps/open-spark/pages/dashboard.tsx index f7d690ee5..2f85bf659 100644 --- a/apps/open-spark/pages/dashboard.tsx +++ b/apps/open-spark/pages/dashboard.tsx @@ -103,32 +103,30 @@ const Dashboard = () => { }, [role, bapDashboardData, bppDashboardData, startDate, endDate]) const fetchLastTradeData = async () => { - try { - const response = await axios.get(`${strapiUrl}${ROUTE_TYPE[role!]}/trade`, { - headers: { Authorization: `Bearer ${bearerToken}` }, - withCredentials: true - }) + const routerQueryId = router.query?.id + if (routerQueryId) { + try { + const response = await axios.get(`${strapiUrl}${ROUTE_TYPE[role!]}/trade?id=${routerQueryId}`, { + headers: { Authorization: `Bearer ${bearerToken}` }, + withCredentials: true + }) - const result = response.data + const result = response.data + const mappedTrade: TradeData = { + id: result.id, + quantity: result.quantity, + price: result.price || 0 + } - const lastTrade = result[result.length - 1] + setCurrentTradeData([mappedTrade]) + const statusData = createStatusData(result) + setCurrentStatusData(statusData) - const mappedTrade: TradeData = { - id: lastTrade.id, - quantity: lastTrade.quantity, - price: lastTrade.price || 0 + const tags = [result.trusted_source && 'Trusted Source', result.cred_required && 'Solar Energy'].filter(Boolean) + setPreferencesTags(tags) + } catch (error) { + console.error('Error fetching last trade data:', error) } - - setCurrentTradeData([mappedTrade]) - const statusData = createStatusData(lastTrade) - setCurrentStatusData(statusData) - - const tags = [lastTrade.trusted_source && 'Trusted Source', lastTrade.cred_required && 'Solar Energy'].filter( - Boolean - ) - setPreferencesTags(tags) - } catch (error) { - console.error('Error fetching last trade data:', error) } } @@ -183,19 +181,21 @@ const Dashboard = () => { const createStatusData = (tradeData: { status: string; createdAt: string }) => { const { status, createdAt } = tradeData const statusTime = formatDate(createdAt, 'hh:mm a') - const label = status === 'RECEIVED' ? 'Requirement Received' : 'Requirement Completed' + const isPending = status === 'RECEIVED' return [ { - label, + label: isPending ? 'Requirement Received' : 'Requirement Completed', status, statusTime, noLine: false, + isPending, lastElement: false }, { label: , statusTime: '', + isPending, noLine: true, lastElement: true } @@ -378,6 +378,7 @@ const Dashboard = () => { statusTime={data.statusTime!} noLine={data.noLine} lastElement={data.lastElement} + isPending={data.isPending} /> )) ) : ( diff --git a/apps/open-spark/pages/tradeDetails.tsx b/apps/open-spark/pages/tradeDetails.tsx index 4e1d9a925..d8d8d7ff9 100644 --- a/apps/open-spark/pages/tradeDetails.tsx +++ b/apps/open-spark/pages/tradeDetails.tsx @@ -23,6 +23,17 @@ interface TradeMetaData { preferencesTags: string[] } +const TRADDE_EVE_NUM = Object.freeze({ + BUY_REQUEST: 'buy_request', + BECKN_SEARCH: 'beckn_search', + BECKN_ON_SEARCH: 'beckn_on_search', + BECKN_INIT: 'beckn_init', + BECKN_ON_INIT: 'beckn_on_init', + BECKN_CONFIRM: 'beckn_confirm', + BECKN_ON_CONFIRM: 'beckn_on_confirm', + PENDING: 'pending' +}) + const TradeDetails = () => { const bearerToken = Cookies.get('authToken') const strapiUrl = process.env.NEXT_PUBLIC_STRAPI_URL @@ -52,6 +63,18 @@ const TradeDetails = () => { if (result.cred_required) { tags.push('Solar Energy') } + const tradeEvents = result.trade_events || [] + const lastEvent = tradeEvents[tradeEvents.length - 1] + + if (!lastEvent || lastEvent.event_name !== TRADDE_EVE_NUM.BECKN_ON_CONFIRM) { + tradeEvents.push({ + id: tradeEvents.length + 1, + event_name: TRADDE_EVE_NUM.PENDING, + description: 'Pending', + createdAt: new Date().toISOString() + }) + } + setTradeDetails({ orderId: result.orderId, name: result.item_name, @@ -197,7 +220,7 @@ const TradeDetails = () => { label={data.description} statusTime={formatDate(data.createdAt, "do MMM yyyy',' hh:mm a")} noLine={true} - lastElement={false} + lastElement={index === tradeDetails.tradeEvents.length - 1} /> ))} diff --git a/apps/open-spark/public/images/pending.svg b/apps/open-spark/public/images/pending.svg new file mode 100644 index 000000000..9e5de1a57 --- /dev/null +++ b/apps/open-spark/public/images/pending.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/becknified-components/public/images/pendingStatus.svg b/packages/becknified-components/public/images/pendingStatus.svg new file mode 100644 index 000000000..9e5de1a57 --- /dev/null +++ b/packages/becknified-components/public/images/pendingStatus.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/becknified-components/src/components/order-status-progress/order-status-progress.tsx b/packages/becknified-components/src/components/order-status-progress/order-status-progress.tsx index b92c2aec8..89174d008 100644 --- a/packages/becknified-components/src/components/order-status-progress/order-status-progress.tsx +++ b/packages/becknified-components/src/components/order-status-progress/order-status-progress.tsx @@ -3,6 +3,7 @@ import { Box, Flex, Image } from '@chakra-ui/react' import { Typography } from '@beckn-ui/molecules' import LineBlack from '../../../public/images/lineBlack.svg' import TrackIcon from '../../../public/images/TrackIcon.svg' +import PendingIcon from '../../../public/images/pendingStatus.svg' import { OrderStatusProgressProps } from './order-status-progress.types' const OrderStatusProgress: React.FC = ({ @@ -10,6 +11,7 @@ const OrderStatusProgress: React.FC = ({ statusTime, className = '', noLine = false, + isPending, lastElement, statusDescription, dataTestStateName = 'statusName', @@ -30,7 +32,7 @@ const OrderStatusProgress: React.FC = ({ maxW={'unset'} width="18px" height="18px" - src={TrackIcon} + src={isPending || label === 'Pending' ? PendingIcon : TrackIcon} /> {!showNoLine && (