mobile: wrapped 2025

2026-02-23 19:49:56 +01:00 · 2025-12-11 13:58:41 +05:00
parent 7ccfba67e5
commit e611261a07
7 changed files with 1293 additions and 9 deletions
--- a/apps/mobile/app/components/side-menu/side-menu-home.tsx
+++ b/apps/mobile/app/components/side-menu/side-menu-home.tsx
@@ -19,6 +19,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import { SubscriptionPlan } from "@notesnook/core";
 import { strings } from "@notesnook/intl";
 import { useThemeColors } from "@notesnook/theme";
+import dayjs from "dayjs";
 import React from "react";
 import { FlatList, View } from "react-native";
 import { DraxProvider, DraxScrollView } from "react-native-drax";
@@ -140,19 +141,35 @@ export function SideMenuHome() {
          paddingVertical: DefaultAppStyles.GAP_VERTICAL
        }}
      >
-        {(subscriptionType === SubscriptionPlan.FREE ||
-          !subscriptionType ||
-          !user) &&
-        !SettingsService.getProperty("serverUrls") ? (
+        {dayjs().month() !== 11 ? (
+          <>
+            {(subscriptionType === SubscriptionPlan.FREE ||
+              !subscriptionType ||
+              !user) &&
+            !SettingsService.getProperty("serverUrls") ? (
+              <Button
+                title={pro.title}
+                style={{
+                  width: "100%"
+                }}
+                type="accent"
+                onPress={pro.onPress}
+              />
+            ) : null}
+          </>
+        ) : (
          <Button
-            title={pro.title}
+            title={`Wrapped ${dayjs().year()} 🎉`}
            style={{
              width: "100%"
            }}
-            type="accent"
-            onPress={pro.onPress}
+            bold
+            type="secondaryAccented"
+            onPress={() => {
+              Navigation.navigate("Wrapped");
+            }}
          />
-        ) : null}
+        )}
      </View>
    </View>
  );
--- a/apps/mobile/app/navigation/navigation-stack.tsx
+++ b/apps/mobile/app/navigation/navigation-stack.tsx
@@ -273,6 +273,7 @@ let Settings: any = null;
 let ManageTags: any = null;
 let AddReminder: any = null;
 let PayWall: any = null;
+let Wrapped: any = null;
 export const RootNavigation = () => {
  const introCompleted = useSettingStore(
    (state) => state.settings.introCompleted
@@ -384,6 +385,14 @@ export const RootNavigation = () => {
            return PayWall;
          }}
        />
+
+        <RootStack.Screen
+          name="Wrapped"
+          getComponent={() => {
+            Wrapped = Wrapped || require("../screens/wrapped").default;
+            return Wrapped;
+          }}
+        />
      </RootStack.Navigator>
    </NavigationContainer>
  );
--- a/apps/mobile/app/screens/wrapped/index.tsx
+++ b/apps/mobile/app/screens/wrapped/index.tsx
--- a/apps/mobile/app/services/navigation.ts
+++ b/apps/mobile/app/services/navigation.ts
@@ -71,7 +71,8 @@ const routeNames = {
  Archive: "Archive",
  ManageTags: "ManageTags",
  AddReminder: "AddReminder",
-  PayWall: "PayWall"
+  PayWall: "PayWall",
+  Wrapped: "Wrapped"
 };

 export type NavigationProps<T extends RouteName> = NativeStackScreenProps<
--- a/apps/mobile/app/stores/use-navigation-store.ts
+++ b/apps/mobile/app/stores/use-navigation-store.ts
@@ -112,6 +112,7 @@ export interface RouteParams extends ParamListBase {
    context: "signup" | "logged-in" | "logged-out" | "subscribed";
    state?: BillingState;
  };
+  Wrapped: GenericRouteParam;
 }

 export type RouteName = keyof RouteParams;
--- a/apps/mobile/package-lock.json
+++ b/apps/mobile/package-lock.json
@@ -123,6 +123,7 @@
        "react-native-tooltips": "^1.0.3",
        "react-native-url-polyfill": "^2.0.0",
        "react-native-vector-icons": "10.3.0",
