From 28b5265193f8f27e00ae5615ac5628ccc89c7d46 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Fri, 10 Nov 2023 21:56:25 +0200
Subject: [PATCH] feat: add custom blue dot to filter icon

---
 .../ManagementTable/ManagementTable.tsx       | 34 +++++++++++++------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/pages/ValidatorManagement/ManagementTable/ManagementTable.tsx b/src/pages/ValidatorManagement/ManagementTable/ManagementTable.tsx
index 6063cd26..d0c4b8cb 100644
--- a/src/pages/ValidatorManagement/ManagementTable/ManagementTable.tsx
+++ b/src/pages/ValidatorManagement/ManagementTable/ManagementTable.tsx
@@ -1,7 +1,7 @@
 import { Checkbox, Text } from '@status-im/components'
 import { OptionsIcon, SortIcon } from '@status-im/icons'
 import { useState } from 'react'
-import { YStack, XStack } from 'tamagui'
+import { YStack, XStack, Stack } from 'tamagui'
 
 import ValidatorProfile from '../../../components/General/ValidatorProfile'
 import SearchManagement from './SearchManagement'
@@ -69,16 +69,28 @@ const ManagementTable = () => {
     <YStack>
       <XStack justifyContent="space-between">
         <SearchManagement searchValue={searchValue} changeSearchValue={changeSearchValue} />
-        <SortIcon
-          size={20}
-          color="#647084"
-          style={{
-            border: '1px solid #DCE0E5',
-            borderRadius: '10px',
-            padding: '6px',
-            cursor: 'pointer',
-          }}
-        />
+        <Stack style={{ position: 'relative', display: 'inline-block' }}>
+          <SortIcon
+            size={20}
+            color="#647084"
+            style={{
+              border: '1px solid #DCE0E5',
+              borderRadius: '10px',
+              padding: '6px',
+              cursor: 'pointer',
+            }}
+          />
+          <Stack style={{
+            position: 'absolute',
+            right: -2,
+            top: -1.5,
+            width: '9px',
+            height: '9px',
+            borderRadius: '50%',
+            backgroundColor: '#1992D7',
+            border: '1.5px solid #fff',
+          }} />
+        </Stack>
       </XStack>
       <table>
         <thead>