diff --git a/src/renderer/features/app-shell/components/AppShell.tsx b/src/renderer/features/app-shell/components/AppShell.tsx
index 528b3c336f..fceb9badd0 100644
--- a/src/renderer/features/app-shell/components/AppShell.tsx
+++ b/src/renderer/features/app-shell/components/AppShell.tsx
@@ -12,7 +12,7 @@ export const AppShell = memo(() => {
 
   return (
     <div className="flex h-screen animate-in fade-in">
-      <aside className="z-20 flex w-[240px] shrink-0 flex-col gap-y-6 border-r border-r-container-border bg-left-navigation-menu-background p-4">
+      <aside className="flex w-[240px] shrink-0 flex-col gap-y-6 border-r border-r-container-border bg-left-navigation-menu-background p-4">
         {headerNodes}
         <Navigation />
       </aside>
diff --git a/src/renderer/features/wallets/SelectWalletPairing/ui/SelectWalletPairing.tsx b/src/renderer/features/wallets/SelectWalletPairing/ui/SelectWalletPairing.tsx
index 0f2160b90f..fc5df0783a 100644
--- a/src/renderer/features/wallets/SelectWalletPairing/ui/SelectWalletPairing.tsx
+++ b/src/renderer/features/wallets/SelectWalletPairing/ui/SelectWalletPairing.tsx
@@ -1,55 +1,48 @@
 import { type TFunction } from 'i18next';
 
-import { WalletType } from '@/shared/core';
+import { type WalletFamily, WalletType } from '@/shared/core';
 import { useI18n } from '@/shared/i18n';
-import { DropdownButton } from '@/shared/ui';
-import { type ButtonDropdownOption } from '@/shared/ui/types';
+import { useToggle } from '@/shared/lib/hooks';
+import { Button, Icon } from '@/shared/ui';
+import { Dropdown } from '@/shared/ui-kit';
 import { WalletIcon } from '@/entities/wallet';
 import { walletPairingModel } from '../model/wallet-pairing-model';
 
-const getDropdownOptions = (t: TFunction): ButtonDropdownOption[] => {
+const getDropdownOptions = (t: TFunction): { title: string; walletType: WalletFamily }[] => {
   return [
-    {
-      id: 'vault',
-      title: t('wallets.addPolkadotVault'),
-      icon: <WalletIcon type={WalletType.POLKADOT_VAULT} />,
-      onClick: () => walletPairingModel.events.walletTypeSet(WalletType.POLKADOT_VAULT),
-    },
-    {
-      id: 'multi',
-      title: t('wallets.addMultisig'),
-      icon: <WalletIcon type={WalletType.MULTISIG} />,
-      onClick: () => walletPairingModel.events.walletTypeSet(WalletType.MULTISIG),
-    },
-    {
-      id: 'novaWallet',
-      title: t('wallets.addNovaWallet'),
-      icon: <WalletIcon type={WalletType.NOVA_WALLET} />,
-      onClick: () => walletPairingModel.events.walletTypeSet(WalletType.NOVA_WALLET),
-    },
-    {
-      id: 'walletConnect',
-      title: t('wallets.addWalletConnect'),
-      icon: <WalletIcon type={WalletType.WALLET_CONNECT} />,
-      onClick: () => walletPairingModel.events.walletTypeSet(WalletType.WALLET_CONNECT),
-    },
-    {
-      id: 'watch-only',
-      title: t('wallets.addWatchOnly'),
-      icon: <WalletIcon type={WalletType.WATCH_ONLY} />,
-      onClick: () => walletPairingModel.events.walletTypeSet(WalletType.WATCH_ONLY),
-    },
+    { title: t('wallets.addPolkadotVault'), walletType: WalletType.POLKADOT_VAULT },
+    { title: t('wallets.addMultisig'), walletType: WalletType.MULTISIG },
+    { title: t('wallets.addNovaWallet'), walletType: WalletType.NOVA_WALLET },
+    { title: t('wallets.addWalletConnect'), walletType: WalletType.WALLET_CONNECT },
+    { title: t('wallets.addWatchOnly'), walletType: WalletType.WATCH_ONLY },
   ];
 };
 
 export const SelectWalletPairing = () => {
   const { t } = useI18n();
 
+  const [isOpen, toggleIsOpen] = useToggle();
+
   return (
-    <DropdownButton
-      options={getDropdownOptions(t)}
-      className="h-8.5 w-[140px] py-2"
-      title={t('wallets.addButtonTitle')}
-    />
+    <Dropdown open={isOpen} onToggle={toggleIsOpen}>
+      <Dropdown.Trigger>
+        <Button
+          className="h-8.5 w-full justify-center py-2"
+          suffixElement={<Icon name={isOpen ? 'up' : 'down'} size={16} className="text-inherit" />}
+        >
+          {t('wallets.addButtonTitle')}
+        </Button>
+      </Dropdown.Trigger>
+      <Dropdown.Content>
+        {getDropdownOptions(t).map(({ title, walletType }) => (
+          <Dropdown.Item key={title} onSelect={() => walletPairingModel.events.walletTypeSet(walletType)}>
+            <div className="flex items-center gap-x-1.5">
+              <WalletIcon type={walletType} />
+              {title}
+            </div>
+          </Dropdown.Item>
+        ))}
+      </Dropdown.Content>
+    </Dropdown>
   );
 };
diff --git a/src/renderer/features/wallets/WalletSelect/ui/WalletButton.tsx b/src/renderer/features/wallets/WalletSelect/ui/WalletButton.tsx
index 81f5ce31c3..f41aafc0c4 100644
--- a/src/renderer/features/wallets/WalletSelect/ui/WalletButton.tsx
+++ b/src/renderer/features/wallets/WalletSelect/ui/WalletButton.tsx
@@ -1,7 +1,6 @@
-import { Popover } from '@headlessui/react';
-
 import { type Wallet } from '@/shared/core';
 import { Icon } from '@/shared/ui';
+import { Box, Popover } from '@/shared/ui-kit';
 import { WalletCardLg } from '@/entities/wallet';
 
 import { WalletFiatBalance } from './WalletFiatBalance';
@@ -11,11 +10,16 @@ type Props = {
 };
 export const WalletButton = ({ wallet }: Props) => {
   return (
-    <Popover.Button className="w-full rounded-md border border-container-border bg-left-navigation-menu-background shadow-card-shadow">
-      <div className="flex items-center justify-between px-3 py-3">
-        <WalletCardLg wallet={wallet} description={<WalletFiatBalance walletId={wallet.id} className="truncate" />} />
-        <Icon name="down" size={16} className="ml-auto shrink-0" />
-      </div>
-    </Popover.Button>
+    <Popover.Trigger>
+      <button
+        type="button"
+        className="w-full rounded-md border border-container-border bg-left-navigation-menu-background shadow-card-shadow"
+      >
+        <Box direction="row" verticalAlign="center" horizontalAlign="space-between" padding={3}>
+          <WalletCardLg wallet={wallet} description={<WalletFiatBalance walletId={wallet.id} className="truncate" />} />
+          <Icon name="down" size={16} className="ml-auto shrink-0" />
+        </Box>
+      </button>
+    </Popover.Trigger>
   );
 };
diff --git a/src/renderer/features/wallets/WalletSelect/ui/WalletPanel.tsx b/src/renderer/features/wallets/WalletSelect/ui/WalletPanel.tsx
index b03b59a38f..31847dc967 100644
--- a/src/renderer/features/wallets/WalletSelect/ui/WalletPanel.tsx
+++ b/src/renderer/features/wallets/WalletSelect/ui/WalletPanel.tsx
@@ -1,10 +1,10 @@
-import { Popover } from '@headlessui/react';
 import { useUnit } from 'effector-react';
 import { type ReactNode, useEffect } from 'react';
 
 import { type WalletFamily } from '@/shared/core';
 import { useI18n } from '@/shared/i18n';
 import { SearchInput, SmallTitleText } from '@/shared/ui';
+import { Popover } from '@/shared/ui-kit';
 import { type Callbacks, walletSelectModel } from '../model/wallet-select-model';
 
 import { WalletGroup } from './WalletGroup';
@@ -22,11 +22,11 @@ export const WalletPanel = ({ action, onClose }: Props) => {
   }, [onClose]);
 
   return (
-    <Popover.Panel className="absolute z-10 mt-2 overflow-hidden rounded-md border border-token-container-border bg-token-container-background shadow-card-shadow">
+    <Popover.Content>
       <section className="relative flex max-h-[700px] w-[300px] flex-col bg-card-background">
         <header className="flex items-center justify-between border-b border-divider px-5 py-3">
           <SmallTitleText>{t('wallets.title')}</SmallTitleText>
-          {action}
+          <div className="min-w-[140px]">{action}</div>
         </header>
 
         <div className="border-b border-divider p-2">
@@ -43,6 +43,6 @@ export const WalletPanel = ({ action, onClose }: Props) => {
           })}
         </div>
       </section>
-    </Popover.Panel>
+    </Popover.Content>
   );
 };
