fix: remove old hand logo in two places

apps/portal/src/components/recipes/ErrorMessage.tsx

@@ -1,7 +1,7 @@
 import type { DetailedHTMLProps, HTMLAttributes, ReactNode } from 'react'
 import { Text } from '@talismn/ui/atoms/Text'
 
-import { TalismanHand } from '@/components/molecules/TalismanHand'
+import { cn } from '@/util/cn'
 
 export type ErrorMessageProps = {
   title: ReactNode
@@ -19,9 +19,11 @@ export const ErrorMessage = Object.assign(
       ]}
     >
       <figure css={{ margin: 0 }}>
-        <TalismanHand
-          width={props.orientation === 'horizontal' ? '6rem' : '10rem'}
-          height={props.orientation === 'horizontal' ? '6rem' : '10rem'}
+        <TalismanDeadHandIcon
+          className={cn(
+            'text-[20rem] text-red-500',
+            props.orientation === 'horizontal' ? 'text-[6rem]' : 'text-[10rem]'
+          )}
         />
       </figure>
       <div
@@ -48,3 +50,16 @@ export const ErrorMessage = Object.assign(
     ),
   }
 )
+
+function TalismanDeadHandIcon({ className }: { className?: string }) {
+  return (
+    <svg className={className} width="1em" height="1em" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        stroke="none"
+        d="M 25.349728 54.346054 C 27.378103 55.318001 29.407148 56.290253 31.502325 57.005775 L 35.786789 58.469055 C 43.06493 60.762207 50.24847 59.834999 57.299564 57.639862 C 60.966396 55.80056 64.752762 56.091606 68.504379 57.639862 C 75.92411 60.702103 82.388115 60.694855 90.248535 58.5233 L 90.257065 58.469055 L 94.541412 57.005775 C 96.636337 56.290253 98.665443 55.318001 100.693939 54.346054 C 106.28389 51.667564 114.987282 52.49865 120.865524 59.200912 C 123.559616 62.273216 121.475052 66.718475 117.596642 68.004562 C 115.726631 68.625061 114.032761 69.675278 112.449219 70.848602 C 112.27002 70.981483 112.087776 71.114365 111.903091 71.246628 C 107.018356 74.751999 103.875046 80.002434 103.562363 86.006248 L 103.4179 88.776535 C 103.428268 89.745064 103.409363 90.717865 103.35878 91.691879 C 101.930061 105.361069 93.111465 117.141937 80.398628 122.364952 C 69.295547 126.926628 56.841137 126.926628 45.737751 122.364952 C 33.02528 117.141937 24.206812 105.361069 22.777721 91.691879 L 22.481615 86.006248 C 22.168869 80.002434 19.025616 74.751999 14.141013 71.246628 C 13.956144 71.114365 13.773714 70.981483 13.594332 70.848602 C 12.011093 69.675278 10.317348 68.625061 8.447146 68.004562 C 4.568655 66.718475 2.483895 62.273216 5.178228 59.200912 C 11.056335 52.49865 19.759726 51.667564 25.349728 54.346054 Z M 91.664459 91.440155 C 91.664459 91.440155 78.840073 109.872757 63.020496 109.872757 C 47.201092 109.872757 34.3769 91.440155 34.3769 91.440155 C 34.3769 91.440155 47.201092 73.007538 63.020496 73.007538 C 78.840073 73.007538 91.664459 91.440155 91.664459 91.440155 Z M 63.143021 95.726746 L 70.559158 103.142853 L 74 99.701828 L 66.584114 92.285721 L 74 84.869598 L 70.559158 81.428574 L 63.143021 88.844681 L 55.726807 81.428574 L 52.285713 84.869598 L 59.701946 92.285721 L 52.285713 99.701828 L 55.726807 103.142853 L 63.143021 95.726746 Z M 27.99049 51.479645 L 28.580633 28.829681 C 28.580633 16.54509 35.76844 10.459549 46.165638 13.541481 C 47.079861 13.812477 48.393139 15.04348 48.393139 16.135857 L 48.604465 38.283516 C 48.615376 39.430885 49.548618 40.355225 50.695988 40.355225 C 51.851154 40.355225 52.787624 39.418755 52.787624 38.263588 L 52.787624 11.044266 C 52.787624 5.277542 57.46249 0.602676 63.228947 0.602676 C 68.995659 0.602676 73.670708 5.277527 73.670708 11.044266 L 73.670708 38.263588 C 73.670708 39.418755 74.606934 40.355225 75.762589 40.355225 C 76.909714 40.355225 77.842896 39.430885 77.853867 38.283577 L 78.065369 16.148048 C 78.065369 15.045853 79.444115 13.810951 80.366318 13.541481 C 89.377525 10.908279 97.657295 15.82061 97.657295 28.590141 L 98.229645 51.269608 C 88.521141 56.225098 79.180191 57.245316 68.469032 53.916214 C 64.382172 51.912163 61.437565 52.265503 57.225811 53.913963 C 46.604252 56.300064 37.572994 56.407524 27.99049 51.479645 Z"
+      />
+    </svg>
+  )
+}

