fix: contract overview detail + remove uppercase func name

AstraProtocol · Nov 16, 2022 · 82ac9a5 · 82ac9a5
1 parent c6b03ce
commit 82ac9a5
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 27 deletions.
diff --git a/views/accounts/tabs/ContractCodeTab/Overview.tsx b/views/accounts/tabs/ContractCodeTab/Overview.tsx
@@ -1,35 +1,49 @@
+import { useMobileLayout } from '@astraprotocol/astra-ui'
 import clsx from 'clsx'
+import Row from 'components/Grid/Row'
 import styles from './style.module.scss'
 
 interface Props {
 	contractCode: ContractCodeData
 }
 const ContractCodeOverview = ({ contractCode }: Props) => {
+	const { isMobile } = useMobileLayout()
 	return (
-		<div className={clsx(styles.overview, 'margin-bottom-xl md-wrap')}>
-			<div className="text text-sm contrast-color-30">
-				Contract Name: <div className="text text-base contrast-color-100">{contractCode.ContractName}</div>
+		<div className={clsx(styles.overview, 'margin-bottom-xl ')}>
+			<div className={isMobile ? 'col col-5' : 'col col-5 margin-right-xl'}>
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">Name: </span>
+					<span className="text text-base contrast-color-100">{contractCode.ContractName}</span>
+				</Row>
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">Compiler Version: </span>
+					<span className="text text-base contrast-color-100">{contractCode.CompilerVersion}</span>
+				</Row>
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">EVM Version:</span>
+					<span className="text text-base contrast-color-100">{contractCode.EVMVersion}</span>
+				</Row>
+				{contractCode.Verified && (
+					<Row style={{ justifyContent: 'space-between' }}>
+						<span className="text text-sm contrast-color-30">Verified At: </span>
+						<span className="text text-base contrast-color-100">{contractCode.VerifiedAt}</span>
+					</Row>
+				)}
 			</div>
-			<div className="text text-sm contrast-color-30">
-				Compiler Version:{' '}
-				<div className="text text-base contrast-color-100">{contractCode.CompilerVersion}</div>
+			<div className="col col-5">
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">Is Proxy:</span>
+					<span className="text text-base contrast-color-100">{contractCode.IsProxy}</span>
+				</Row>
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">Optimization enabled: </span>
+					<span className="text text-base contrast-color-100">{contractCode.OptimizationUsed}</span>
+				</Row>
+				<Row style={{ justifyContent: 'space-between' }}>
+					<span className="text text-sm contrast-color-30">Optimization runs: </span>
+					<span className="text text-base contrast-color-100">{contractCode.OptimizationRuns}</span>
+				</Row>
 			</div>
-			<div className="text text-sm contrast-color-30">
-				EVM Version: <div className="text text-base contrast-color-100">{contractCode.EVMVersion}</div>
-			</div>
-			<div className="text text-sm contrast-color-30">
-				Optimization enabled:{' '}
-				<div className="text text-base contrast-color-100">{contractCode.OptimizationUsed}</div>
-			</div>
-			<div className="text text-sm contrast-color-30">
-				Optimization runs:{' '}
-				<div className="text text-base contrast-color-100">{contractCode.OptimizationRuns}</div>
-			</div>
-			{contractCode.Verified && (
-				<div className="text text-sm contrast-color-30">
-					Verified At: <div className="text text-base contrast-color-100">{contractCode.VerifiedAt}</div>
-				</div>
-			)}
 		</div>
 	)
 }

diff --git a/views/accounts/tabs/ContractCodeTab/style.module.scss b/views/accounts/tabs/ContractCodeTab/style.module.scss
@@ -2,5 +2,4 @@
 	display: flex;
 	flex-direction: row;
 	flex-wrap: wrap;
-	justify-content: space-between;
 }
diff --git a/views/transactions/TransactionBriefRow.tsx b/views/transactions/TransactionBriefRow.tsx
@@ -7,7 +7,7 @@ import { LinkText } from 'components/Typography/LinkText'
 import Tag from 'components/Typography/Tag'
 import Image from 'next/image'
 import { TransacionTypeEnum } from 'utils/enum'
-import { capitalizeFirstLetter, ellipseBetweenText, LinkMaker } from 'utils/helper'
+import { ellipseBetweenText, LinkMaker } from 'utils/helper'
 import styles from './style.module.scss'
 
 type TransactionBriefRowProps = {
@@ -96,9 +96,7 @@ export default function TransactionBriefRow({
 							>
 								{ellipseBetweenText(hash, 12, 12).toLowerCase()}
 							</Typography.LinkText>
-							{evmType && (
-								<Tag hasArrowRight={false} fontType="Titi" text={capitalizeFirstLetter(evmType)} />
-							)}
+							{evmType && <Tag hasArrowRight={false} fontType="Titi" text={evmType} />}
 						</Row>
 						<Timer updatedAt={updatedAt} />
 					</div>