Merge branch 'release' of github.com:LedgerHQ/ledger-live into feat/L…

…IVE-2536-llm-notifications-prompts

.changeset/pre.json

@@ -97,6 +97,7 @@
     "slow-trainers-fry",
     "spicy-eyes-decide",
     "thick-ligers-fail",
+    "warm-months-attend",
     "weak-queens-shout",
     "wild-spies-cry2",
     "witty-numbers-design",

.changeset/warm-months-attend.md

@@ -0,0 +1,5 @@
+---
+"@ledgerhq/native-ui": patch
+---
+
+UI - native - notifications component styles extended

apps/ledger-live-mobile/CHANGELOG.md

@@ -1,5 +1,12 @@
 # live-mobile
 
+## 3.5.0-next.14
+
+### Patch Changes
+
+- Updated dependencies [[`858898d63`](https://github.com/LedgerHQ/ledger-live/commit/858898d63b3d70dc0be4cefbeaba5770c389660b)]:
+  - @ledgerhq/native-ui@0.8.3-next.0
+
 ## 3.5.0-next.13
 
 ### Patch Changes

apps/ledger-live-mobile/package.json

@@ -3,7 +3,7 @@
     "node": ">=14"
   },
   "name": "live-mobile",
-  "version": "3.5.0-next.13",
+  "version": "3.5.0-next.14",
   "private": true,
   "scripts": {
     "postinstall": "bash ./scripts/post.sh",

apps/ledger-live-mobile/src/components/CopyLink.js → apps/ledger-live-mobile/src/components/CopyLink.tsx

@@ -8,15 +8,22 @@ import Touchable from "./Touchable";
 import { withTheme } from "../colors";
 
 type Props = {
-  style?: *,
-  children: string | React$Element<*>,
-  string: string, // String to be copied
-  replacement?: string | React$Element<*>, // String to display in place of children on copy
-  colors: *,
+  style?: any;
+  children: string | React.ReactNode;
+  /**
+   * String to be copied
+   */
+  string: string;
+  /**
+   * String to display in place of children on copy
+   */
+  replacement?: string | React.ReactNode;
+  colors: any;
+  onCopy?: () => void;
 };
 
 type State = {
-  copied: boolean,
+  copied: boolean;
 };
 
 class CopyLink extends PureComponent<Props, State> {
@@ -27,12 +34,12 @@ class CopyLink extends PureComponent<Props, State> {
   timeout = null;
 
   onPress = () => {
-    const { string } = this.props;
+    const { string, onCopy } = this.props;
 
     Clipboard.setString(string);
 
     this.setState({ copied: true });
-
+    onCopy && onCopy();
     this.timeout = setTimeout(() => {
       this.setState({ copied: false });
     }, 3000);
@@ -43,19 +50,18 @@ class CopyLink extends PureComponent<Props, State> {
     const { copied } = this.state;
     return (
       <Touchable
-        event="CopyLink"
         style={[styles.linkContainer, style]}
         onPress={this.onPress}
       >
-        <Icons.CopyMedium
+        <Icons.CheckAloneMedium
           size={16}
-          color={copied ? "neutral.c70" : "primary.c80"}
+          color={copied ? "success.c100" : "neutral.c30"}
         />
         <Text
           variant="body"
           fontWeight="semiBold"
-          color={copied ? "neutral.c70" : "primary.c80"}
-          ml={3}
+          color={copied ? "success.c100" : "primary.c80"}
+          ml={2}
         >
           {copied && replacement ? replacement : children}
         </Text>

apps/ledger-live-mobile/src/components/CurrencyRow.tsx

@@ -0,0 +1,74 @@
+// @flow
+import React, { PureComponent } from "react";
+import { RectButton } from "react-native-gesture-handler";
+import type {
+  CryptoCurrency,
+  TokenCurrency,
+} from "@ledgerhq/live-common/lib/types";
+
+import LText from "./LText";
+import CircleCurrencyIcon from "./CircleCurrencyIcon";
+import styled from "styled-components/native";
+import {Flex, Tag} from "@ledgerhq/native-ui";
+
+const StyledRectButton = styled(RectButton)`
+  flex-direction: row;
+  align-items: center;
+  padding: 16px;
+`
+
+type Props = {
+  currency: CryptoCurrency | TokenCurrency,
+  onPress: (currency: CryptoCurrency | TokenCurrency) => void,
+  isOK?: boolean,
+  style?: any,
+  colors: any,
+  iconSize?: number,
+};
+
+class CurrencyRow extends PureComponent<Props> {
+  onPress = () => {
+    this.props.onPress(this.props.currency);
+  };
+
+  render() {
+    const { currency, style, isOK = true, colors, iconSize = 32 } = this.props;
+
+    return (
+      <StyledRectButton style={[style]} onPress={this.onPress}>
+        <CircleCurrencyIcon
+          size={iconSize}
+          currency={currency}
+          color={!isOK ? colors.lightFog : undefined}
+        />
+        <Flex flexDirection="row" flex={1} alignItems="center" justifyContent="flex-start">
+        <LText
+          semiBold
+          variant="body"
+          numberOfLines={1}
+          ml={4}
+          color={!isOK ? "neutral.c70" : "neutral.c100"}
+        >
+          {currency.name}
+        </LText>
+        <LText
+          semiBold
+          variant="body"
+          numberOfLines={1}
+          ml={3}
+          color={!isOK ? "neutral.c50" : "neutral.c70"}
+        >
+          {currency.ticker}
+        </LText>
+        </Flex>
+        {currency.type === "TokenCurrency" && currency.parentCurrency ? (
+          <Tag>
+            {currency.parentCurrency.name}
+          </Tag>
+        ) : null}
+      </StyledRectButton>
+    );
+  }
+}
+
+export default CurrencyRow;

apps/ledger-live-mobile/src/components/FabActions.tsx

@@ -375,7 +375,7 @@ const FabActions: React.FC<FabActionsProps> = ({
       navigationParams: [
         NavigatorName.ReceiveFunds,
         {
-          screen: ScreenName.ReceiveSelectAccount,
+          screen: ScreenName.ReceiveSelectCrypto,
         },
       ],
     };

apps/ledger-live-mobile/src/components/FilteredSearchBar.tsx

@@ -1,9 +1,12 @@
-import React, { ReactNode, useState, memo } from "react";
+import React, { ReactNode, useState, memo, useCallback } from "react";
 import { SearchInput, Flex } from "@ledgerhq/native-ui";
 import { useTranslation } from "react-i18next";
 import { useTheme } from "styled-components/native";
 
+import { useRoute } from "@react-navigation/native";
 import Search from "./Search";
+import { track } from "../analytics";
+import { ScreenName } from "../const";
 
 type Props = {
   initialQuery?: string;
@@ -25,13 +28,24 @@ const FilteredSearchBar = ({
   const { t } = useTranslation();
   const { colors } = useTheme();
   const [query, setQuery] = useState<string>(initialQuery || "");
+  const route = useRoute();
+
+  const onChange = useCallback(
+    (newQuery: string) => {
+      setQuery(newQuery);
+      if (route.name === ScreenName.ReceiveSelectCrypto) {
+        track("search_clicked", { input: newQuery, screen: route.name });
+      }
+    },
+    [route.name],
+  );
 
   return (
     <>
       <Flex style={inputWrapperStyle}>
         <SearchInput
           value={query}
-          onChange={setQuery}
+          onChange={onChange}
           placeholder={t("common.search")}
           placeholderTextColor={colors.neutral.c70}
           color={colors.neutral.c100}

apps/ledger-live-mobile/src/components/LText/index.tsx

@@ -1,18 +1,22 @@
 import React, { useMemo, memo } from "react";
 import { Text } from "@ledgerhq/native-ui";
+import { BaseTextProps } from "@ledgerhq/native-ui/components/Text";
 import { FontWeightTypes } from "@ledgerhq/native-ui/components/Text/getTextStyle";
 import getFontStyle from "./getFontStyle";
 
 export { getFontStyle };
 
-export type Opts = {
+export type Opts = BaseTextProps & {
   bold?: boolean;
   semiBold?: boolean;
   secondary?: boolean;
   monospace?: boolean;
   color?: string;
   bg?: string;
+  fontSize?: string;
   children?: React.ReactNode;
+  variant?: string;
+  fontFamily?: string;
 };
 
 export type Res = {
@@ -31,7 +35,10 @@ export type Res = {
     | "900";
 };
 
-const inferFontWeight = ({ semiBold, bold }: Opts): FontWeightTypes => {
+const inferFontWeight = ({
+  semiBold,
+  bold,
+}: Partial<Opts>): FontWeightTypes => {
   if (bold) {
     return "bold";
   }