apps/portal/src/components/recipes/StakeTargetSelectorItem.tsx

@@ -3,7 +3,9 @@ import { Button } from '@talismn/ui/atoms/Button'
 import { useSurfaceColor, useSurfaceColorAtElevation } from '@talismn/ui/atoms/Surface'
 import { Text } from '@talismn/ui/atoms/Text'
 import { Tooltip } from '@talismn/ui/atoms/Tooltip'
-import { ExternalLink, TalismanHand, User } from '@talismn/web-icons'
+import { ExternalLink, User } from '@talismn/web-icons'
+
+import Logo from '@/assets/logo.svg?react'
 
 export type StakeTargetSelectorItemProps = {
   selected?: boolean
@@ -118,7 +120,7 @@ export const StakeTargetSelectorItem = (props: StakeTargetSelectorItemProps) =>
         </Tooltip>
         {props.talismanRecommended && (
           <Tooltip content={props.talismanRecommendedDescription}>
-            <TalismanHand size="1.4rem" />
+            <Logo className="h-[1em] w-[1em]" />
           </Tooltip>
         )}
       </Text.Body>

apps/portal/src/components/widgets/AccountsManagementMenu.tsx

@@ -8,10 +8,11 @@ import { IconButton } from '@talismn/ui/atoms/IconButton'
 import { Text } from '@talismn/ui/atoms/Text'
 import { Tooltip } from '@talismn/ui/atoms/Tooltip'
 import { Menu } from '@talismn/ui/molecules/Menu'
-import { Copy, Ethereum, Eye, EyePlus, TalismanHand, Trash2, Users, Wallet, X } from '@talismn/web-icons'
+import { Copy, Ethereum, Eye, EyePlus, Trash2, Users, Wallet, X } from '@talismn/web-icons'
 import { useMemo } from 'react'
 import { useRecoilValue, useRecoilValueLoadable, useResetRecoilState, useSetRecoilState } from 'recoil'
 
+import Logo from '@/assets/logo.svg?react'
 import { AccountIcon } from '@/components/molecules/AccountIcon'
 import { AddReadOnlyAccountDialog } from '@/components/widgets/AddReadOnlyAccountDialog'
 import { AnimatedFiatNumber } from '@/components/widgets/AnimatedFiatNumber'
@@ -165,8 +166,9 @@ export const AccountsManagementMenu = Object.assign(
                     padding: '0 1.6rem',
                   }}
                 >
-                  <div>
-                    <TalismanHand size="1em" /> My accounts
+                  <div className="flex items-center gap-2">
+                    <Logo className="h-[1em] w-[1em]" />
+                    <span>My accounts</span>
                   </div>
                   <IconButton size="2rem" onClick={toggleOpen}>
                     <X />

packages/icons/src/components/index.ts

@@ -242,7 +242,6 @@ export { default as Sunrise } from './Sunrise'
 export { default as Sunset } from './Sunset'
 export { default as Tablet } from './Tablet'
 export { default as Tag } from './Tag'
