Merge pull request #194 from chain4travel/suite

Adjustment of validators sorting.
chain4travel · Nov 15, 2024 · cc6c035 · cc6c035
2 parents 82a48f9 + 7816ecf
commit cc6c035
Show file tree

Hide file tree

Showing 9 changed files with 87 additions and 11 deletions.
diff --git a/src/app/components/NavBar/SearchInput.tsx b/src/app/components/NavBar/SearchInput.tsx
@@ -147,7 +147,7 @@ function OutlinedSearchInput() {
                         avatar: 'AD',
                         avatarColor: 'searchResultItem.bg_PAD',
                     }
-                } else {
+                } else if (ChainId === getChainID('x')) {
                     return {
                         label: `X-${xpAddressData.address}`,
                         type: type,
@@ -159,7 +159,7 @@ function OutlinedSearchInput() {
                         avatar: 'AD',
                         avatarColor: 'searchResultItem.bg_XAD',
                     }
-                }
+                } else return {}
             default:
                 console.log('Got unknown response type from search', +type)
                 return undefined
@@ -189,7 +189,7 @@ function OutlinedSearchInput() {
                     data.results[i].type,
                     data.results[i].data,
                 ) as SearchMenuItem
-                if (mapItem) setMenuItems(prev => [...prev, mapItem])
+                if (Object.keys(mapItem).length) setMenuItems(prev => [...prev, mapItem])
             }
             setLoading(false)
         },

diff --git a/src/app/components/PageContainer.tsx b/src/app/components/PageContainer.tsx
@@ -1,21 +1,25 @@
 import React from 'react'
 import { Helmet } from 'react-helmet-async'
 import { Container } from '@mui/material'
