Skip to content

Commit

Permalink
Merge pull request #3112 from beckn/fix/issue-3058
Browse files Browse the repository at this point in the history
feat(open-spark): modified code for enhancement of dashboard for buy …
  • Loading branch information
aniketceminds authored Feb 3, 2025
2 parents 10184b9 + cc941b9 commit dc2a8c5
Show file tree
Hide file tree
Showing 8 changed files with 154 additions and 110 deletions.
17 changes: 9 additions & 8 deletions apps/open-spark/components/currentTrade/EmptyCurrentTrade.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,16 +10,17 @@ const EmptyCurrentTrade = ({ text }: { text: string }) => {
<Flex
flexDir={'column'}
rowGap={'15px'}
mt={'20px'}
p={'0 2rem'}
>
<Box>
<Image
src="/images/empty_trade.svg"
data-test="empty-trade-img"
/>
</Box>
<Image
src="/images/empty_trade.svg"
data-test="empty-trade-img"
width="100px"
height="100px"
alignSelf="center"
/>
<Typography
fontSize="15px"
fontSize="12px"
fontWeight="400"
sx={{ textAlign: 'center' }}
text={`your data will appear here once you start ${text} energy `}
Expand Down
7 changes: 2 additions & 5 deletions apps/open-spark/components/deviceList/DeviceList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,24 +31,21 @@ export default function DeviceList({ initialDevices, onDeviceChange, fetchPaired
const [selectedDeviceIndex, setSelectedDeviceIndex] = useState<number | null>(null)
const [isLoading, setIsLoading] = useState<boolean>(false)
const [isDeleteLoading, setIsDeleteLoading] = useState<boolean>(false)
const [role, setRole] = useState<ROLE>()

const strapiUrl = process.env.NEXT_PUBLIC_STRAPI_URL
const bearerToken = Cookies.get('authToken')

const handleAddDevice = async (category: string, uploadedFiles: File[]) => {
setIsLoading(true)
try {
const type = role === ROLE.SELL ? 'prosumer' : 'consumer'
const formData = new FormData()

formData.append('type', type)
formData.append('category', category)
uploadedFiles.forEach(file => {
formData.append('proof', file)
})

const response = await axios.post(`${strapiUrl}${ROUTE_TYPE[role!]}/der`, formData, {
const response = await axios.post(`${strapiUrl}${ROUTE_TYPE[ROLE.GENERAL]}/der`, formData, {
headers: {
Authorization: `Bearer ${bearerToken}`
},
Expand Down Expand Up @@ -81,7 +78,7 @@ export default function DeviceList({ initialDevices, onDeviceChange, fetchPaired

const handleRemoveDevice = async (index: number) => {
try {
const response = await axios.delete(`${strapiUrl}${ROUTE_TYPE[role!]}/der/${index}`, {
const response = await axios.delete(`${strapiUrl}${ROUTE_TYPE[ROLE.GENERAL]}/der/${index}`, {
headers: { Authorization: `Bearer ${bearerToken}` },
withCredentials: true
})
Expand Down
68 changes: 52 additions & 16 deletions apps/open-spark/components/documentsRenderer/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,24 +6,28 @@ import deleteIcon from '@public/images/delete_icon.svg'
import tickIcon from '@public/images/tick.svg'
import { formatFileSize } from '@utils/general'
import { testIds } from '@shared/dataTestIds'
import VerifiedIcon from '@public/images/verified.svg'
import UnverifiedIcon from '@public/images/unverified.svg'

export interface DocumentProps {
icon: string
title: string
date: Date
verified?: boolean
file?: any
data?: any
}

interface RenderDocumentsProps {
list: DocumentProps[]
type: 'cred' | 'upload'
showVerificationbatch?: boolean
handleOnDelete?: (index: number, document: DocumentProps, type: 'cred' | 'upload') => void
onAllComplete?: (completed: boolean) => void
}

const RenderDocuments = (props: RenderDocumentsProps) => {
const { list, type, handleOnDelete, onAllComplete } = props
const { list, type, handleOnDelete, onAllComplete, showVerificationbatch = false } = props

const [progressList, setProgressList] = useState<number[]>([])

Expand Down Expand Up @@ -83,23 +87,55 @@ const RenderDocuments = (props: RenderDocumentsProps) => {
marginLeft="1rem"
width="100%"
>
<Typography
text={document.title}
dataTest={testIds.document_title}
fontWeight="600"
sx={{
maxWidth: '10rem',
noOfLines: 2,
textOverflow: 'ellipsis',
whiteSpace: 'pre-wrap',
overflowWrap: 'break-word'
}}
/>
{type === 'cred' ? (
<Flex
flexDir={'row'}
gap="0.5rem"
>
<Typography
text={formatDate(document.date, "dd MMM yyyy 'at' hh:mm a")}
dataTest={testIds.document_uplaod_date}
text={document.title}
dataTest={testIds.document_title}
fontWeight="600"
sx={{
maxWidth: '10rem',
noOfLines: 2,
textOverflow: 'ellipsis',
whiteSpace: 'pre-wrap',
overflowWrap: 'break-word'
}}
/>
{showVerificationbatch &&
type === 'cred' &&
(document?.verified ? (
<Image
src={VerifiedIcon}
width={'80px'}
height={'18px'}
/>
) : (
<Image
src={UnverifiedIcon}
width={'80px'}
height={'18px'}
/>
))}
</Flex>
{type === 'cred' ? (
<>
<Typography
text={formatDate(document.date, "dd MMM yyyy 'at' hh:mm a")}
dataTest={testIds.document_uplaod_date}
/>
{showVerificationbatch && !document?.verified && (
<Typography
text={'Verify Credential'}
sx={{
textDecoration: 'underline',
color: '#4498E8',
cursor: 'pointer'
}}
/>
)}
</>
) : (
<>
<Typography
Expand Down
136 changes: 67 additions & 69 deletions apps/open-spark/pages/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ const Dashboard = () => {
const [status, setStatus] = useState<string>('CLOSED')
const strapiUrl = process.env.NEXT_PUBLIC_STRAPI_URL
const bearerToken = Cookies.get('authToken') || ''
const [isTradeLodaing, setIsTradeLoading] = useState(true)
const [isPreffrenceLodaing, setIsPreffrenceLoading] = useState(true)
const [isTradeLodaing, setIsTradeLoading] = useState(false)
const [isPreffrenceLodaing, setIsPreffrenceLoading] = useState(false)
const [currentTradeData, setCurrentTradeData] = useState<TradeData[]>([])
const [currentStatusData, setCurrentStatusData] = useState<StatusItem[]>([])
const [dashboardTotalEnergyUnitsData, setDashboardTotalEnergyUnitsData] = useState<DashboardData>({
Expand All @@ -75,17 +75,6 @@ const Dashboard = () => {
credentials: bearerToken
})

// const { data: bppDashboardData } = useBppTradeDashboardQuery(
// {
// startDate: payloadStartDate,
// endDate: payloadEndDate,
// credentials: bearerToken
// },
// {
// skip: role !== ROLE.SELL
// }
// )

// const handleRemoveTag = (tagToRemove: string) => {
// setPreferencesTags(prevTags => prevTags.filter(tag => tag !== tagToRemove))
// }
Expand Down Expand Up @@ -173,11 +162,11 @@ const Dashboard = () => {

useEffect(() => {
getmarketStatus()
if (role === ROLE.BUY) {
fetchLastTradeData()
} else if (role === ROLE.SELL) {
fetchMyPreference()
}
// if (role === ROLE.BUY) {
// fetchLastTradeData()
// } else if (role === ROLE.SELL) {
// fetchMyPreference()
// }
}, [role])

useEffect(() => {
Expand Down Expand Up @@ -285,7 +274,7 @@ const Dashboard = () => {
<Grid
templateColumns={{ base: 'repeat(2, 1fr)', md: 'repeat(2, 1fr)' }}
width={{ base: '100%', md: '80%', lg: '100%' }}
marginBottom={'2rem'}
marginBottom={'1rem'}
>
{[
{ label: 'Total Energy Consumed', description: `${+totalEnergyUnits.toFixed(2)} (KWh)` },
Expand Down Expand Up @@ -340,7 +329,7 @@ const Dashboard = () => {
/>
<QuestionOutlineIcon />
</HStack>
{role === ROLE.SELL && currentTradeData.length !== 0 && (
{role === ROLE.SELL && currentTradeData.length !== 0 && status !== 'CLOSED' && (
<LiaPenSolid
data-test={testIds.current_trade_edit_btn}
cursor={'pointer'}
Expand All @@ -360,7 +349,7 @@ const Dashboard = () => {
}
/>
)}
{role === ROLE.BUY && currentTradeData.length !== 0 && (
{role === ROLE.BUY && currentTradeData.length !== 0 && status !== 'CLOSED' && (
<LiaPenSolid
data-test={testIds.current_trade_edit_btn}
cursor={'pointer'}
Expand Down Expand Up @@ -392,56 +381,62 @@ const Dashboard = () => {
</Box>
) : (
<>
<CurrentTrade
data={[
{
name: 'energyToBuy',
label: `Energy to ${role === ROLE.BUY ? 'Buy' : 'Sell'}`,
value: (currentTradeData[0]?.quantity ?? 0).toString(),
symbol: '(KWh)',
disabled: true
},
...(role !== ROLE.BUY
? [
{
name: 'priceFixed',
label: 'Price Fixed',
value: (currentTradeData[0]?.price ?? 0).toString(),
symbol: '₹/units',
disabled: true
}
]
: [])
]}
/>

{preferencesTags.length > 0 && (
<Box>
<Typography
dataTest={testIds.preferencesTags_text}
text="Preferences"
fontSize="14px"
fontWeight="600"
sx={{ marginBottom: '10px' }}
{currentTradeData.length === 0 ? (
<EmptyCurrentTrade text={role === ROLE.BUY ? 'buying' : 'selling'} />
) : (
<>
<CurrentTrade
data={[
{
name: 'energyToBuy',
label: `Energy to ${role === ROLE.BUY ? 'Buy' : 'Sell'}`,
value: (currentTradeData[0]?.quantity ?? 0).toString(),
symbol: '(KWh)',
disabled: true
},
...(role !== ROLE.BUY
? [
{
name: 'priceFixed',
label: 'Price Fixed',
value: (currentTradeData[0]?.price ?? 0).toString(),
symbol: '₹/units',
disabled: true
}
]
: [])
]}
/>
<Flex
gap={'10px'}
flexWrap={'wrap'}
>
{preferencesTags.map((tag, index) => (
<Tag
key={index}
borderRadius="md"
variant="outline"
colorScheme="gray"
padding={'4px 8px'}

{preferencesTags.length > 0 && (
<Box>
<Typography
dataTest={testIds.preferencesTags_text}
text="Preferences"
fontSize="14px"
fontWeight="600"
sx={{ marginBottom: '10px' }}
/>
<Flex
gap={'10px'}
flexWrap={'wrap'}
>
<TagLabel data-test={testIds.preferencesTags_tags_label}>{tag}</TagLabel>
{/* <TagCloseButton onClick={() => handleRemoveTag(tag)} /> */}
</Tag>
))}
</Flex>
</Box>
{preferencesTags.map((tag, index) => (
<Tag
key={index}
borderRadius="md"
variant="outline"
colorScheme="gray"
padding={'4px 8px'}
>
<TagLabel data-test={testIds.preferencesTags_tags_label}>{tag}</TagLabel>
{/* <TagCloseButton onClick={() => handleRemoveTag(tag)} /> */}
</Tag>
))}
</Flex>
</Box>
)}
</>
)}
</>
)}
Expand All @@ -450,6 +445,9 @@ const Dashboard = () => {
disabled={status === 'CLOSED'}
children={role === ROLE.BUY ? 'Buy' : 'Sell'}
handleClick={() => router.push(role === ROLE.SELL ? '/sellingPreference' : '/buyingPreference')}
sx={{
marginTop: '1rem'
}}
dataTest="buy-preference"
/>
</Flex>
Expand Down
Loading

0 comments on commit dc2a8c5

Please sign in to comment.