+        "react-native-view-shot": "^4.0.3",
        "react-native-webview": "^13.13.5",
        "react-native-wheel-color-picker": "^1.3.1",
        "react-native-worklets": "^0.7.1",
@@ -228,6 +229,7 @@
        "@streetwriters/kysely": "^0.27.4",
        "@streetwriters/showdown": "^3.0.9-alpha",
        "@types/mime-db": "^1.43.5",
+        "alfaaz": "^1.1.0",
        "async-mutex": "0.5.0",
        "dayjs": "1.11.13",
        "dom-serializer": "^2.0.0",
@@ -7498,6 +7500,15 @@
      "resolved": "https://registry.npmjs.org/base-64/-/base-64-0.1.0.tgz",
      "integrity": "sha512-Y5gU45svrR5tI2Vt/X9GPd3L0HNIKzGu202EjxrXMpuc2V2CiKgemAbUUsqYmZJvPtCXoUKjNZwBJzsNScUbXA=="
    },
+    "node_modules/base64-arraybuffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
+      "integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6.0"
+      }
+    },
    "node_modules/base64-js": {
      "version": "1.5.1",
      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@@ -8554,6 +8565,15 @@
      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==",
      "license": "MIT"
    },
+    "node_modules/css-line-break": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-2.1.0.tgz",
+      "integrity": "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==",
+      "license": "MIT",
+      "dependencies": {
+        "utrie": "^1.0.2"
+      }
+    },
    "node_modules/css-select": {
      "version": "5.2.2",
      "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.2.2.tgz",
@@ -11634,6 +11654,19 @@
        "entities": "^4.4.0"
      }
    },
+    "node_modules/html2canvas": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz",
+      "integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==",
+      "license": "MIT",
+      "dependencies": {
+        "css-line-break": "^2.1.0",
+        "text-segmentation": "^1.0.3"
+      },
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
    "node_modules/htmlparser2": {
      "version": "9.1.0",
      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-9.1.0.tgz",
@@ -18066,6 +18099,19 @@
        "node": ">=10"
      }
    },
+    "node_modules/react-native-view-shot": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/react-native-view-shot/-/react-native-view-shot-4.0.3.tgz",
+      "integrity": "sha512-USNjYmED7C0me02c1DxKA0074Hw+y/nxo+xJKlffMvfUWWzL5ELh/TJA/pTnVqFurIrzthZDPtDM7aBFJuhrHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "html2canvas": "^1.4.1"
+      },
+      "peerDependencies": {
+        "react": "*",
+        "react-native": "*"
+      }
+    },
    "node_modules/react-native-webview": {
      "version": "13.16.0",
      "resolved": "https://registry.npmjs.org/react-native-webview/-/react-native-webview-13.16.0.tgz",
@@ -20279,6 +20325,15 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/text-segmentation": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/text-segmentation/-/text-segmentation-1.0.3.tgz",
+      "integrity": "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==",
+      "license": "MIT",
+      "dependencies": {
+        "utrie": "^1.0.2"
+      }
+    },
    "node_modules/thingies": {
      "version": "2.5.0",
      "resolved": "https://registry.npmjs.org/thingies/-/thingies-2.5.0.tgz",
@@ -21090,6 +21145,15 @@
        "node": ">= 0.4.0"
      }
    },
+    "node_modules/utrie": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/utrie/-/utrie-1.0.2.tgz",
+      "integrity": "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==",
+      "license": "MIT",
+      "dependencies": {
+        "base64-arraybuffer": "^1.0.2"
+      }
+    },
    "node_modules/uuid": {
      "version": "11.1.0",
      "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.1.0.tgz",
--- a/apps/mobile/package.json
+++ b/apps/mobile/package.json
@@ -139,6 +139,7 @@
    "react-native-tooltips": "^1.0.3",
    "react-native-url-polyfill": "^2.0.0",
    "react-native-vector-icons": "10.3.0",
+    "react-native-view-shot": "^4.0.3",
    "react-native-webview": "^13.13.5",
    "react-native-wheel-color-picker": "^1.3.1",
    "react-native-worklets": "^0.7.1",