[issue-898] Fix browser search - bookmark and update language key 'al…

…l account' in staking detail

ios/Podfile.lock

@@ -389,7 +389,7 @@ PODS:
     - React-Core
   - react-native-view-shot (3.7.0):
     - React-Core
-  - react-native-webview (11.26.1):
+  - react-native-webview (13.2.3):
     - React-Core
   - React-perflogger (0.71.12)
   - React-RCTActionSheet (0.71.12):
@@ -878,7 +878,7 @@ SPEC CHECKSUMS:
   react-native-version-number: b415bbec6a13f2df62bf978e85bc0d699462f37f
   react-native-video: c26780b224543c62d5e1b2a7244a5cd1b50e8253
   react-native-view-shot: f5507655f122e6b104888a11130f267a427f0d57
-  react-native-webview: 9f111dfbcfc826084d6c507f569e5e03342ee1c1
+  react-native-webview: b85dfe0bf95bef83e82fc354d6987c80fed5e7ad
   React-perflogger: 75b0e25075c67565a830985f3c373e2eae5389e0
   React-RCTActionSheet: a0c3e916b327e297d124d9ebe8b0c721840ee04d
   React-RCTAnimation: 3da7025801d7bf0f8cfd94574d6278d5b82a8b88

package.json

@@ -116,7 +116,7 @@
     "react-native-version-number": "^0.3.6",
     "react-native-video": "^5.2.1",
     "react-native-view-shot": "^3.5.0",
-    "react-native-webview": "^11.26.1",
+    "react-native-webview": "^13.2.3",
     "react-redux": "^8.0.5",
     "redux-persist": "^6.0.0",
     "redux-thunk": "^2.4.2",

src/components/Browser/BrowserItem.tsx

@@ -1,5 +1,5 @@
 import { StyleProp, TouchableOpacity, View, ViewStyle } from 'react-native';
-import React from 'react';
+import React, { useCallback, useState } from 'react';
 import { Button, Icon, Image, Tag, Typography } from 'components/design-system-ui';
 import { Star } from 'phosphor-react-native';
 import { useSubWalletTheme } from 'hooks/useSubWalletTheme';
@@ -9,6 +9,7 @@ import { StoredSiteInfo } from 'stores/types';
 import { addBookmark, removeBookmark } from 'stores/updater';
 import createStylesheet from './styles/BrowserItem';
 import { predefinedDApps } from '../../predefined/dAppSites';
