From 009075c33f6f17a2364c4abe0f2145a92a481728 Mon Sep 17 00:00:00 2001
From: Clement Mwimo <clement.mwimo@mx.com>
Date: Mon, 17 Aug 2026 18:27:01 -0600
Subject: [PATCH 1/2] feat: migrate @kyper/icon/Check to MXUI

---
 src/components/StyledAccountTypeIcon.tsx     | 4 ++--
 src/views/manualAccount/ManualAccountMenu.js | 3 +--
 typings/kyper.d.ts                           | 1 -
 3 files changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/components/StyledAccountTypeIcon.tsx b/src/components/StyledAccountTypeIcon.tsx
index d4d1191d08..547824a85c 100644
--- a/src/components/StyledAccountTypeIcon.tsx
+++ b/src/components/StyledAccountTypeIcon.tsx
@@ -1,9 +1,9 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import React from 'react'
 
+import { Icon } from '@mxenabled/mxui'
 import { useTokens } from '@kyper/tokenprovider'
 import { Accounts } from '@kyper/icon/Accounts'
-import { Check } from '@kyper/icon/Check'
 import { PiggyBankOutline } from '@kyper/icon/PiggyBankOutline'
 import { Document } from '@kyper/icon/Document'
 import { CreditCard } from '@kyper/icon/CreditCard'
@@ -34,7 +34,7 @@ export const StyledAccountTypeIcon: React.FC<StyledAccountTypeIconProps> = ({
   const getIcon = () => {
     switch (props.icon) {
       case AccountTypes.CHECKING:
-        return <Check color={tokens.TextColor.Default} size={iconSize} />
+        return <Icon name="check" size={iconSize} />
       case AccountTypes.SAVINGS:
         return <PiggyBankOutline color={tokens.TextColor.Default} size={iconSize} />
       case AccountTypes.LOAN:
diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js
index 2eb0b5fb9b..8b04940afe 100644
--- a/src/views/manualAccount/ManualAccountMenu.js
+++ b/src/views/manualAccount/ManualAccountMenu.js
@@ -5,7 +5,6 @@ import { __ } from 'src/utilities/Intl'
 import { useTokens } from '@kyper/tokenprovider'
 import { Icon, Text } from '@mxenabled/mxui'
 import { UtilityRow } from '@kyper/utilityrow'
-import { Check } from '@kyper/icon/Check'
 import { PiggyBankOutline } from '@kyper/icon/PiggyBankOutline'
 import { Document } from '@kyper/icon/Document'
 import { CreditCard } from '@kyper/icon/CreditCard'
@@ -50,7 +49,7 @@ export const ManualAccountMenu = React.forwardRef((props, ref) => {
         ]
 
   const getIcon = {
-    [AccountTypes.CHECKING]: <Check color={tokens.TextColor.Default} />,
+    [AccountTypes.CHECKING]: <Icon name="check" />,
     [AccountTypes.SAVINGS]: <PiggyBankOutline color={tokens.TextColor.Default} />,
     [AccountTypes.LOAN]: <Document color={tokens.TextColor.Default} />,
     [AccountTypes.CREDIT_CARD]: <CreditCard color={tokens.TextColor.Default} />,
diff --git a/typings/kyper.d.ts b/typings/kyper.d.ts
index 8dda122a65..8d43472198 100644
--- a/typings/kyper.d.ts
+++ b/typings/kyper.d.ts
@@ -4,7 +4,6 @@ declare module '@kyper/userfeedback'
 declare module '@kyper/textarea'
 declare module '@kyper/input'
 declare module '@kyper/icon/Accounts'
-declare module '@kyper/icon/Check'
 declare module '@kyper/icon/PiggyBankOutline'
 declare module '@kyper/icon/Document'
 declare module '@kyper/icon/CreditCard'

From 42ae644caeb7d393af7fc82a0f707201efea774f Mon Sep 17 00:00:00 2001
From: Clement Mwimo <clement.mwimo@mx.com>
Date: Mon, 17 Aug 2026 18:55:38 -0600
Subject: [PATCH 2/2] updated icon name

---
 src/components/StyledAccountTypeIcon.tsx     | 2 +-
 src/views/manualAccount/ManualAccountMenu.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/StyledAccountTypeIcon.tsx b/src/components/StyledAccountTypeIcon.tsx
index 547824a85c..61b459854c 100644
--- a/src/components/StyledAccountTypeIcon.tsx
+++ b/src/components/StyledAccountTypeIcon.tsx
@@ -34,7 +34,7 @@ export const StyledAccountTypeIcon: React.FC<StyledAccountTypeIconProps> = ({
   const getIcon = () => {
     switch (props.icon) {
       case AccountTypes.CHECKING:
-        return <Icon name="check" size={iconSize} />
+        return <Icon color="secondary" name="edit_square" size={iconSize} />
       case AccountTypes.SAVINGS:
         return <PiggyBankOutline color={tokens.TextColor.Default} size={iconSize} />
       case AccountTypes.LOAN:
diff --git a/src/views/manualAccount/ManualAccountMenu.js b/src/views/manualAccount/ManualAccountMenu.js
index 8b04940afe..ae05e19c6b 100644
--- a/src/views/manualAccount/ManualAccountMenu.js
+++ b/src/views/manualAccount/ManualAccountMenu.js
@@ -49,7 +49,7 @@ export const ManualAccountMenu = React.forwardRef((props, ref) => {
         ]
 
   const getIcon = {
-    [AccountTypes.CHECKING]: <Icon name="check" />,
+    [AccountTypes.CHECKING]: <Icon color="secondary" name="edit_square" />,
     [AccountTypes.SAVINGS]: <PiggyBankOutline color={tokens.TextColor.Default} />,
     [AccountTypes.LOAN]: <Document color={tokens.TextColor.Default} />,
     [AccountTypes.CREDIT_CARD]: <CreditCard color={tokens.TextColor.Default} />,