pl-fe: don't assume everything that looks like a crypto address is a crypto address

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>

packages/pl-api/lib/request.ts

@@ -70,7 +70,6 @@ const getAsyncRefreshHeader = (response: Pick<Response, 'headers'>): AsyncRefres
   return null;
 };
 
-
 interface RequestBody<Params = Record<string, any>> {
   method?: 'GET' | 'POST' | 'PATCH' | 'PUT' | 'DELETE';
   body?: any;

packages/pl-fe/src/components/account-hover-card.tsx

@@ -80,7 +80,6 @@ const AccountHoverCard: React.FC<IAccountHoverCard> = ({ visible = true }) => {
     };
   }, []);
 
-
   const { x, y, strategy, refs, context, placement } = useFloating({
     open: !!account,
     elements: {

packages/pl-fe/src/features/crypto-donate/components/crypto-address.tsx

@@ -5,11 +5,12 @@ import HStack from 'pl-fe/components/ui/hstack';
 import Icon from 'pl-fe/components/ui/icon';
 import Stack from 'pl-fe/components/ui/stack';
 import Text from 'pl-fe/components/ui/text';
-import { CryptoIcon } from 'pl-fe/features/ui/util/async-components';
 import { useModalsActions } from 'pl-fe/stores/modals';
 
 import { getTitle } from '../utils/coin-db';
 
+import CryptoIcon from './crypto-icon';
+
 interface ICryptoAddress {
   address: string;
   ticker: string;

packages/pl-fe/src/features/crypto-donate/components/detailed-crypto-address.tsx

@@ -2,10 +2,11 @@ import { QRCodeCanvas as QRCode } from 'qrcode.react';
 import React from 'react';
 
 import CopyableInput from 'pl-fe/components/copyable-input';
-import { CryptoIcon } from 'pl-fe/features/ui/util/async-components';
 
 import { getTitle } from '../utils/coin-db';
 
+import CryptoIcon from './crypto-icon';
+
 interface IDetailedCryptoAddress {
   address: string;
   ticker: string;

packages/pl-fe/src/features/ui/components/panels/profile-fields-panel.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import Stack from 'pl-fe/components/ui/stack';
 import Widget from 'pl-fe/components/ui/widget';
 
-import ProfileField from '../profile-field';
+import { ProfileField } from '../../util/async-components';
 
 import type { Account } from 'pl-api';
 

packages/pl-fe/src/features/ui/components/panels/profile-info-panel.tsx

@@ -17,8 +17,8 @@ import { usePlFeConfig } from 'pl-fe/hooks/use-pl-fe-config';
 import { accountScrobbleQueryOptions } from 'pl-fe/queries/accounts/account-scrobble';
 import { capitalize } from 'pl-fe/utils/strings';
 
+import { ProfileField } from '../../util/async-components';
 import ProfileFamiliarFollowers from '../profile-familiar-followers';
-import ProfileField from '../profile-field';
 import ProfileStats from '../profile-stats';
 
 import type { Account } from 'pl-api';

packages/pl-fe/src/features/ui/components/profile-field.tsx

@@ -7,14 +7,19 @@ import Markup from 'pl-fe/components/markup';
 import { ParsedContent } from 'pl-fe/components/parsed-content';
 import HStack from 'pl-fe/components/ui/hstack';
 import Icon from 'pl-fe/components/ui/icon';
+import CryptoAddress from 'pl-fe/features/crypto-donate/components/crypto-address';
+import LightningAddress from 'pl-fe/features/crypto-donate/components/lightning-address';
+import coinDB from 'pl-fe/features/crypto-donate/utils/manifest-map';
 import Emojify from 'pl-fe/features/emoji/emojify';
-import { CryptoAddress, LightningAddress } from 'pl-fe/features/ui/util/async-components';
 import { unescapeHTML } from 'pl-fe/utils/html';
 
 import type { Account } from 'pl-api';
 
 const getTicker = (value: string): string => (value.match(/\$([a-zA-Z]*)/i) || [])[1];
-const isTicker = (value: string): boolean => Boolean(getTicker(value));
+const isTicker = (value: string): boolean => {
+  const ticker = getTicker(value);
+  return Boolean(ticker) && Boolean(coinDB[ticker.toLowerCase()]);
+};
 const isZapEmoji = (value: string) => /^\u26A1[\uFE00-\uFE0F]?$/.test(value);
 
 const isTimezoneLabel = (value: string) => /^time( |)zone$/i.test(value);
@@ -49,7 +54,7 @@ const ProfileField: React.FC<IProfileField> = ({ accountId, field, emojis }) =>
         address={unescapeHTML(field.value)}
       />
     );
-  } else if (isZapEmoji(field.name)) {
+  } else if (isZapEmoji(field.name) && field.value.includes('@')) {
     return <LightningAddress address={unescapeHTML(field.value)} />;
   }
 

packages/pl-fe/src/features/ui/util/async-components.ts

@@ -125,15 +125,13 @@ export const Audio = lazy(() => import('pl-fe/features/audio'));
 export const ChatWidget = lazy(() => import('pl-fe/features/chats/components/chat-widget/chat-widget'));
 export const ComposeEditor = lazy(() => import('pl-fe/features/compose/editor'));
 export const ComposeForm = lazy(() => import('pl-fe/features/compose/components/compose-form'));
-export const CryptoAddress = lazy(() => import('pl-fe/features/crypto-donate/components/crypto-address'));
-export const CryptoIcon = lazy(() => import('pl-fe/features/crypto-donate/components/crypto-icon'));
 export const DatePicker = lazy(() => import('pl-fe/features/birthdays/date-picker'));
 export const DropdownNavigation = lazy(() => import('pl-fe/components/dropdown-navigation'));
 export const EmojiPicker = lazy(() => import('pl-fe/features/emoji/components/emoji-picker'));
 export const EventHeader = lazy(() => import('pl-fe/features/event/components/event-header'));
-export const LightningAddress = lazy(() => import('pl-fe/features/crypto-donate/components/lightning-address'));
 export const MfaForm = lazy(() => import('pl-fe/features/security/mfa-form'));
 export const ModalRoot = lazy(() => import('pl-fe/features/ui/components/modal-root'));
+export const ProfileField = lazy(() => import('pl-fe/features/ui/components/profile-field'));
 export const AccountHoverCard = lazy(() => import('pl-fe/components/account-hover-card'));
 export const StatusHoverCard = lazy(() => import('pl-fe/components/status-hover-card'));
 export const Video = lazy(() => import('pl-fe/features/video'));

packages/pl-fe/src/features/video/index.tsx

@@ -240,7 +240,6 @@ const Video: React.FC<IVideo> = ({
     e.stopPropagation();
   };
 
-
   const handleMouseMove = useCallback(throttle(e => {
     if (seek.current && video.current) {
       const { x } = getPointerPosition(seek.current, e);

packages/pl-fe/src/hooks/forms/use-image-field.ts

@@ -3,7 +3,6 @@ import { useState } from 'react';
 import { useSettings } from 'pl-fe/stores/settings';
 import resizeImage from 'pl-fe/utils/resize-image';
 
-
 import { usePreview } from './use-preview';
 
 interface UseImageFieldOpts {

packages/pl-fe/src/modals/list-editor-modal/index.tsx

@@ -19,7 +19,6 @@ const ListEditorModal: React.FC<BaseModalProps & ListEditorModalProps> = ({ list
 
   const { isFetched } = useList(listId);
 
-
   const onClickClose = () => {
     onClose('LIST_EDITOR');
   };

packages/pl-fe/src/pages/dashboard/user-index.tsx

@@ -13,7 +13,6 @@ const messages = defineMessages({
   heading: { id: 'column.admin.users', defaultMessage: 'Users' },
 });
 
-
 const UserIndexPage: React.FC = () => {
   const [params] = useSearchParams();
   const query = params.get('q') || '';

packages/pl-fe/src/queries/admin/use-accounts.ts

@@ -1,6 +1,5 @@
 import { InfiniteData, useInfiniteQuery, useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 
-
 import { importEntities } from 'pl-fe/actions/importer';
 import { useAccount } from 'pl-fe/api/hooks/accounts/use-account';
 import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
@@ -14,7 +13,6 @@ import { minifyAdminAccount, minifyAdminAccountList } from '../utils/minify-list
 
 import type { AdminPerformAccountActionParams, PaginatedResponse, AdminAccount, AdminGetAccountsParams, PaginationParams, AdminAccountAction } from 'pl-api';
 
-
 const useAdminAccounts = makePaginatedResponseQuery(
   (params: Omit<AdminGetAccountsParams, keyof PaginationParams>) => ['admin', 'accountLists', params],
   (client, [params]) => client.admin.accounts.getAccounts(params).then(minifyAdminAccountList),