diff --git a/src/assets/scss/plugins/_react-select.scss b/src/assets/scss/plugins/_react-select.scss
index 1169e34a3..e6ed39c11 100644
--- a/src/assets/scss/plugins/_react-select.scss
+++ b/src/assets/scss/plugins/_react-select.scss
@@ -48,6 +48,7 @@
&__clear-indicator,
&__dropdown-indicator {
padding: 0.125rem 0.65rem;
+ width: 2.375rem;
svg {
fill: var(--neutral-500);
width: 1rem;
diff --git a/src/components/Filters/SearchFilter.tsx b/src/components/Filters/SearchFilter.tsx
index ee4242a2b..bda35d503 100644
--- a/src/components/Filters/SearchFilter.tsx
+++ b/src/components/Filters/SearchFilter.tsx
@@ -106,44 +106,42 @@ export const SearchFilter = ({
data-testid={name}
/>
<>
- {inputValue && (
- <>
-
+ ) : (
+ {
+ updateSearchValue(inputValue);
+ }}
+ >
+
+
)}
- {
- updateSearchValue(inputValue);
- }}
- >
-
-
>
{errorText && (
{errorText}
diff --git a/src/components/Filters/TransactionsFilters/StatusColumnFilters.tsx b/src/components/Filters/TransactionsFilters/StatusColumnFilters.tsx
index b70b64467..e6d64d1df 100644
--- a/src/components/Filters/TransactionsFilters/StatusColumnFilters.tsx
+++ b/src/components/Filters/TransactionsFilters/StatusColumnFilters.tsx
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { OverlayTrigger, Popover } from 'react-bootstrap';
import { useSearchParams } from 'react-router-dom';
@@ -17,10 +18,14 @@ export const StatusColumnFilters = ({
const { status, hashes, miniBlockHash, relayer, isRelayed } =
Object.fromEntries(searchParams);
- const existingHashesValues: SelectFilterType['options'] =
- hashes?.split(',').map((hash) => {
+ const existingHashesValues: SelectFilterType['options'] = useMemo(() => {
+ if (!hashes) {
+ return [];
+ }
+ return hashes.split(',').map((hash) => {
return { value: hash, label: truncateMiddle(hash, 9) };
- }) ?? [];
+ });
+ }, [hashes]);
const searchStatuses = (
Object.keys(
diff --git a/src/components/TransactionsTable/transactionsTable.styles.scss b/src/components/TransactionsTable/transactionsTable.styles.scss
index eb16d10a3..9f51289b3 100644
--- a/src/components/TransactionsTable/transactionsTable.styles.scss
+++ b/src/components/TransactionsTable/transactionsTable.styles.scss
@@ -63,13 +63,15 @@
margin-bottom: 1rem;
.search-filter-block {
max-width: auto !important;
- .clear {
- fill: var(--neutral-500);
- width: 1rem;
- height: 1rem;
- margin-right: -3px;
- &:hover {
- fill: var(--primary);
+ .search-icon {
+ width: 2.375rem;
+ .clear {
+ fill: var(--neutral-500);
+ width: 1rem;
+ height: 1rem;
+ &:hover {
+ fill: var(--primary);
+ }
}
}
}
diff --git a/src/pages/TransactionDetails/components/TransactionInfo/TransactionLogsPanel/TransactionLogsPanel.tsx b/src/pages/TransactionDetails/components/TransactionInfo/TransactionLogsPanel/TransactionLogsPanel.tsx
index bc2e315cb..7dff5c18f 100644
--- a/src/pages/TransactionDetails/components/TransactionInfo/TransactionLogsPanel/TransactionLogsPanel.tsx
+++ b/src/pages/TransactionDetails/components/TransactionInfo/TransactionLogsPanel/TransactionLogsPanel.tsx
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
import { DetailItem } from 'components';
import {
AddressDetailItem,
@@ -11,6 +12,11 @@ export const TransactionLogsPanel = ({
}: {
transaction: TransactionType;
}) => {
+ const transactionResults = useMemo(
+ () => (transaction.results ?? []).filter((result) => result.logs),
+ [transaction.results]
+ );
+
return (
<>
{transaction.logs && (
@@ -29,9 +35,9 @@ export const TransactionLogsPanel = ({
)}
>
)}
- {transaction.results && transaction.results.length > 0 && (
+ {transactionResults.length > 0 && (
- {transaction.results.map((result, resultIndex) => {
+ {transactionResults.map((result, resultIndex) => {
if (!result.logs) {
return null;
}
@@ -45,12 +51,12 @@ export const TransactionLogsPanel = ({
{result.logs.address !== undefined && (
)}
- {result.logs.events && result.logs.events?.length > 0 && (
+ {result.logs.events.length > 0 && (
Events }>
)}
diff --git a/src/pages/Transactions/Transactions.tsx b/src/pages/Transactions/Transactions.tsx
index 9b65cff3d..e9436d155 100644
--- a/src/pages/Transactions/Transactions.tsx
+++ b/src/pages/Transactions/Transactions.tsx
@@ -9,8 +9,7 @@ import {
useGetPage,
useGetTransactionFilters,
useFetchTransactions,
- useGetShardText,
- useIsMainnet
+ useGetShardText
} from 'hooks';
import { activeNetworkSelector } from 'redux/selectors';
import { transactionsRoutes } from 'routes';
@@ -21,7 +20,6 @@ export const Transactions = () => {
const [searchParams] = useSearchParams();
const getShardText = useGetShardText();
const urlParams = useGetTransactionFilters();
- const isMainnet = useIsMainnet();
const { senderShard, receiverShard } = urlParams;
const { firstPageRefreshTrigger } = useGetPage();
@@ -83,18 +81,16 @@ export const Transactions = () => {
{getShardText(receiverShard)}
>
)}
-
- {isMainnet && (
-
-
- Transaction Pool
-
-
-
- )}
+
+
+ {/*
+ Transaction Pool
+ */}
+
+
}
/>