diff --git a/dashboard/src/pages/scan/state/[tab].tsx b/dashboard/src/pages/scan/state/[tab].tsx index 422623acc9..d82a7ce70f 100644 --- a/dashboard/src/pages/scan/state/[tab].tsx +++ b/dashboard/src/pages/scan/state/[tab].tsx @@ -76,12 +76,10 @@ const StateList = () => { } return ( - { - {isLoading ? ( @@ -134,9 +131,7 @@ const StateList = () => { {tabContentList[activeTab]} )} - - ) } diff --git a/dashboard/src/views/feature/SessionKeyList.tsx b/dashboard/src/views/feature/SessionKeyList.tsx index a311fcd9a4..873ee9cb16 100644 --- a/dashboard/src/views/feature/SessionKeyList.tsx +++ b/dashboard/src/views/feature/SessionKeyList.tsx @@ -2,11 +2,11 @@ // SPDX-License-Identifier: Apache-2.0 // ** React Imports -import { useState, useRef, useMemo, useEffect } from 'react' +import {useState, useRef, useMemo, useEffect} from 'react' -import { useAuth } from 'src/hooks/useAuth' -import { useSession } from 'src/hooks/useSessionAccount' -import { useRooch } from 'src/hooks/useRooch' +import {useAuth} from 'src/hooks/useAuth' +import {useSession} from 'src/hooks/useSessionAccount' +import {useRooch} from 'src/hooks/useRooch' import Grid from '@mui/material/Grid' import Box from '@mui/material/Box' @@ -30,8 +30,8 @@ import { } from '@mui/x-data-grid' // ** Store & Actions Imports -import { fetchData, removeRow } from 'src/store/session' -import { useAppDispatch, useAppSelector } from 'src/store' +import {fetchData, removeRow} from 'src/store/session' +import {useAppDispatch, useAppSelector} from 'src/store' const formatDate = (timestamp: number) => { if (timestamp === 0) { @@ -53,33 +53,37 @@ const PAGE_SIZE = 100 export default function SessionKeyList() { const columns: GridColDef[] = [ - { field: 'authentication_key', headerName: 'Authentication Key', width: 200 }, { + field: 'authentication_key', + flex: 0.2, + headerName: 'Authentication Key', + }, + { + flex: 0.1, field: 'scopes', headerName: 'Scopes', - width: 200, valueGetter: (params: GridValueGetterParams) => { return (params.row.scopes as Array).join(', ') }, }, { field: 'max_inactive_interval', + flex: 0.1, headerName: 'Max Inactive Interval', - width: 200, type: 'number', }, { field: 'last_active_time', + flex: 0.1, headerName: 'Last Active Time', - width: 200, valueGetter: (params: GridValueGetterParams) => { return formatDate(params.row.last_active_time * 1000) }, }, { field: 'create_time', + flex: 0.1, headerName: 'Create Time', - width: 200, valueGetter: (params: GridValueGetterParams) => { return formatDate(params.row.create_time * 1000) }, @@ -87,7 +91,7 @@ export default function SessionKeyList() { { field: 'action', headerName: 'Action', - flex: 1, + flex: 0.2, align: 'right', headerAlign: 'right', renderCell: (params: GridRenderCellParams) => ( @@ -124,7 +128,7 @@ export default function SessionKeyList() { // ** Hooks const dispatch = useAppDispatch() - const { result, status, error } = useAppSelector((state) => state.session) + const {result, status, error} = useAppSelector((state) => state.session) useEffect(() => { const defaultAccount = auth.defaultAccount @@ -230,64 +234,62 @@ export default function SessionKeyList() { } return ( - - - - - + + + + + + + + + {error} + + + {'Confirm Deletion'} + + + Are you sure you want to delete this Session Key? Once deleted, the user will be + logged out and this action cannot be undone. + + + + - - - - {error} - - - {'Confirm Deletion'} - - - Are you sure you want to delete this Session Key? Once deleted, the user will be - logged out and this action cannot be undone. - - - - - - - - - - + + + + ) } diff --git a/dashboard/src/views/scan/state/list/index.tsx b/dashboard/src/views/scan/state/list/index.tsx index 6b35134d95..10a35eb962 100644 --- a/dashboard/src/views/scan/state/list/index.tsx +++ b/dashboard/src/views/scan/state/list/index.tsx @@ -2,24 +2,24 @@ // SPDX-License-Identifier: Apache-2.0 // ** React Imports -import { useState, useEffect, useRef, useMemo, useCallback } from 'react' +import {useState, useEffect, useRef, useMemo, useCallback} from 'react' // ** Next Import import Link from 'next/link' // ** MUI Imports import Card from '@mui/material/Card' -import { styled } from '@mui/material/styles' +import {styled} from '@mui/material/styles' import Typography from '@mui/material/Typography' -import { DataGrid, GridColDef } from '@mui/x-data-grid' +import {DataGrid, GridColDef} from '@mui/x-data-grid' // ** Store & Actions Imports -import { fetchData } from 'src/store/scan/state/list' -import { useAppDispatch, useAppSelector } from 'src/store' +import {fetchData} from 'src/store/scan/state/list' +import {useAppDispatch, useAppSelector} from 'src/store' // ** Utils -import { formatAddress } from 'src/@core/utils/format' -import { useRooch } from '../../../../hooks/useRooch' +import {formatAddress} from 'src/@core/utils/format' +import {useRooch} from '../../../../hooks/useRooch' import CardSnippet from '../../../../@core/components/card-snippet' import Grid from '@mui/material/Grid' import Spinner from '../../../../@core/components/spinner' @@ -35,7 +35,7 @@ interface CellType { } // ** Styled components -const LinkStyled = styled(Link)(({ theme }) => ({ +const LinkStyled = styled(Link)(({theme}) => ({ fontSize: '1rem', textDecoration: 'none', color: theme.palette.primary.main, @@ -45,13 +45,13 @@ const TransactionList = () => { // Hook const rooch = useRooch() const dispatch = useAppDispatch() - const { result, status, error } = useAppSelector((state) => state.statePageView) + const {result, status, error} = useAppSelector((state) => state.statePageView) // ** State const [accessPath, setAccessPath] = useState('/object/0x1') const [cacheResult, setCacheResult] = useState<{ [page: number]: any[] }>({}) - const [paginationModel, setPaginationModel] = useState({ page: 0, pageSize: 10 }) + const [paginationModel, setPaginationModel] = useState({page: 0, pageSize: 10}) const [curStateView, setCurStateView] = useState(null) const mapPageToNextCursor = useRef<{ [page: number]: Uint8Array | null }>({}) const queryOptions = useMemo( @@ -68,7 +68,7 @@ const TransactionList = () => { // We add nextCursor when available mapPageToNextCursor.current[paginationModel.page] = result.next_cursor cacheResult[paginationModel.page] = result.data - setCacheResult({ ...cacheResult }) + setCacheResult({...cacheResult}) const count = Object.values(cacheResult).reduce((sum, data) => sum + data.length, 0) setCount(count) } @@ -147,7 +147,7 @@ const TransactionList = () => { minWidth: 90, field: 'type', headerName: 'Type', - renderCell: ({ row }: CellType) => ( + renderCell: ({row}: CellType) => ( { @@ -165,8 +165,8 @@ const TransactionList = () => { minWidth: 90, field: 'id', headerName: 'ID', - renderCell: ({ row }: CellType) => ( - + renderCell: ({row}: CellType) => ( + {formatAddress(row.decoded_value.value.id)} ), @@ -177,8 +177,8 @@ const TransactionList = () => { minWidth: 90, field: 'owner', headerName: 'Owner', - renderCell: ({ row }: CellType) => ( - + renderCell: ({row}: CellType) => ( + {formatAddress(row.decoded_value.value.owner)} ), @@ -188,55 +188,51 @@ const TransactionList = () => { console.log(status, status === 'loading') return ( - - - - - - - - - ), - }} - onChange={(v) => setAccessPath(v.target.value)} - /> - - - + <> + + + + + + + ), + }} + onChange={(v) => setAccessPath(v.target.value)} + /> + + {status === 'loading' ? ( - - - + ) : ( <> - - + ({ ...row, id: row.decoded_value.value.id })) + .flat() + .map((row: any) => ({...row, id: row.decoded_value.value.id})) : [] } columns={defaultColumns.map((v) => ({ @@ -247,11 +243,9 @@ const TransactionList = () => { onPaginationModelChange={setPaginationModel} /> - - + {curStateView ? curStateView.decoded_value.type : 'Current Page Raw Data'} - { }, ]} /> - )} - + ) }