diff --git a/src/renderer/features/wallets/WalletSelect/ui/WalletSelect.tsx b/src/renderer/features/wallets/WalletSelect/ui/WalletSelect.tsx
index 889be55591..9c7fed60f6 100644
--- a/src/renderer/features/wallets/WalletSelect/ui/WalletSelect.tsx
+++ b/src/renderer/features/wallets/WalletSelect/ui/WalletSelect.tsx
@@ -1,8 +1,7 @@
-import { Popover, Transition } from '@headlessui/react';
 import { useUnit } from 'effector-react';
 import { type ReactNode } from 'react';
 
-import { Shimmering } from '@/shared/ui';
+import { Popover, Skeleton } from '@/shared/ui-kit';
 import { walletModel } from '@/entities/wallet';
 import { walletSelectModel } from '../model/wallet-select-model';
 
@@ -16,33 +15,13 @@ export const WalletSelect = ({ action }: Props) => {
   const activeWallet = useUnit(walletModel.$activeWallet);
 
   if (!activeWallet) {
-    return <Shimmering width={208} height={56} />;
+    return <Skeleton width={208} height={56} />;
   }
 
-  const hideWalletPanel = (close: () => void) => {
-    return () => {
-      close();
-      walletSelectModel.events.clearData();
-    };
-  };
-
   return (
-    <Popover className="relative">
-      {({ close }) => (
-        <>
-          <WalletButton wallet={activeWallet} />
-          <Transition
-            enter="transition ease-out duration-200"
-            enterFrom="opacity-0 translate-y-1"
-            enterTo="opacity-100 translate-y-0"
-            leave="transition ease-in duration-150"
-            leaveFrom="opacity-100 translate-y-0"
-            leaveTo="opacity-0 translate-y-1"
-          >
-            <WalletPanel action={action} onClose={hideWalletPanel(close)} />
-          </Transition>
-        </>
-      )}
+    <Popover>
+      <WalletButton wallet={activeWallet} />
+      <WalletPanel action={action} onClose={walletSelectModel.events.clearData} />
     </Popover>
   );
 };