+import { getHostName, searchDomain } from 'utils/browser';
 
 interface Props {
   logo?: string;
@@ -25,6 +26,7 @@ function isSiteBookmark(url: string, bookmarks: StoredSiteInfo[]) {
 }
 
 export const BrowserItem = ({ logo, title, url, style, onPress, subtitle, tags }: Props) => {
+  const [image, setImage] = useState(logo || `https://${getHostName(url)}/favicon.ico`);
   const theme = useSubWalletTheme().swThemes;
   const stylesheet = createStylesheet(theme);
 
@@ -54,11 +56,19 @@ export const BrowserItem = ({ logo, title, url, style, onPress, subtitle, tags }
     );
   };
 
+  const onLoadImageError = useCallback(() => {
+    if (image.includes('avicon.ico')) {
+      setImage(`https://${getHostName(url)}/favicon.png`);
+      return;
+    }
+    setImage(assetLogoMap.default);
+  }, [assetLogoMap.default, image, url]);
+
   return (
     <View style={[stylesheet.container, style]}>
       <TouchableOpacity onPress={onPress} style={stylesheet.contentWrapper}>
         <View style={stylesheet.logoWrapper}>
-          <Image src={logo || assetLogoMap.default} style={stylesheet.logo} shape={'squircle'} squircleSize={44} />
+          <Image src={image} onError={onLoadImageError} style={stylesheet.logo} shape={'squircle'} squircleSize={44} />
         </View>
         <View style={stylesheet.textContentWrapper}>
           <View style={stylesheet.textContentLine1}>
@@ -75,19 +85,21 @@ export const BrowserItem = ({ logo, title, url, style, onPress, subtitle, tags }
         </View>
       </TouchableOpacity>
 
-      <Button
-        size={'xs'}
-        type={'ghost'}
-        icon={
-          <Icon
-            size={'sm'}
-            weight={_isSiteBookmark ? 'fill' : undefined}
-            iconColor={_isSiteBookmark ? theme.colorTextLight1 : theme.colorTextLight4}
-            phosphorIcon={Star}
-          />
-        }
-        onPress={onPressStar}
-      />
+      {!url.startsWith(`https://${searchDomain}`) && (
+        <Button
+          size={'xs'}
+          type={'ghost'}
+          icon={
+            <Icon
+              size={'sm'}
+              weight={_isSiteBookmark ? 'fill' : undefined}
+              iconColor={_isSiteBookmark ? theme.colorTextLight1 : theme.colorTextLight4}
+              phosphorIcon={Star}
+            />
+          }
+          onPress={onPressStar}
+        />
+      )}
     </View>
   );
 };

src/components/Search.tsx

@@ -49,6 +49,7 @@ export const Search = (searchProps: Props) => {
     placeholder,
     isShowFilterBtn,
     onPressFilterBtn,
+    ...restProps
   } = searchProps;
   const theme = useSubWalletTheme().swThemes;
 
@@ -81,6 +82,7 @@ export const Search = (searchProps: Props) => {
           placeholderTextColor={theme.colorTextTertiary}
           value={searchText}
           onSubmitEditing={onSubmitEditing}
+          {...restProps}
         />
         {!!searchText && (
           <Button

src/predefined/dAppSites.ts

@@ -179,8 +179,8 @@ export const predefinedDApps: PredefinedDApps = {
     {
       name: 'ArtZero.io - NFT Marketplace for Aleph Zero Blockchain',
       icon: 'https://dotinsights.subwallet.app/assets/images/projects/artzero.png',
-      id: 'alephzero.artzero.io',
-      url: 'https://alephzero.artzero.io',
+      id: 'https://a0.artzero.io',
+      url: 'https://a0.artzero.io',
       categories: ['defi'],
       isSupportSubstrateAccount: true,
       isSupportEthereumAccount: false,
@@ -709,13 +709,22 @@ export const predefinedDApps: PredefinedDApps = {
     },
     {
       name: 'InkWhale.net - Staking and Yield Farming Platform on Aleph Zero',
-      icon: 'https://inkwhale.net/apple-touch-icon.png',
+      icon: 'https://www.inkwhale.net/apple-touch-icon.png',
       id: 'inkwhale.net',
       url: 'https://inkwhale.net',
       categories: ['defi'],
       isSupportSubstrateAccount: false,
       isSupportEthereumAccount: false,
     },
+    {
+      name: 'a0.inkwhale.net - Staking and Yield Farming Platform on Aleph Zero',
+      icon: 'https://www.inkwhale.net/apple-touch-icon.png',
+      id: 'a0.inkwhale.net',
+      url: 'https://a0.inkwhale.net',
+      categories: ['defi'],
+      isSupportSubstrateAccount: true,
+      isSupportEthereumAccount: false,
+    },
     {
       name: 'Kanaria',
       icon: 'https://dotinsights.subwallet.app/assets/images/projects/kanaria.png',

src/routes/index.ts

@@ -49,7 +49,7 @@ export type RootStackParamList = {
   PinCode: { screen: 'NewPinCode' | 'ChangePinCode' | 'TurnoffPinCode' };
   AccountExport: { address: string };
   ExportJson: { address: string };
-  BrowserHome: NavigatorScreenParams<{}>;
+  BrowserHome?: NavigatorScreenParams<undefined> | undefined;
   BrowserSearch: { isOpenNewTab: boolean } | undefined;
   BrowserTabsManager: { url?: string; name?: string; isOpenTabs?: boolean };
   BrowserListByTabview: { type: string };

src/screens/Account/ImportSecretPhrase/index.tsx

@@ -158,6 +158,7 @@ export const ImportSecretPhrase = () => {
             errorMessages={formState.errors.seed}
             placeholderTextColor={theme.colorTextTertiary}
             placeholder={i18n.placeholder.seedPhrase}
+            autoCapitalize="none"
           />
 
           <SelectAccountType

src/screens/Home/Browser/BrowserHome.tsx

@@ -102,6 +102,7 @@ const BrowserHome = () => {
     return (
       <IconItem
         data={data}
+        url={item.url}
         onPress={() => navigation.navigate('BrowserTabsManager', { url: item.url, name: data?.name })}
       />
     );
@@ -111,6 +112,7 @@ const BrowserHome = () => {
     return (
       <IconItem
         data={data}
+        url={item.url}
         defaultData={item}
         onPress={() =>
           navigation.navigate('BrowserTabsManager', { url: data?.url || item.url, name: data?.name || item.name })

src/screens/Home/Browser/BrowserListByCategory.tsx

@@ -47,13 +47,17 @@ const BrowserListByCategory: React.FC<NativeStackScreenProps<RootStackParamList>
         }
 
         // if bookmarked item is not a pre-defined dapp or a webpage
-        return {
-          name: bookmarkedItem.name,
-          id: bookmarkedItem.id,
-          url: bookmarkedItem.url,
-          icon: '',
-          categories: [],
-        };
+        if (route.name === 'all') {
+          return {
+            name: bookmarkedItem.name,
+            id: bookmarkedItem.id,
+            url: bookmarkedItem.url,
+            icon: '',
+            categories: [],
+          };
+        }
+
+        return undefined;
       });
       return bookmarkedData.filter(item => item !== undefined) as DAppInfo[];
     }

src/screens/Home/Browser/BrowserOptionModal.tsx

@@ -8,6 +8,7 @@ import { addBookmark, removeBookmark } from 'stores/updater';
 import i18n from 'utils/i18n/i18n';
 import { useSubWalletTheme } from 'hooks/useSubWalletTheme';
 import { SelectItem, SwModal } from 'components/design-system-ui';
+import { searchDomain } from 'utils/browser';
 
 interface Props {
   visibleModal: boolean;
@@ -86,6 +87,7 @@ const Component = ({ visibleModal, onClose }: Props, ref: ForwardedRef<BrowserOp
             key={opt.key}
             label={opt.label}
             isSelected={false}
+            disabled={opt.key === 'toggleFavouriteSite' && siteInfo.url.startsWith(`https://${searchDomain}`)}
             backgroundColor={opt.iconBackgroundColor}
           />
         ))}

src/screens/Home/Browser/BrowserSearch.tsx

@@ -1,11 +1,11 @@
 import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { SectionListRenderItemInfo, SectionList, View } from 'react-native';
+import { SectionListRenderItemInfo, SectionList, View, Platform } from 'react-native';
 import { DAppTitleMap, predefinedDApps } from '../../../predefined/dAppSites';
 import { useNavigation } from '@react-navigation/native';
 import { BrowserSearchProps, RootNavigationProps } from 'routes/index';
 import { navigateAndClearCurrentScreenHistory } from 'utils/navigation';
 import { StoredSiteInfo } from 'stores/types';
-import { getHostName, getValidURL } from 'utils/browser';
+import { getHostName, getValidURL, searchDomain } from 'utils/browser';
 import { clearHistory, createNewTab } from 'stores/updater';
 import { BrowserItem } from 'components/Browser/BrowserItem';
 import { useSubWalletTheme } from 'hooks/useSubWalletTheme';
@@ -43,7 +43,7 @@ const recommendItems: SearchItemType[] = predefinedDApps.dapps.map(i => ({
 function getFirstSearchItem(searchString: string): SearchItemType {
   const url = getValidURL(searchString);
 
-  if (url.startsWith('https://duckduckgo.com')) {
+  if (url.startsWith(`https://${searchDomain}`)) {
     return {
       id: 'search',
       url,
@@ -198,6 +198,11 @@ export const BrowserSearch = ({ route: { params } }: BrowserSearchProps) => {
   const onClearSearch = () => {
     onSearch('');
   };
+  const onSubmitEditing = () => {
+    if (sectionItems[0].type === 'search') {
+      onPressItem(sectionItems[0].data[0]);
+    }
+  };
 
   return (
     <ContainerWithSubHeader
@@ -214,6 +219,10 @@ export const BrowserSearch = ({ route: { params } }: BrowserSearchProps) => {
           onClearSearchString={onClearSearch}
           onSearch={onSearch}
           searchText={searchString}
+          autoCapitalize="none"
+          keyboardType={Platform.OS === 'ios' ? 'web-search' : 'url'}
+          returnKeyType="go"
+          onSubmitEditing={onSubmitEditing}
         />
         <SectionList
           style={{ ...ScrollViewStyle }}

src/screens/Home/Browser/BrowserTab.tsx

@@ -226,10 +226,17 @@ const Component = ({ tabId, onOpenBrowserTabs, connectionTrigger }: Props, ref:
       updateSiteInfo({ url: nativeEvent.url, name: nativeEvent.title });
       updateNavigationInfo(nativeEvent);
 
-      updateLatestItemInHistory({
-        url: nativeEvent.url,
-        name: nativeEvent.title || nativeEvent.url,
-      });
+      setTimeout(() => {
+        if (getHostName(nativeEvent.url) !== searchDomain) {
+          const isHistoryItemExisted = historyItems.length > 0 && historyItems[0].url !== nativeEvent.url;
+          if (isHistoryItemExisted) {
+            updateLatestItemInHistory({
+              url: nativeEvent.url,
+              name: nativeEvent.title || nativeEvent.url,
+            });
+          }
+        }
+      }, 800);
       updateBrowserOptionModalRef(nativeEvent);
     }
   };
@@ -245,6 +252,7 @@ const Component = ({ tabId, onOpenBrowserTabs, connectionTrigger }: Props, ref:
     if (getHostName(nativeEvent.url) !== searchDomain) {
       const isNotDuplicated =
         historyItems.length === 0 || (historyItems.length > 0 && historyItems[0].url !== nativeEvent.url);
+      console.log('isNotDuplicated', isNotDuplicated, historyItems[0], nativeEvent.url);
       if (isNotDuplicated) {
         addToHistory({
           url: nativeEvent.url,

src/screens/Home/Browser/Shared/IconItem.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback, useState } from 'react';
 import { TouchableOpacity, View } from 'react-native';
 import { Image, Typography } from 'components/design-system-ui';
 import { DAppInfo } from 'types/browser';
@@ -7,24 +7,33 @@ import { RootState } from 'stores/index';
 import createStylesheet from './styles/IconItem';
 import { useSubWalletTheme } from 'hooks/useSubWalletTheme';
 import { StoredSiteInfo } from 'stores/types';
+import { getHostName } from 'utils/browser';
 
 interface IconItemProps {
   data: DAppInfo | undefined;
+  url: string;
   defaultData?: StoredSiteInfo;
   isWithText?: boolean;
   onPress?: () => void;
 }
 
-const IconItem: React.FC<IconItemProps> = ({ data, defaultData, isWithText, onPress }) => {
+const IconItem: React.FC<IconItemProps> = ({ data, url, defaultData, isWithText, onPress }) => {
+  const [image, setImage] = useState(data?.icon || `https://${getHostName(url)}/favicon.ico`);
   const theme = useSubWalletTheme().swThemes;
   const stylesheet = createStylesheet(theme);
   const assetLogoMap = useSelector((state: RootState) => state.logoMaps.assetLogoMap);
+  const onLoadImageError = useCallback(() => {
+    if (image.includes('avicon.ico')) {
+      setImage(`https://${getHostName(url)}/favicon.png`);
+      return;
+    }
+    setImage(assetLogoMap.default);
+  }, [assetLogoMap.default, image, url]);
 
   return (
     <View style={stylesheet.container}>
       <TouchableOpacity style={stylesheet.imageWrapper} onPress={onPress} disabled={!onPress}>
-        <Image src={data?.icon || assetLogoMap.default} style={stylesheet.image} shape={'squircle'} squircleSize={44} />
-
+        <Image src={image} onError={onLoadImageError} style={stylesheet.image} shape={'squircle'} squircleSize={44} />
         {isWithText && (
           <Typography.Text size={'xs'} style={stylesheet.title} ellipsis>
             {data?.name || defaultData?.name}

src/screens/Home/Staking/StakingDetail/StakingDetailModal/index.tsx

@@ -313,7 +313,7 @@ export const StakingDetailModal = ({
                 {isAccountAll(nominatorMetadata?.address || '') ? (
                   <MetaInfo.AccountGroup
                     label={i18n.inputLabel.account}
-                    content={nominatorMetadata?.address || ''}
+                    content={nominatorMetadata?.address === 'ALL' ? i18n.common.allAccounts : ''}
                     addresses={accounts.map(acc => acc.address)}
                   />
                 ) : (

src/utils/browser.ts

@@ -13,7 +13,7 @@ export function isValidURL(str: string): boolean {
     '^(https?:\\/\\/)?' + // protocol
       '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name
       '((\\d{1,3}\\.){3}\\d{1,3}))' + // OR ip (v4) address
-      '(\\:\\d+)?(\\/[-a-z\\d%_.~+#]*)*' + // port and path
+      '(\\:\\d+)?(\\/[-a-z\\d%_.~+#@]*)*' + // port and path
       '(\\?[;&a-z\\d%_.~+=-]*)?' + // query string
       '(\\#[-a-z\\d_]*)?$',
     'i',

yarn.lock

@@ -15380,10 +15380,10 @@ react-native-view-shot@^3.5.0:
   dependencies:
     html2canvas "^1.4.1"
 
-react-native-webview@^11.26.1:
-  version "11.26.1"
-  resolved "https://registry.yarnpkg.com/react-native-webview/-/react-native-webview-11.26.1.tgz#658c09ed5162dc170b361e48c2dd26c9712879da"
-  integrity sha512-hC7BkxOpf+z0UKhxFSFTPAM4shQzYmZHoELa6/8a/MspcjEP7ukYKpuSUTLDywQditT8yI9idfcKvfZDKQExGw==
+react-native-webview@^13.2.3:
+  version "13.2.3"
+  resolved "https://registry.yarnpkg.com/react-native-webview/-/react-native-webview-13.2.3.tgz#9ede285b671f5072c1b9964ce210474ea359febd"
+  integrity sha512-f2cJ61cfpNzry0KLJg3HiwrGhhVnOLwbcHeQVMRldWTwzqSptTzk1sTO8QulYt0nVkUNw1xeboD0SLkUeaQB9Q==
   dependencies:
     escape-string-regexp "2.0.0"
     invariant "2.2.4"