+import { StringArraySupportOption } from 'prettier'
 
 export default function PageContainer({
     pageTitle,
     metaContent,
+    metaKeywords,
     children,
 }: {
     pageTitle: string
     metaContent: string
+    metaKeywords?: string
     children: React.ReactNode
 }) {
     return (
         <Container maxWidth="xl" sx={{ minHeight: '500px', p: '0px !important' }}>
             <Helmet>
                 <title>{pageTitle}</title>
                 <meta name="description" content={metaContent} />
+                <meta name="keywords" content={metaKeywords} />
             </Helmet>
             {children}
         </Container>

diff --git a/src/app/components/Table/TableView.tsx b/src/app/components/Table/TableView.tsx
@@ -2,6 +2,8 @@ import React from 'react'
 import { Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material'
 import { Field } from '../DetailsField'
 import { ColumnType } from 'app/pages/Validators'
+import { useAppDispatch } from 'store/configureStore'
+import { sortValidators } from 'store/validatorsSlice'
 
 export default function TableView({
     children,
@@ -10,16 +12,22 @@ export default function TableView({
     columns: ColumnType[]
     children: React.ReactNode
 }) {
+    const dispatch = useAppDispatch()
     return (
         <>
             <Table stickyHeader>
                 <TableHead>
                     <TableRow>
                         {columns.map(column => (
                             <TableCell
-                                sx={{ backgroundColor: 'primary.dark', wrap: 'nowrap' }}
+                                sx={{
+                                    backgroundColor: 'primary.dark',
+                                    wrap: 'nowrap',
+                                    cursor: 'pointer',
+                                }}
                                 key={column.name}
                                 align={column.align}
+                                onClick={() => dispatch(sortValidators(column.name))}
                             >
                                 <Field
                                     type="string"

diff --git a/src/app/pages/CChainPages/CChainPage.tsx b/src/app/pages/CChainPages/CChainPage.tsx
@@ -49,7 +49,11 @@ export default function CChainPage() {
     }
 
     return (
-        <PageContainer pageTitle="C chain" metaContent="chain-overview c-chain">
+        <PageContainer
+            pageTitle="C chain"
+            metaContent="Track and analyze transactions, smart contracts, and dApps on Camino C-Chain. Explore travel-related on-chain data on Camino Network's EVM-compatible C-Chain."
+            metaKeywords="Camino C-Chain"
+        >
             {isError && error ? (
                 <>
                     <Typography

diff --git a/src/app/pages/PChainPages/PChainPage.tsx b/src/app/pages/PChainPages/PChainPage.tsx
@@ -35,7 +35,11 @@ export default function PChainPage() {
     })
 
     return (
-        <PageContainer pageTitle="P chain" metaContent="chain-overview p-chain">
+        <PageContainer
+            pageTitle="P chain"
+            metaContent="Explore Camino P-Chain on-chain transactions for managing validators, network governance, and subnet development."
+            metaKeywords="Camino P-Chain"
+        >
             <DataControllers />
             <OverviewCards
                 numberOfTransactions={numberOfTransactions}

diff --git a/src/app/pages/Statistics/index.tsx b/src/app/pages/Statistics/index.tsx
@@ -37,7 +37,11 @@ const Statistics: FC = () => {
     const dark = theme.palette.mode === 'light' ? false : true
 
     return (
-        <PageContainer pageTitle="Statistics" metaContent="statistics">
+        <PageContainer
+            pageTitle="Camino Statistics and Blockchain Data Dashboard"
+            metaContent="Explore the Camino statistics dashboard for real-time data on network activity, transactions, gas, wallets, and more. Keep track of the travel blockchain performance."
+            metaKeywords='Camino Statistics'
+        >
             <Paper
                 variant="outlined"
                 square

diff --git a/src/app/pages/Validators/index.tsx b/src/app/pages/Validators/index.tsx
@@ -65,7 +65,11 @@ const Validators: FC = () => {
     }
 
     return (
-        <PageContainer pageTitle="Validators" metaContent="validators">
+        <PageContainer
+            pageTitle="Camino Validators"
+            metaContent="Discover the active validators on Camino Network. View detailed node stats, uptime, and contributions to monitor the network security and governance."
+            metaKeywords="Camino Validators"
+        >
             <Paper
                 variant="outlined"
                 square

diff --git a/src/app/pages/XChainPages/XChainPage.tsx b/src/app/pages/XChainPages/XChainPage.tsx
@@ -17,7 +17,6 @@ import { getChainID } from 'api/utils'
 import { XPTransaction } from 'types/transaction'
 
 export default function XChainPage() {
-
     const routesConfig = RoutesConfig()
     const dispatch = useAppDispatch()
     const CHAIN_ID = getChainID('x')
@@ -34,7 +33,11 @@ export default function XChainPage() {
     })
 
     return (
-        <PageContainer pageTitle="X chain" metaContent="chain-overview x-chain">
+        <PageContainer
+            pageTitle="X chain"
+            metaContent="Explore Camino X-Chain DAG-based transaction processing for secure, efficient asset creation, management, and exchange on Camino Network."
+            metaKeywords="Camino X-Chain"
+        >
             <DataControllers />
             <OverviewCards
                 numberOfTransactions={numberOfTransactions}

diff --git a/src/store/validatorsSlice/index.ts b/src/store/validatorsSlice/index.ts
@@ -11,6 +11,7 @@ import {
     ValidatorReponse,
 } from '../../types/locationNode'
 import sortBy from 'lodash/sortBy'
+import { orderBy } from 'lodash'
 
 let initialState: initialValidatorsStateType = {
     percentageOfActiveValidators: 0,
@@ -91,6 +92,50 @@ const validatorsSlice = createSlice({
     initialState,
     reducers: {
         resetValidatorsReducer: () => initialState,
+        sortValidators: (state, { payload }) => {
+            if (state.validators.length <= 1) return
+            if (payload === 'UpTime') {
+                state.validators = sortBy(state.validators, e => {
+                    if (state.validators[0].uptime > state.validators[1].uptime) return -e.uptime
+                    else return e.uptime
+                })
+            } else if (payload === 'EndTime')
+                state.validators = sortBy(state.validators, e => {
+                    if (
+                        new Date(state.validators[0].endTime) -
+                            new Date(state.validators[1].endTime) <=
+                        0
+                    )
+                        return -new Date(e.endTime)
+                    return new Date(e.endTime)
+                })
+            else if (payload === 'StartTime')
+                state.validators = sortBy(state.validators, e => {
+                    if (
+                        new Date(state.validators[0].startTime) -
+                            new Date(state.validators[1].startTime) <=
+                        0
+                    )
+                        return -new Date(e.startTime)
+                    return new Date(e.startTime)
+                })
+            else if (payload === 'NodeID') {
+                let order = state.validators[0].nodeID > state.validators[1].nodeID ? 'desc' : 'asc'
+                state.validators = orderBy(state.validators, ['nodeID'], [order as 'asc' | 'desc'])
+            } else if (payload === 'Status')
+                state.validators = sortBy(state.validators, e => {
+                    if (state.validators[0].status === 'Connected') return e.status === 'Connected'
+                    else return e.status !== 'Connected'
+                })
+            else if (payload === 'txID') {
+                let order =
+                    state.validators[0].txID.toLocaleLowerCase() >
+                    state.validators[1].txID.toLocaleLowerCase()
+                        ? 'asc'
+                        : 'desc'
+                state.validators = orderBy(state.validators, ['txID'], [order as 'asc' | 'desc'])
+            }
+        },
     },
     extraReducers(builder) {
         builder.addCase(loadValidators.pending, state => {
@@ -151,6 +196,6 @@ export const getSumNodesPerCountry = (state: RootState) => state.validators.node
 
 export const getSumNodesPerCity = (state: RootState) => state.validators.nodesPerCity
 
-export const { resetValidatorsReducer } = validatorsSlice.actions
+export const { resetValidatorsReducer, sortValidators } = validatorsSlice.actions
 
 export default validatorsSlice.reducer