diff --git a/src/renderer/pages/Staking/ui/Actions.tsx b/src/renderer/pages/Staking/ui/Actions.tsx
index 7f0b3eae89..46e03ff879 100644
--- a/src/renderer/pages/Staking/ui/Actions.tsx
+++ b/src/renderer/pages/Staking/ui/Actions.tsx
@@ -5,8 +5,8 @@ import { type Address, type Stake } from '@/shared/core';
 import { useI18n } from '@/shared/i18n';
 import { useToggle } from '@/shared/lib/hooks';
 import { toAccountId } from '@/shared/lib/utils';
-import { BaseModal, Button, DropdownButton, Icon, SmallTitleText } from '@/shared/ui';
-import { type ButtonDropdownOption } from '@/shared/ui/types';
+import { BaseModal, Button, Icon, SmallTitleText } from '@/shared/ui';
+import { Dropdown } from '@/shared/ui-kit';
 import { ControllerOperations, OperationOptions, StashOperations } from '../lib/constants';
 import { ControllerTypes, type Operations } from '../lib/types';
 
@@ -20,6 +20,7 @@ type Props = {
 export const Actions = ({ canInteract, stakes, isStakingLoading, onNavigate }: Props) => {
   const { t } = useI18n();
   const [isDialogOpen, toggleIsDialogOpen] = useToggle();
+  const [isActionsOpen, toggleIsActionsOpen] = useToggle();
 
   const [operation, setOperation] = useState<Operations>();
   const [warningMessage, setWarningMessage] = useState('');
@@ -122,29 +123,6 @@ export const Actions = ({ canInteract, stakes, isStakingLoading, onNavigate }: P
     }
   };
 
-  const getAvailableButtonOptions = (): ButtonDropdownOption[] => {
-    if (noStakes || wrongOverlaps) {
-      return [];
-    }
-
-    return Object.entries(operationsSummary).reduce<ButtonDropdownOption[]>((acc, [key, value]) => {
-      if (stakes.length === value) {
-        const typedKey = key as Operations;
-        const option = OperationOptions[typedKey];
-
-        acc.push({
-          id: key,
-          icon: option.icon,
-          //eslint-disable-next-line i18next/no-literal-string
-          title: t(`staking.actions.${option.icon}Label`),
-          onClick: () => onClickAction(typedKey, option.path),
-        });
-      }
-
-      return acc;
-    }, []);
-  };
-
   const getActionButtonText = (): string => {
     if (noStakes) {
       return t('staking.actions.selectAccPlaceholder');
@@ -160,12 +138,36 @@ export const Actions = ({ canInteract, stakes, isStakingLoading, onNavigate }: P
     <>
       <div className="flex items-center justify-between">
         <SmallTitleText>{t('staking.overview.actionsTitle')}</SmallTitleText>
-        <DropdownButton
-          className="h-8.5 min-w-[228px]"
-          title={getActionButtonText()}
-          disabled={isStakingLoading || noStakes || wrongOverlaps}
-          options={getAvailableButtonOptions()}
-        />
+        <div className="min-w-[228px]">
+          <Dropdown open={isActionsOpen} onToggle={toggleIsActionsOpen}>
+            <Dropdown.Trigger>
+              <Button
+                disabled={isStakingLoading || noStakes || wrongOverlaps}
+                className="h-8.5 w-full justify-center py-2"
+                suffixElement={<Icon name={isActionsOpen ? 'up' : 'down'} size={16} className="text-inherit" />}
+              >
+                {getActionButtonText()}
+              </Button>
+            </Dropdown.Trigger>
+            <Dropdown.Content>
+              {Object.entries(operationsSummary).map(([key, value]) => {
+                if (stakes.length !== value) return null;
+
+                const typedKey = key as Operations;
+                const option = OperationOptions[typedKey];
+
+                return (
+                  <Dropdown.Item key={key} onSelect={() => onClickAction(typedKey, option.path)}>
+                    <div className="flex w-full items-center gap-x-1.5">
+                      <Icon name={option.icon} size={20} className="shrink-0 text-icon-accent" />
+                      {t(option.title)}
+                    </div>
+                  </Dropdown.Item>
+                );
+              })}
+            </Dropdown.Content>
+          </Dropdown>
+        </div>
       </div>
 
       <BaseModal
diff --git a/src/renderer/shared/ui-kit/Box/Box.tsx b/src/renderer/shared/ui-kit/Box/Box.tsx
index 614d595d39..67013cae15 100644
--- a/src/renderer/shared/ui-kit/Box/Box.tsx
+++ b/src/renderer/shared/ui-kit/Box/Box.tsx
@@ -73,10 +73,11 @@ export const Box = forwardRef<HTMLDivElement, BoxProps>(
     ref,
   ) => {
     const calculatedPadding = useMemo(
-      () =>
-        Array.isArray(padding)
+      () => {
+        return Array.isArray(padding)
           ? padding.map(getBoxSize<CSS.Property.Padding>).join(' ')
-          : getBoxSize<CSS.Property.Padding>(padding),
+          : getBoxSize<CSS.Property.Padding>(padding);
+      },
       Array.isArray(padding) ? padding : [padding],
     );
 
diff --git a/src/renderer/shared/ui-kit/Dropdown/Dropdown.stories.tsx b/src/renderer/shared/ui-kit/Dropdown/Dropdown.stories.tsx
index 5c0559ae2f..f18995fd19 100644
--- a/src/renderer/shared/ui-kit/Dropdown/Dropdown.stories.tsx
+++ b/src/renderer/shared/ui-kit/Dropdown/Dropdown.stories.tsx
@@ -1,7 +1,7 @@
 import { type Meta, type StoryObj } from '@storybook/react';
 import { useState } from 'react';
 
-import { Button, Icon, Switch } from '@/shared/ui';
+import { Button, Switch } from '@/shared/ui';
 import { Box } from '../Box/Box';
 
 import { Dropdown } from './Dropdown';
@@ -19,13 +19,12 @@ const meta: Meta<typeof Dropdown> = {
           <Button>Trigger</Button>
         </Dropdown.Trigger>
         <Dropdown.Content>
-          <Dropdown.Item icon={<Icon name="rocket" size={16} />}>Item 1</Dropdown.Item>
+          <Dropdown.Item>Item 1</Dropdown.Item>
           <Dropdown.Item>Item 2</Dropdown.Item>
-          <Dropdown.Item>Item 3</Dropdown.Item>
           <Dropdown.Separator />
           <Dropdown.Group label="Section 2">
-            <Dropdown.CheckboxItem checked>Item 4</Dropdown.CheckboxItem>
-            <Dropdown.CheckboxItem checked>Item 5</Dropdown.CheckboxItem>
+            <Dropdown.CheckboxItem checked={true}>Item 4</Dropdown.CheckboxItem>
+            <Dropdown.CheckboxItem checked={true}>Item 5</Dropdown.CheckboxItem>
             <Dropdown.CheckboxItem checked={false}>Item 6</Dropdown.CheckboxItem>
           </Dropdown.Group>
         </Dropdown.Content>
diff --git a/src/renderer/shared/ui-kit/Dropdown/Dropdown.tsx b/src/renderer/shared/ui-kit/Dropdown/Dropdown.tsx
index 813e9a8175..d9b66f0c70 100644
--- a/src/renderer/shared/ui-kit/Dropdown/Dropdown.tsx
+++ b/src/renderer/shared/ui-kit/Dropdown/Dropdown.tsx
@@ -45,20 +45,24 @@ const Root = ({
 
   return (
     <Context.Provider value={ctx}>
-      <DropdownMenu.Root open={open} modal onOpenChange={onToggle}>
+      <DropdownMenu.Root modal open={open} onOpenChange={onToggle}>
         {children}
       </DropdownMenu.Root>
     </Context.Provider>
   );
 };
 
-const Trigger = ({ children }: PropsWithChildren) => <DropdownMenu.Trigger asChild>{children}</DropdownMenu.Trigger>;
+const Trigger = ({ children }: PropsWithChildren) => {
+  return <DropdownMenu.Trigger asChild>{children}</DropdownMenu.Trigger>;
+};
 
-const Separator = () => (
-  <DropdownMenu.Separator className="h-[1px] w-full px-2">
-    <div className="h-full w-full bg-divider" />
-  </DropdownMenu.Separator>
-);
+const Separator = () => {
+  return (
+    <DropdownMenu.Separator className="h-[1px] w-full px-2">
+      <div className="h-full w-full bg-divider" />
+    </DropdownMenu.Separator>
+  );
+};
 
 const Content = ({ children }: PropsWithChildren) => {
   const { portalContainer } = useTheme();
@@ -68,6 +72,7 @@ const Content = ({ children }: PropsWithChildren) => {
     <DropdownMenu.Portal container={portalContainer}>
       <DropdownMenu.Content
         loop
+        asChild
         avoidCollisions={false}
         side={side}
         align={align}
@@ -75,18 +80,17 @@ const Content = ({ children }: PropsWithChildren) => {
         alignOffset={alignOffset && gridSpaceConverter(alignOffset)}
         sideOffset={sideOffset && gridSpaceConverter(sideOffset)}
         data-testid={testId}
-        asChild
       >
         <Surface
           elevation={1}
           className={cnTw(
-            'min-w-20 overflow-hidden duration-100 animate-in fade-in zoom-in-95',
-            'h-max max-h-[--radix-popper-available-height] max-w-60',
             'flex flex-col',
+            'h-max max-h-[--radix-popper-available-height] max-w-60',
+            'min-w-20 overflow-hidden duration-100 animate-in fade-in zoom-in-95',
           )}
         >
           <ScrollArea>
-            <div className="flex flex-col gap-1 p-1">{children}</div>
+            <div className="flex flex-col gap-y-1 p-1">{children}</div>
           </ScrollArea>
         </Surface>
       </DropdownMenu.Content>
@@ -110,20 +114,18 @@ const Group = ({ label, children }: GroupProps) => {
 };
 
 type ItemProps = PropsWithChildren<{
-  icon?: ReactNode;
   onSelect?: VoidFunction;
 }>;
 
-const Item = ({ onSelect, icon, children }: ItemProps) => {
+const Item = ({ onSelect, children }: ItemProps) => {
   return (
     <DropdownMenu.Item
       className={cnTw(
-        'flex gap-2 rounded-md px-3 py-2 text-footnote text-text-secondary',
+        'flex rounded p-2 text-footnote text-text-secondary',
         'cursor-pointer bg-block-background-default hover:bg-block-background-hover',
       )}
       onSelect={onSelect}
     >
-      {icon ? <div className="text-icon-accent">{icon}</div> : null}
       {children}
     </DropdownMenu.Item>
   );
@@ -137,6 +139,7 @@ type CheckboxItemProps = PropsWithChildren<{
 
 const CheckboxItem = ({ checked, onChange, onSelect, children }: CheckboxItemProps) => {
   const { preventClosing } = useContext(Context);
+
   const handleSelect = (event: Event) => {
     if (preventClosing) {
       event.preventDefault();
@@ -164,7 +167,7 @@ const CheckboxItem = ({ checked, onChange, onSelect, children }: CheckboxItemPro
   );
 };
 
-const Dropdown = Object.assign(Root, {
+export const Dropdown = Object.assign(Root, {
   Trigger,
   Content,
   Item,
@@ -172,5 +175,3 @@ const Dropdown = Object.assign(Root, {
   Group,
   Separator,
 });
-
-export { Dropdown };
diff --git a/src/renderer/shared/ui-kit/Popover/Popover.tsx b/src/renderer/shared/ui-kit/Popover/Popover.tsx
index bc08a0331d..b138595102 100644
--- a/src/renderer/shared/ui-kit/Popover/Popover.tsx
+++ b/src/renderer/shared/ui-kit/Popover/Popover.tsx
@@ -67,6 +67,7 @@ const Content = ({ children }: PropsWithChildren) => {
   return (
     <RadixPopover.Portal container={portalContainer}>
       <RadixPopover.Content
+        asChild
         hideWhenDetached
         side={side}
         align={align}
@@ -74,10 +75,9 @@ const Content = ({ children }: PropsWithChildren) => {
         alignOffset={alignOffset && gridSpaceConverter(alignOffset)}
         sideOffset={sideOffset && gridSpaceConverter(sideOffset)}
         data-testid={testId}
-        asChild
         onClick={(e) => e.stopPropagation()}
       >
-        <div className="relative z-50 rounded-md border border-token-container-border bg-block-background-default text-body shadow-shadow-2 duration-100 animate-in fade-in zoom-in-95">
+        <div className="rounded-md border border-token-container-border bg-block-background-default text-body shadow-shadow-2 duration-100 animate-in fade-in zoom-in-95">
           {children}
         </div>
       </RadixPopover.Content>
diff --git a/src/renderer/shared/ui-kit/Skeleton/Skeleton.tsx b/src/renderer/shared/ui-kit/Skeleton/Skeleton.tsx
index 93b90522a2..e736088209 100644
--- a/src/renderer/shared/ui-kit/Skeleton/Skeleton.tsx
+++ b/src/renderer/shared/ui-kit/Skeleton/Skeleton.tsx
@@ -25,12 +25,20 @@ export const Skeleton = ({ width, height, circle, fullWidth, minWidth, active, c
   const formattedWidth = isNumber(width) ? `${gridSpaceConverter(width)}px` : width;
   const formattedHeight = isNumber(height) ? `${gridSpaceConverter(height)}px` : height;
 
-  if (children) {
-    if (!active) {
-      // eslint-disable-next-line react/jsx-no-useless-fragment
-      return <>{children}</>;
-    }
+  if (!children) {
+    return (
+      <span
+        className={cnTw('spektr-shimmer block h-full w-full', circle ? 'rounded-full' : 'rounded-2lg')}
+        style={{
+          width: formattedWidth,
+          height: circle ? formattedWidth : formattedHeight,
+          minWidth: formattedMinWidth,
+        }}
+      />
+    );
+  }
 
+  if (active) {
     return (
       <span
         className={cnTw('spektr-shimmer block h-fit rounded-2lg [&>*]:invisible', {
@@ -39,18 +47,11 @@ export const Skeleton = ({ width, height, circle, fullWidth, minWidth, active, c
         })}
         style={{ minWidth: formattedMinWidth }}
       >
-        {Children.map(children, (child) => {
-          return isString(child) ? <span>{child}</span> : child;
-        })}
+        {Children.map(children, (child) => (isString(child) ? <span>{child}</span> : child))}
       </span>
     );
   }
 
-  return (
-    <span
-      className={cnTw('spektr-shimmer block h-full w-full', circle ? 'rounded-full' : 'rounded-2lg')}
-      style={{ width: formattedWidth, height: circle ? formattedWidth : formattedHeight, minWidth: formattedMinWidth }}
-      data-testid="shimmer"
-    />
-  );
+  // eslint-disable-next-line react/jsx-no-useless-fragment
+  return <>{children}</>;
 };
diff --git a/src/renderer/shared/ui-kit/_helpers/gridSpaceConverter.ts b/src/renderer/shared/ui-kit/_helpers/gridSpaceConverter.ts
index 125164610d..5a4337bd5b 100644
--- a/src/renderer/shared/ui-kit/_helpers/gridSpaceConverter.ts
+++ b/src/renderer/shared/ui-kit/_helpers/gridSpaceConverter.ts
@@ -1,4 +1,4 @@
-export const gridSpaceConverter = (value: number) => {
+export const gridSpaceConverter = (value: number): number => {
   // We assume that default font size is 16px.
   // Grid step - 0.25em
   return (16 / 4) * value;
diff --git a/src/renderer/shared/ui-kit/index.ts b/src/renderer/shared/ui-kit/index.ts
index ebfe076c42..834f242fe7 100644
--- a/src/renderer/shared/ui-kit/index.ts
+++ b/src/renderer/shared/ui-kit/index.ts
@@ -3,6 +3,7 @@ export { useTheme } from './Theme/useTheme';
 
 export { ThemeProvider } from './Theme/ThemeProvider';
 export { ScrollArea } from './ScrollArea/ScrollArea';
+export { Checkbox } from './Checkbox/Checkbox';
 export { Dropdown } from './Dropdown/Dropdown';
 export { Skeleton } from './Skeleton/Skeleton';
 export { Carousel } from './Carousel/Carousel';
@@ -13,4 +14,3 @@ export { Slider } from './Slider/Slider';
 export { Label } from './Label/Label';
 export { Modal } from './Modal/Modal';
 export { Box } from './Box/Box';
-export { Checkbox } from './Checkbox/Checkbox';
diff --git a/src/renderer/shared/ui/Buttons/Button/Button.tsx b/src/renderer/shared/ui/Buttons/Button/Button.tsx
index 1edaa738ca..56f20a4cd1 100644
--- a/src/renderer/shared/ui/Buttons/Button/Button.tsx
+++ b/src/renderer/shared/ui/Buttons/Button/Button.tsx
@@ -43,6 +43,7 @@ export const Button = forwardRef<HTMLButtonElement, PropsWithChildren<Props>>(
       onPointerMove,
       onPointerLeave,
       testId = 'Button',
+      ...rest
     },
     ref,
   ) => (
@@ -66,6 +67,7 @@ export const Button = forwardRef<HTMLButtonElement, PropsWithChildren<Props>>(
       onPointerDown={(e) => !isLoading && onPointerDown(e)}
       onPointerMove={onPointerMove}
       onPointerLeave={onPointerLeave}
+      {...rest}
     >
       {isLoading && <Loader color="white" />}
       {prefixElement && <div data-testid="prefix">{prefixElement}</div>}
diff --git a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.stories.tsx b/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.stories.tsx
deleted file mode 100644
index b7a1555b58..0000000000
--- a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.stories.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { type Meta, type StoryFn } from '@storybook/react';
-
-import { type ButtonDropdownOption } from '../common/types';
-
-import { DropdownButton } from './DropdownButton';
-
-export default {
-  title: 'v1/ui/Dropdown Button',
-  component: DropdownButton,
-  parameters: { actions: { argTypesRegex: '^on.*' } },
-  decorators: [
-    (Story) => (
-      <div className="mt-28 w-[280px]">
-        <Story />
-      </div>
-    ),
-  ],
-} as Meta<typeof DropdownButton>;
-
-const Template: StoryFn<typeof DropdownButton> = (args) => <DropdownButton {...args} />;
-
-const options: ButtonDropdownOption[] = [
-  { id: 'button1', title: 'Button Option 1', icon: 'globe', onClick: () => alert('click1') },
-  { id: 'button2', title: 'Button Option 2', icon: 'up', onClick: () => alert('click2') },
-];
-
-export const Primary = Template.bind({});
-Primary.args = {
-  title: 'v1/ui/Action Dropdown',
-  options,
-};
-
-export const Disabled = Template.bind({});
-Disabled.args = {
-  title: 'v1/ui/Action Dropdown',
-  options,
-  disabled: true,
-};
diff --git a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.test.tsx b/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.test.tsx
deleted file mode 100644
index cd9399ec63..0000000000
--- a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.test.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import { act, render, screen, within } from '@testing-library/react';
-import noop from 'lodash/noop';
-
-import { type ButtonDropdownOption } from '../common/types';
-
-import { DropdownButton } from './DropdownButton';
-
-describe('ui/Dropdowns/DropdownButton', () => {
-  const options: ButtonDropdownOption[] = [
-    { id: '0', title: 'label_0', icon: 'globe', onClick: noop },
-    { id: '1', title: 'label_1', icon: 'globe', onClick: noop },
-  ];
-
-  test('should render component', () => {
-    render(<DropdownButton options={options} title="button" />);
-
-    const button = screen.getByRole('button');
-    expect(button).toBeInTheDocument();
-  });
-
-  test('should call onSelected', async () => {
-    const spySelected = jest.fn();
-    const optionsExtended: ButtonDropdownOption[] = [
-      ...options,
-      { id: '2', title: 'label_2', icon: 'globe', onClick: spySelected },
-    ];
-
-    render(<DropdownButton options={optionsExtended} title="button" />);
-
-    const button = screen.getByRole('button');
-    await act(() => button.click());
-
-    const option = screen.getAllByRole('menuitem')[2];
-    const optionButton = within(option).getByRole('button');
-
-    await act(() => optionButton.click());
-
-    expect(spySelected).toHaveBeenCalled();
-  });
-});
diff --git a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.tsx b/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.tsx
deleted file mode 100644
index dc2794d937..0000000000
--- a/src/renderer/shared/ui/Dropdowns/DropdownButton/DropdownButton.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import { Menu } from '@headlessui/react';
-import { type ComponentProps } from 'react';
-import { Link } from 'react-router-dom';
-
-import { cnTw } from '@/shared/lib/utils';
-import { Button } from '../../Buttons';
-import { Icon } from '../../Icon/Icon';
-import { type IconNames } from '../../Icon/data';
-import { FootnoteText } from '../../Typography';
-import { type ButtonDropdownOption } from '../common/types';
-
-type ButtonProps = ComponentProps<typeof Button>;
-
-type Props = {
-  title: string;
-  options: ButtonDropdownOption[];
-} & Omit<ButtonProps, 'children' | 'suffixElement' | 'onClick'>;
-
-export const DropdownButton = ({ options, title, disabled, className, ...buttonProps }: Props) => {
-  const { ref, ...restProps } = buttonProps;
-
-  return (
-    <Menu>
-      {({ open }) => (
-        <div className={cnTw('relative', open && 'z-10')}>
-          <Menu.Button
-            ref={ref}
-            as={Button}
-            disabled={disabled}
-            suffixElement={<Icon name={open ? 'up' : 'down'} size={16} className="text-inherit" />}
-            className={cnTw('justify-center', className)}
-            {...restProps}
-          >
-            {title}
-          </Menu.Button>
-          <Menu.Items
-            as="ul"
-            className={cnTw(
-              'absolute z-10 mt-1 w-full rounded border border-token-container-border p-1',
-              'bg-token-container-background shadow-card-shadow',
-            )}
-          >
-            {options.map((opt) => {
-              const iconComponent =
-                typeof opt.icon === 'string' ? (
-                  <Icon name={opt.icon as IconNames} size={20} className="text-icon-accent" />
-                ) : (
-                  opt.icon
-                );
-
-              return (
-                <Menu.Item
-                  as="li"
-                  key={opt.id}
-                  className="mb-0.5 rounded last:mb-0 hover:bg-action-background-hover ui-active:bg-action-background-hover"
-                >
-                  {/* TODO maybe try to refactor to avoid duplicating option children */}
-                  {/* FIXME: click from keyboard is ignored */}
-                  {'to' in opt ? (
-                    <Link to={opt.to} className="flex w-full items-center gap-x-1.5 p-2">
-                      {iconComponent}
-                      <FootnoteText className="text-text-secondary">{opt.title}</FootnoteText>
-                    </Link>
-                  ) : (
-                    <button className="flex w-full items-center gap-x-1.5 p-2" onClick={opt.onClick}>
-                      {iconComponent}
-                      <FootnoteText className="text-text-secondary">{opt.title}</FootnoteText>
-                    </button>
-                  )}
-                </Menu.Item>
-              );
-            })}
-          </Menu.Items>
-        </div>
-      )}
-    </Menu>
-  );
-};
diff --git a/src/renderer/shared/ui/Dropdowns/index.ts b/src/renderer/shared/ui/Dropdowns/index.ts
index 4598e79e00..5716e1a287 100644
--- a/src/renderer/shared/ui/Dropdowns/index.ts
+++ b/src/renderer/shared/ui/Dropdowns/index.ts
@@ -1,5 +1,4 @@
 export { Select } from './Select/Select';
 export { Combobox } from './Combobox/Combobox';
 export { MultiSelect } from './MultiSelect/MultiSelect';
-export { DropdownButton } from './DropdownButton/DropdownButton';
 export { DropdownIconButton } from './DropdownIconButton/DropdownIconButton';
diff --git a/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.test.tsx b/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.test.tsx
deleted file mode 100644
index 0addb188f3..0000000000
--- a/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.test.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { render, screen } from '@testing-library/react';
-
-import { MainLayout } from './MainLayout';
-
-jest.mock('react-router-dom', () => ({ Outlet: () => 'outlet' }));
-
-describe('shared/ui/Layouts/MainLayout', () => {
-  test('should render component', () => {
-    render(<MainLayout>children</MainLayout>);
-
-    const children = screen.getByText('children');
-    const outletComponent = screen.getByText('outlet');
-    expect(children).toBeInTheDocument();
-    expect(outletComponent).toBeInTheDocument();
-  });
-});
diff --git a/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.tsx b/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.tsx
deleted file mode 100644
index 4360c46f69..0000000000
--- a/src/renderer/shared/ui/Layouts/MainLayout/MainLayout.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { type PropsWithChildren } from 'react';
-import { Outlet } from 'react-router-dom';
-
-export const MainLayout = ({ children }: PropsWithChildren) => (
-  <div className="flex h-screen">
-    {children}
-    <main className="flex-1 bg-main-app-background">
-      <Outlet />
-    </main>
-  </div>
-);
diff --git a/src/renderer/shared/ui/index.ts b/src/renderer/shared/ui/index.ts
index ca0a63e3b5..5df7343d31 100644
--- a/src/renderer/shared/ui/index.ts
+++ b/src/renderer/shared/ui/index.ts
@@ -2,7 +2,7 @@ export { Button, ButtonCard, ButtonLink, ButtonWebLink, IconButton } from './But
 
 export { BaseModal, ConfirmModal, StatusModal } from './Modals';
 
-export { Select, Combobox, MultiSelect, DropdownButton, DropdownIconButton } from './Dropdowns';
+export { Select, Combobox, MultiSelect, DropdownIconButton } from './Dropdowns';
 
 export { Popover, Tooltip, MenuPopover, useParentScrollLock } from './Popovers';
 
@@ -45,7 +45,6 @@ export { Header } from './Header/Header';
 export { ExplorerLink } from './ExplorerLink/ExplorerLink';
 export { ContextMenu } from './ContextMenu/ContextMenu';
 export { LabelHelpBox } from './LabelHelpbox/LabelHelpBox';
-export { MainLayout } from './Layouts/MainLayout/MainLayout';
 export { Truncate } from './Truncate/Truncate';
 export { Countdown } from './Countdown/Countdown';
 export { Tabs } from './Tabs/Tabs';
diff --git a/src/renderer/widgets/Layout/index.ts b/src/renderer/widgets/Layout/index.ts
deleted file mode 100644
index 905e368804..0000000000
--- a/src/renderer/widgets/Layout/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { MainLayout } from './ui/MainLayout';
diff --git a/src/renderer/widgets/Layout/ui/MainLayout.tsx b/src/renderer/widgets/Layout/ui/MainLayout.tsx
deleted file mode 100644
index e60a979355..0000000000
--- a/src/renderer/widgets/Layout/ui/MainLayout.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { Outlet } from 'react-router-dom';
-
-import { Navigation } from '@/features/navigation';
-import { SelectWalletPairing, WalletSelect } from '@/features/wallets';
-
-export const MainLayout = () => (
-  <div className="flex h-screen animate-in fade-in">
-    <aside className="z-20 flex w-[240px] shrink-0 flex-col gap-y-6 border-r border-r-container-border bg-left-navigation-menu-background p-4">
-      <WalletSelect action={<SelectWalletPairing />} />
-      <Navigation />
-    </aside>
-    <main className="flex-1 bg-main-app-background">
-      <Outlet />
-    </main>
-  </div>
-);