-export { default as TalismanHand } from './TalismanHand'
 export { default as Target } from './Target'
 export { default as Terminal } from './Terminal'
 export { default as Thermometer } from './Thermometer'

packages/ui/src/atoms/Button.stories.tsx

@@ -1,5 +1,5 @@
 import { type Meta, type StoryObj } from '@storybook/react'
-import { TalismanHand } from '@talismn/web-icons'
+import { Zap } from '@talismn/web-icons'
 
 import { Button } from './Button'
 import { Surface as SurfaceContainer } from './Surface'
@@ -31,19 +31,19 @@ export default {
 type Story = StoryObj<typeof Button>
 
 export const Primary: Story = {
-  args: { children: 'Click me', leadingIcon: <TalismanHand />, trailingIcon: <TalismanHand /> },
+  args: { children: 'Click me', leadingIcon: <Zap />, trailingIcon: <Zap /> },
 }
 
 export const Outlined: Story = {
-  args: { variant: 'outlined', children: 'Click me', leadingIcon: <TalismanHand />, trailingIcon: <TalismanHand /> },
+  args: { variant: 'outlined', children: 'Click me', leadingIcon: <Zap />, trailingIcon: <Zap /> },
 }
 
 export const Tonal: Story = {
   args: { variant: 'tonal', children: 'Click me' },
 }
 
 export const Text: Story = {
-  args: { variant: 'text', children: 'Click me', leadingIcon: <TalismanHand />, trailingIcon: <TalismanHand /> },
+  args: { variant: 'text', children: 'Click me', leadingIcon: <Zap />, trailingIcon: <Zap /> },
 }
 
 export const Surface: Story = {
@@ -55,5 +55,5 @@ export const Surface: Story = {
       </SurfaceContainer>
     </SurfaceContainer>
   ),
-  args: { variant: 'surface', children: 'Click me', leadingIcon: <TalismanHand />, trailingIcon: <TalismanHand /> },
+  args: { variant: 'surface', children: 'Click me', leadingIcon: <Zap />, trailingIcon: <Zap /> },
 }

packages/ui/src/atoms/Icon.stories.tsx

@@ -1,5 +1,5 @@
 import { type ComponentMeta, type Story } from '@storybook/react'
-import { TalismanHand } from '@talismn/web-icons'
+import { Zap } from '@talismn/web-icons'
 
 import type { IconProps } from './Icon'
 import { Icon, TonalIcon } from './Icon'
@@ -15,7 +15,7 @@ export default {
 export const Default: Story<IconProps<'button'>> = args => <Icon {...args} />
 
 Default.args = {
-  children: <TalismanHand />,
+  children: <Zap />,
 }
 
 export const Tonal: Story<IconProps<'button'>> = args => <TonalIcon {...args} />

packages/ui/src/atoms/IconButton.stories.tsx

@@ -1,5 +1,5 @@
 import { type ComponentMeta, type Story } from '@storybook/react'
-import { TalismanHand } from '@talismn/web-icons'
+import { Zap } from '@talismn/web-icons'
 
 import type { IconButtonProps } from './IconButton'
 import { IconButton } from './IconButton'
@@ -15,5 +15,5 @@ export default {
 export const Default: Story<IconButtonProps<'button'>> = (args: IconButtonProps) => <IconButton {...args} />
 
 Default.args = {
-  children: <TalismanHand />,
+  children: <Zap />,
 }

packages/ui/src/theme.stories.tsx

@@ -1,5 +1,5 @@
 import { type ComponentMeta, type Story } from '@storybook/react'
-import { TalismanHand } from '@talismn/web-icons'
+import { Zap } from '@talismn/web-icons'
 import { type JSXElementConstructor } from 'react'
 
 import type { Theme } from './theme'
@@ -47,7 +47,7 @@ export const DarkGreen: Story<Props> = args => {
                       margin: 0,
                     }}
                   >
-                    <TalismanHand css={{ color: contentColor }} />
+                    <Zap css={{ color: contentColor }} />
                   </figure>
                   <Text.H4>{key}</Text.H4>
                   <Text.BodyLarge>{value}</Text.BodyLarge>