mobile: allow users to open redeem code url from app

apps/mobile/app/screens/settings/notesnook-circle.tsx

@@ -2,7 +2,8 @@ import { CirclePartner, SubscriptionStatus } from "@notesnook/core";
 import { strings } from "@notesnook/intl";
 import { useThemeColors } from "@notesnook/theme";
 import Clipboard from "@react-native-clipboard/clipboard";
-import { useEffect, useState } from "react";
+import { useState } from "react";
+import { useAsync } from "react-async-hook";
 import {
   ActivityIndicator,
   Image,
@@ -13,6 +14,7 @@ import {
 import { db } from "../../common/database";
 import AppIcon from "../../components/ui/AppIcon";
 import { Button } from "../../components/ui/button";
+import { Notice } from "../../components/ui/notice";
 import Heading from "../../components/ui/typography/heading";
 import Paragraph from "../../components/ui/typography/paragraph";
 import { ToastManager } from "../../services/event-manager";
@@ -21,8 +23,8 @@ import PremiumService from "../../services/premium";
 import { useUserStore } from "../../stores/use-user-store";
 import { AppFontSize, defaultBorderRadius } from "../../utils/size";
 import { DefaultAppStyles } from "../../utils/styles";
-import { useAsync } from "react-async-hook";
+import { openLinkInBrowser } from "../../utils/functions";
-import { Notice } from "../../components/ui/notice";
+import { Pressable } from "../../components/ui/pressable";
 
 export const NotesnookCircle = () => {
   const user = useUserStore((state) => state.user);
@@ -156,32 +158,53 @@ const Partner = ({
               }}
             />
           ) : (
-            <TouchableOpacity
+            <>
-              style={{
+              <TouchableOpacity
-                backgroundColor: colors.secondary.background,
+                style={{
-                borderRadius: defaultBorderRadius,
+                  backgroundColor: colors.secondary.background,
-                alignItems: "center",
+                  borderRadius: defaultBorderRadius,
-                justifyContent: "center",
+                  alignItems: "center",
-                padding: DefaultAppStyles.GAP_SMALL,
+                  justifyContent: "center",
-                borderWidth: 0.5,
+                  padding: DefaultAppStyles.GAP_SMALL,
-                borderColor: colors.secondary.border,
+                  borderWidth: 0.5,
-                flexDirection: "row",
+                  borderColor: colors.secondary.border,
-                gap: DefaultAppStyles.GAP_SMALL
+                  flexDirection: "row",
-              }}
+                  gap: DefaultAppStyles.GAP_SMALL
-              activeOpacity={0.9}
+                }}
-              onPress={() => {
+                activeOpacity={0.9}
-                Clipboard.setString(code);
+                onPress={() => {
-              }}
+                  Clipboard.setString(code);
-            >
+                }}
-              <Paragraph
-                size={AppFontSize.lg}
-                color={colors.secondary.paragraph}
               >
-                {code}
+                <Paragraph
-              </Paragraph>
+                  size={AppFontSize.lg}
+                  color={colors.secondary.paragraph}
+                >
+                  {code}
+                </Paragraph>
 
-              <AppIcon name="content-copy" />
+                <AppIcon name="content-copy" />
-            </TouchableOpacity>
+              </TouchableOpacity>
+
+              {item.codeRedeemUrl ? (
+                <Pressable
+                  onPress={() => {
+                    if (item.codeRedeemUrl) {
+                      openLinkInBrowser(
+                        item.codeRedeemUrl.replace("{{code}}", code)
+                      );
+                    }
+                  }}
+                >
+                  <Paragraph
+                    color={colors.secondary.paragraph}
+                    size={AppFontSize.xxs}
+                  >
+                    {strings.clickToDirectlyClaimPromo()}
+                  </Paragraph>
+                </Pressable>
+              ) : null}
+            </>
           )}
         </>
       ) : null}

packages/intl/locale/en.po

@@ -1580,6 +1580,10 @@ msgstr ""
 "\n"
 "**Only use this for troubleshooting purposes. If you are having persistent issues, it is recommended that you reach out to us via support@streetwriters.co so we can help you resolve it permanently.**"
 
+#: src/strings.ts:2606
+msgid "Click here to directly claim the promotion."
+msgstr "Click here to directly claim the promotion."
+
 #: src/strings.ts:239
 msgid "Click to deselect"
 msgstr "Click to deselect"

packages/intl/locale/pseudo-LOCALE.po

@@ -1569,6 +1569,10 @@ msgid ""
 "**Only use this for troubleshooting purposes. If you are having persistent issues, it is recommended that you reach out to us via support@streetwriters.co so we can help you resolve it permanently.**"
 msgstr ""
 
+#: src/strings.ts:2606
+msgid "Click here to directly claim the promotion."
+msgstr ""
+
 #: src/strings.ts:239
 msgid "Click to deselect"
 msgstr ""

packages/intl/src/strings.ts

@@ -2601,5 +2601,7 @@ Use this if changes from other devices are not appearing on this device. This wi
   freeUserCircleNotice: () =>
     t`The Notesnook Circle is exclusive to subscribers. Please consider subscribing to gain access to Notesnook Circle and enjoy additional benefits.`,
   finishPurchaseInBrowser: () => t`Finish your purchase in the browser.`,
-  goBack: () => t`Go back`
+  goBack: () => t`Go back`,
+  clickToDirectlyClaimPromo: () =>
+    t`Click here to directly claim the promotion.`
 };