statsig: use new proxy endpoint (#6271)

.eslintrc.js

@@ -1,9 +1,8 @@
 module.exports = {
   root: true,
   extends: [
-    '@react-native',
+    '@react-native-community',
     'plugin:react/recommended',
-    'plugin:react/jsx-runtime',
     'plugin:react-native-a11y/ios',
     'prettier',
   ],
@@ -17,8 +16,9 @@ module.exports = {
     'eslint-plugin-react-compiler',
   ],
   rules: {
+    // Temporary until https://github.com/facebook/react-native/pull/43756 gets into a release.
+    'prettier/prettier': 0,
     'react/no-unescaped-entities': 0,
-    'react/prop-types': 0,
     'react-native/no-inline-styles': 0,
     'bsky-internal/avoid-unwrapped-text': [
       'error',
@@ -79,7 +79,8 @@ module.exports = {
       },
     ],
     'simple-import-sort/exports': 'error',
-    'react-compiler/react-compiler': 'warn',
+    // TODO: Reenable when we figure out why it gets stuck on CI.
+    // 'react-compiler/react-compiler': 'error',
     'no-restricted-imports': [
       'error',
       {

__e2e__/flows/composer-self-label.yml

@@ -17,8 +17,8 @@ appId: xyz.blueskyweb.app
 - inputText: "Post with an image"
 - tapOn:
     id: "openGalleryBtn"
-- tapOn: "Content warnings"
-- tapOn: "Content warnings"
+- tapOn:
+    id: "labelsBtn"
 - tapOn: "Porn"
 - tapOn:
     label: "Tap on confirm"

__e2e__/flows/create-account.yml

@@ -29,6 +29,7 @@ appId: xyz.blueskyweb.app
 - pressKey: Enter
 - tapOn:
     id: "nextBtn"
+- tapOn: "Not now"
 - tapOn:
      id: "handleInput"
 - inputText: "e2e-test"

__e2e__/flows/curate-lists.yml

@@ -23,7 +23,6 @@ appId: xyz.blueskyweb.app
     id: "editDescriptionInput"
 - inputText: "They good"
 - tapOn: "Save"
-- tapOn: "Save"
 - assertNotVisible:
     id: "createOrEditListModal"
 - tapOn: "About"
@@ -46,7 +45,6 @@ appId: xyz.blueskyweb.app
 - eraseText
 - inputText: "They bad"
 - tapOn: "Save"
-- tapOn: "Save"
 - assertNotVisible:
     id: "createOrEditListModal"
 - assertVisible: Bad Ppl
@@ -62,7 +60,6 @@ appId: xyz.blueskyweb.app
     id: "editDescriptionInput"
 - eraseText
 - tapOn: "Save"
-- tapOn: "Save"
 - assertNotVisible:
     id: "createOrEditListModal"
 - assertNotVisible:
@@ -90,7 +87,6 @@ appId: xyz.blueskyweb.app
     id: "editDescriptionInput"
 - inputText: "They good"
 - tapOn: "Save"
-- tapOn: "Save"
 - assertNotVisible:
     id: "createOrEditListModal"
 - tapOn: "About"

__e2e__/flows/login.yml

@@ -23,4 +23,5 @@ appId: xyz.blueskyweb.app
     id: "loginPasswordInput"
 - inputText: "hunter2"
 - pressKey: Enter
+- tapOn: "Not now"
 - assertVisible: "Following"

__e2e__/flows/mod-lists.yml

@@ -22,7 +22,6 @@ appId: xyz.blueskyweb.app
     id: "editDescriptionInput"
 - inputText: "Shhh"
 - tapOn: "Save"
-- tapOn: "Save"
 
 # view modlist
 - assertVisible: "Muted Users"

__e2e__/flows/onboarding.yml

@@ -13,7 +13,7 @@ appId: xyz.blueskyweb.app
 - tapOn: "Select an avatar"
 - waitForAnimationToEnd
 - tapOn:
-    point: "50%,22%"
+    point: "16%,22%"
 - waitForAnimationToEnd
 - tapOn: "Choose"
 - waitForAnimationToEnd

app.config.js

@@ -92,31 +92,6 @@ module.exports = function (config) {
             'Used to save images to your library.',
           NSPhotoLibraryUsageDescription:
             'Used for profile pictures, posts, and other kinds of content',
-          CFBundleSpokenName: 'Blue Sky',
-          CFBundleLocalizations: [
-            'en',
-            'ca',
-            'de',
-            'es',
-            'fi',
-            'fr',
-            'ga',
-            'hi',
-            'hu',
-            'id',
-            'it',
-            'ja',
-            'ko',
-            'pl',
-            'pt',
-            'ru',
-            'th',
-            'tr',
-            'uk',
-            'zh_CN',
-            'zh_HK',
-            'zh_TW',
-          ],
         },
         associatedDomains: ASSOCIATED_DOMAINS,
         splash: {

assets/icons/calendarClock_stroke2_corner0_rounded.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M15.439 3.148a1 1 0 0 1 .41.645l.568 3.22a7 7 0 1 1-6.174 10.97L4.32 19.027a1 1 0 0 1-1.159-.811L1.078 6.398a1 1 0 0 1 .81-1.158l12.803-2.258a1 1 0 0 1 .748.166ZM9.325 16.114A7 7 0 0 1 9 14c0-1.56.51-3 1.372-4.164l-6.456 1.139 1.041 5.909 4.368-.77ZM3.568 9.005l10.833-1.91-.347-1.97L3.22 7.036l.347 1.97ZM16 9a5 5 0 1 0 0 10 5 5 0 0 0 0-10Zm0 2a1 1 0 0 1 1 1v1.586l1.374 1.374a1 1 0 0 1-1.414 1.414l-1.667-1.667A1 1 0 0 1 15 14v-2a1 1 0 0 1 1-1Z" clip-rule="evenodd"/></svg>

assets/icons/chainLink3_stroke2_corner0_rounded.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M18.535 5.465a5.003 5.003 0 0 0-7.076 0l-.005.005-.752.742a1 1 0 1 1-1.404-1.424l.749-.74a7.003 7.003 0 0 1 9.904 9.905l-.002.003-.737.746a1 1 0 1 1-1.424-1.404l.747-.757a5.003 5.003 0 0 0 0-7.076ZM6.202 9.288a1 1 0 0 1 .01 1.414l-.747.757a5.003 5.003 0 1 0 7.076 7.076l.005-.005.752-.742a1 1 0 1 1 1.404 1.424l-.746.737-.003.002a7.003 7.003 0 0 1-9.904-9.904l.74-.75a1 1 0 0 1 1.413-.009Zm8.505.005a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414l4-4a1 1 0 0 1 1.414 0Z" clip-rule="evenodd"/></svg>

babel.config.js

@@ -17,7 +17,12 @@ module.exports = function (api) {
     ],
     plugins: [
       'macros',
-      ['babel-plugin-react-compiler', {target: '18'}],
+      [
+        'babel-plugin-react-compiler',
+        {
+          runtimeModule: 'react-compiler-runtime',
+        },
+      ],
       [
         'module:react-native-dotenv',
         {

bskyembed/src/components/embed.tsx

@@ -9,6 +9,7 @@ import {
   AppBskyGraphDefs,
   AppBskyGraphStarterpack,
   AppBskyLabelerDefs,
+  AtUri,
 } from '@atproto/api'
 import {ComponentChildren, h} from 'preact'
 import {useMemo} from 'preact/hooks'
@@ -436,14 +437,14 @@ function StarterPackEmbed({
 
 // from #/lib/strings/starter-pack.ts
 function getStarterPackImage(starterPack: AppBskyGraphDefs.StarterPackView) {
-  const rkey = getRkey({uri: starterPack.uri})
+  const rkey = new AtUri(starterPack.uri).rkey
   return `https://ogcard.cdn.bsky.app/start/${starterPack.creator.did}/${rkey}`
 }
 
 function getStarterPackHref(
   starterPack: AppBskyGraphDefs.StarterPackViewBasic,
 ) {
-  const rkey = getRkey({uri: starterPack.uri})
+  const rkey = new AtUri(starterPack.uri).rkey
   const handleOrDid = starterPack.creator.handle || starterPack.creator.did
   return `/starter-pack/${handleOrDid}/${rkey}`
 }

bskyembed/yarn.lock

@@ -4209,7 +4209,12 @@ yocto-queue@^0.1.0:
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
   integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==
 
-zod@^3.21.4, zod@^3.23.8:
+zod@^3.21.4:
+  version "3.22.4"
+  resolved "https://registry.yarnpkg.com/zod/-/zod-3.22.4.tgz#f31c3a9386f61b1f228af56faa9255e845cf3fff"
+  integrity sha512-iC+8Io04lddc+mVqQ9AZ7OQ2MrUKGN+oIQyq1vemgt46jwCwLfhq7/pwnBnNXXXZb8VTVLKwp9EDkx+ryxIWmg==
+
+zod@^3.23.8:
   version "3.23.8"
   resolved "https://registry.yarnpkg.com/zod/-/zod-3.23.8.tgz#e37b957b5d52079769fb8097099b592f0ef4067d"
   integrity sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==

lib/react-compiler-runtime/index.js

@@ -0,0 +1,21 @@
+const React = require('react')
+const $empty = Symbol.for('react.memo_cache_sentinel')
+/**
+ * DANGER: this hook is NEVER meant to be called directly!
+ *
+ * Note that this is a temporary userspace implementation of this function
+ * from React 19. It is not as efficient and may invalidate more frequently
+ * than the official API. Please upgrade to React 19 as soon as you can.
+ **/
+export function c(size) {
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  return React.useState(() => {
+    const $ = new Array(size)
+    for (let ii = 0; ii < size; ii++) {
+      $[ii] = $empty
+    }
+    // @ts-ignore
+    $[$empty] = true
+    return $
+  })[0]
+}

lib/react-compiler-runtime/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "react-compiler-runtime",
+  "version": "0.0.1",
+  "license": "MIT",
+  "main": "index.js",
+  "peerDependencies": {
+    "react": "^18.2.0"
+  }
+}

lingui.config.js

@@ -9,21 +9,17 @@ module.exports = {
     'fi',
     'fr',
     'ga',
-    'gl',
     'hi',
     'hu',
     'id',
     'it',
     'ja',
     'ko',
-    'nl',
-    'pl',
     'pt-BR',
     'ru',
     'th',
     'tr',
     'uk',
-    'vi',
     'zh-CN',
     'zh-HK',
     'zh-TW',

metro.config.js

@@ -9,11 +9,6 @@ cfg.resolver.sourceExts = process.env.RN_SRC_EXT
 if (cfg.resolver.resolveRequest) {
   throw Error('Update this override because it is conflicting now.')
 }
-
-if (process.env.BSKY_PROFILE) {
-  cfg.cacheVersion += ':PROFILE'
-}
-
 cfg.resolver.resolveRequest = (context, moduleName, platform) => {
   // HACK: manually resolve a few packages that use `exports` in `package.json`.
   // A proper solution is to enable `unstable_enablePackageExports` but this needs careful testing.
@@ -34,15 +29,6 @@ cfg.resolver.resolveRequest = (context, moduleName, platform) => {
   if (moduleName === '@ipld/dag-cbor') {
     return context.resolveRequest(context, '@ipld/dag-cbor/src', platform)
   }
-  if (process.env.BSKY_PROFILE) {
-    if (moduleName.endsWith('ReactNativeRenderer-prod')) {
-      return context.resolveRequest(
-        context,
-        moduleName.replace('-prod', '-profiling'),
-        platform,
-      )
-    }
-  }
   return context.resolveRequest(context, moduleName, platform)
 }
 
@@ -52,10 +38,9 @@ cfg.transformer.getTransformOptions = async () => ({
     inlineRequires: true,
     nonInlinedRequires: [
       // We can remove this option and rely on the default after
-      // https://github.com/facebook/metro/pull/1390 is released.
+      // https://github.com/facebook/metro/pull/1126 is released.
       'React',
       'react',
-      'react-compiler-runtime',
       'react/jsx-dev-runtime',
       'react/jsx-runtime',
       'react-native',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bsky.app",
-  "version": "1.95.0",
+  "version": "1.94.0",
   "private": true,
   "engines": {
     "node": ">=20"
@@ -11,8 +11,6 @@
     "postinstall": "patch-package && yarn intl:compile",
     "prebuild": "expo prebuild --clean",
     "android": "expo run:android",
-    "android:prod": "expo run:android --variant release",
-    "android:profile": "BSKY_PROFILE=1 expo run:android --variant release",
     "ios": "expo run:ios",
     "web": "expo start --web",
     "use-build-number": "./scripts/useBuildNumberEnv.sh",
@@ -25,6 +23,7 @@
     "build-embed": "cd bskyembed && yarn build && yarn build-snippet && cd .. && node ./scripts/post-embed-build.js",
     "start": "expo start --dev-client",
     "start:prod": "expo start --dev-client --no-dev --minify",
+    "clean-cache": "rm -rf node_modules/.cache/babel-loader/*",
     "test": "NODE_ENV=test jest --forceExit --testTimeout=20000 --bail",
     "test-watch": "NODE_ENV=test jest --watchAll",
     "test-ci": "NODE_ENV=test jest --ci --forceExit --reporters=default --reporters=jest-junit",
@@ -54,7 +53,7 @@
     "icons:optimize": "svgo -f ./assets/icons"
   },
   "dependencies": {
-    "@atproto/api": "^0.13.18",
+    "@atproto/api": "^0.13.11",
     "@braintree/sanitize-url": "^6.0.2",
     "@discord/bottom-sheet": "bluesky-social/react-native-bottom-sheet",
     "@emoji-mart/react": "^1.1.1",
@@ -90,18 +89,18 @@
     "@tanstack/query-async-storage-persister": "^5.25.0",
     "@tanstack/react-query": "^5.8.1",
     "@tanstack/react-query-persist-client": "^5.25.0",
-    "@tiptap/core": "^2.9.1",
-    "@tiptap/extension-document": "^2.9.1",
-    "@tiptap/extension-hard-break": "^2.9.1",
-    "@tiptap/extension-history": "^2.9.1",
-    "@tiptap/extension-mention": "^2.9.1",
-    "@tiptap/extension-paragraph": "^2.9.1",
-    "@tiptap/extension-placeholder": "^2.9.1",
-    "@tiptap/extension-text": "^2.9.1",
-    "@tiptap/html": "^2.9.1",
-    "@tiptap/pm": "^2.9.1",
-    "@tiptap/react": "^2.9.1",
-    "@tiptap/suggestion": "^2.9.1",
+    "@tiptap/core": "^2.6.6",
+    "@tiptap/extension-document": "^2.6.6",
+    "@tiptap/extension-hard-break": "^2.6.6",
+    "@tiptap/extension-history": "^2.6.6",
+    "@tiptap/extension-mention": "^2.6.6",
+    "@tiptap/extension-paragraph": "^2.6.6",
+    "@tiptap/extension-placeholder": "^2.6.6",
+    "@tiptap/extension-text": "^2.6.6",
+    "@tiptap/html": "^2.6.6",
+    "@tiptap/pm": "^2.6.6",
+    "@tiptap/react": "^2.6.6",
+    "@tiptap/suggestion": "^2.6.6",
     "@types/invariant": "^2.2.37",
     "@types/lodash.throttle": "^4.1.9",
     "@types/node": "^20.14.3",
@@ -141,7 +140,6 @@
     "expo-sharing": "^12.0.1",
     "expo-splash-screen": "~0.27.4",
     "expo-status-bar": "~1.12.1",
-    "expo-system-ui": "^3.0.4",
     "expo-task-manager": "~11.8.1",
     "expo-updates": "~0.25.14",
     "expo-web-browser": "~13.0.3",
@@ -154,6 +152,11 @@
     "lodash.chunk": "^4.2.0",
     "lodash.debounce": "^4.0.8",
     "lodash.isequal": "^4.5.0",
+    "lodash.omit": "^4.5.0",
+    "lodash.once": "^4.1.1",
+    "lodash.random": "^3.2.0",
+    "lodash.samplesize": "^4.2.0",
+    "lodash.set": "^4.3.2",
     "lodash.shuffle": "^4.2.0",
     "lodash.throttle": "^4.1.1",
     "multiformats": "^13.1.0",
@@ -163,14 +166,14 @@
     "postinstall-postinstall": "^2.1.0",
     "psl": "^1.9.0",
     "react": "18.2.0",
-    "react-compiler-runtime": "19.0.0-beta-a7bf2bd-20241110",
+    "react-compiler-runtime": "file:./lib/react-compiler-runtime",
     "react-dom": "^18.2.0",
     "react-image-crop": "^11.0.7",
     "react-keyed-flatten-children": "^3.0.0",
     "react-native": "0.74.1",
     "react-native-compressor": "^1.8.24",
     "react-native-date-picker": "^4.4.2",
-    "react-native-drawer-layout": "^4.0.1",
+    "react-native-drawer-layout": "^4.0.0-alpha.3",
     "react-native-gesture-handler": "2.20.0",
     "react-native-get-random-values": "~1.11.0",
     "react-native-image-crop-picker": "0.41.2",
@@ -204,7 +207,7 @@
     "zod": "^3.20.2"
   },
   "devDependencies": {
-    "@atproto/dev-env": "^0.3.64",
+    "@atproto/dev-env": "^0.3.55",
     "@babel/core": "^7.23.2",
     "@babel/preset-env": "^7.20.0",
     "@babel/runtime": "^7.20.0",
@@ -214,35 +217,44 @@
     "@lingui/cli": "^4.5.0",
     "@lingui/macro": "^4.5.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.11",
-    "@react-native/eslint-config": "^0.76.2",
+    "@react-native-community/eslint-config": "^3.0.0",
     "@react-native/typescript-config": "^0.74.1",
     "@testing-library/jest-native": "^5.4.1",
     "@testing-library/react-native": "^11.5.2",
+    "@tsconfig/react-native": "^2.0.3",
+    "@types/he": "^1.1.2",
     "@types/jest": "^29.4.0",
     "@types/lodash.chunk": "^4.2.7",
     "@types/lodash.debounce": "^4.0.7",
     "@types/lodash.isequal": "^4.5.6",
+    "@types/lodash.omit": "^4.5.7",
+    "@types/lodash.once": "^4.1.7",
+    "@types/lodash.random": "^3.2.7",
+    "@types/lodash.samplesize": "^4.2.7",
+    "@types/lodash.set": "^4.3.7",
     "@types/lodash.shuffle": "^4.2.7",
     "@types/psl": "^1.1.1",
     "@types/react-dom": "^18.2.18",
     "@types/react-responsive": "^8.0.5",
     "@types/react-test-renderer": "^17.0.1",
-    "@typescript-eslint/eslint-plugin": "^7.18.0",
-    "@typescript-eslint/parser": "^7.18.0",
+    "@typescript-eslint/eslint-plugin": "^5.48.2",
+    "@typescript-eslint/parser": "^5.48.2",
     "babel-jest": "^29.7.0",
+    "babel-loader": "^9.1.2",
     "babel-plugin-macros": "^3.1.0",
     "babel-plugin-module-resolver": "^5.0.0",
-    "babel-plugin-react-compiler": "19.0.0-beta-a7bf2bd-20241110",
+    "babel-plugin-react-compiler": "^0.0.0-experimental-592953e-20240517",
+    "babel-plugin-react-native-web": "^0.18.12",
     "babel-preset-expo": "^10.0.0",
     "eslint": "^8.19.0",
     "eslint-plugin-bsky-internal": "link:./eslint",
     "eslint-plugin-ft-flow": "^2.0.3",
     "eslint-plugin-lingui": "^0.2.0",
     "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-compiler": "19.0.0-beta-a7bf2bd-20241110",
+    "eslint-plugin-react-compiler": "^0.0.0-experimental-c8b3f72-20240517",
     "eslint-plugin-react-native-a11y": "^3.3.0",
     "eslint-plugin-simple-import-sort": "^12.0.0",
-    "file-loader": "6.2.0",
+    "html-webpack-plugin": "^5.5.0",
     "husky": "^8.0.3",
     "is-ci": "^3.0.1",
     "jest": "^29.7.0",
@@ -253,19 +265,25 @@
     "prettier": "^2.8.3",
     "react-native-dotenv": "^3.3.1",
     "react-refresh": "^0.14.0",
+    "react-scripts": "^5.0.1",
     "react-test-renderer": "18.2.0",
     "svgo": "^3.3.2",
     "ts-node": "^10.9.1",
-    "typescript": "^5.7.2",
-    "webpack-bundle-analyzer": "^4.10.1"
+    "typescript": "^5.5.4",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.75.0",
+    "webpack-bundle-analyzer": "^4.10.1",
+    "webpack-cli": "^5.0.1",
+    "webpack-dev-server": "^4.11.1"
   },
   "resolutions": {
-    "@radix-ui/react-focus-scope": "1.1.0",
-    "@react-native/babel-preset": "0.74.1",
     "@types/react": "^18",
+    "**/zeed-dom": "0.10.9",
+    "**/zod": "3.23.8",
     "**/expo-constants": "16.0.1",
     "**/expo-device": "6.0.2",
-    "**/zod": "3.23.8"
+    "@react-native/babel-preset": "0.74.1",
+    "@radix-ui/react-focus-scope": "1.1.0"
   },
   "jest": {
     "preset": "jest-expo/ios",

patches/react-native+0.74.1.patch

@@ -9,7 +9,7 @@ index caa5540..c5d4e67 100644
 -                                                  type != nil && [type length] > 0 ? type : @"application/octet-stream",
 +                                                  ![type isEqual:[NSNull null]] && [type length] > 0 ? type : @"application/octet-stream",
                                                    [data base64EncodedStringWithOptions:0]];
- 
+
        resolve(text);
 diff --git a/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.mm b/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.mm
 index b0d71dc..41b9a0e 100644
@@ -18,7 +18,7 @@ index b0d71dc..41b9a0e 100644
 @@ -377,10 +377,6 @@ - (void)textInputDidBeginEditing
      self.backedTextInputView.attributedText = [NSAttributedString new];
    }
- 
+
 -  if (_selectTextOnFocus) {
 -    [self.backedTextInputView selectAll:nil];
 -  }
@@ -35,7 +35,7 @@ index b0d71dc..41b9a0e 100644
 +    [self.backedTextInputView selectAll:nil];
 +  }
  }
- 
+
  - (void)reactBlur
 diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h
 index e9b330f..ec5f58c 100644
@@ -48,10 +48,10 @@ index e9b330f..ec5f58c 100644
 +@property (nonatomic, copy) UIColor *customTintColor;
 +
 +- (void)forwarderBeginRefreshing;
- 
+
  @end
 diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-index b09e653..d2b4e05 100644
+index b09e653..288e60c 100644
 --- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
 +++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
 @@ -22,6 +22,7 @@ @implementation RCTRefreshControl {
@@ -60,12 +60,12 @@ index b09e653..d2b4e05 100644
    CGFloat _progressViewOffset;
 +  UIColor *_customTintColor;
  }
- 
+
  - (instancetype)init
 @@ -56,6 +57,12 @@ - (void)layoutSubviews
    _isInitialRender = false;
  }
- 
+
 +- (void)didMoveToSuperview
 +{
 +  [super didMoveToSuperview];
@@ -78,7 +78,7 @@ index b09e653..d2b4e05 100644
 @@ -203,4 +210,58 @@ - (void)refreshControlValueChanged
    }
  }
- 
+
 +- (void)setCustomTintColor:(UIColor *)customTintColor
 +{
 +  _customTintColor = customTintColor;
@@ -139,139 +139,26 @@ index 40aaf9c..1c60164 100644
 --- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m
 +++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m
 @@ -22,11 +22,12 @@ - (UIView *)view
- 
+
  RCT_EXPORT_VIEW_PROPERTY(onRefresh, RCTDirectEventBlock)
  RCT_EXPORT_VIEW_PROPERTY(refreshing, BOOL)
 -RCT_EXPORT_VIEW_PROPERTY(tintColor, UIColor)
  RCT_EXPORT_VIEW_PROPERTY(title, NSString)
  RCT_EXPORT_VIEW_PROPERTY(titleColor, UIColor)
  RCT_EXPORT_VIEW_PROPERTY(progressViewOffset, CGFloat)
- 
+
 +RCT_REMAP_VIEW_PROPERTY(tintColor, customTintColor, UIColor)
 +
  RCT_EXPORT_METHOD(setNativeRefreshing : (nonnull NSNumber *)viewTag toRefreshing : (BOOL)refreshing)
  {
    [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-diff --git a/node_modules/react-native/React/Views/ScrollView/RCTScrollView.m b/node_modules/react-native/React/Views/ScrollView/RCTScrollView.m
-index 1aead51..39e6244 100644
---- a/node_modules/react-native/React/Views/ScrollView/RCTScrollView.m
-+++ b/node_modules/react-native/React/Views/ScrollView/RCTScrollView.m
-@@ -159,31 +159,6 @@ - (BOOL)touchesShouldCancelInContentView:(__unused UIView *)view
-   return !shouldDisableScrollInteraction;
- }
- 
--/*
-- * Automatically centers the content such that if the content is smaller than the
-- * ScrollView, we force it to be centered, but when you zoom or the content otherwise
-- * becomes larger than the ScrollView, there is no padding around the content but it
-- * can still fill the whole view.
-- */
--- (void)setContentOffset:(CGPoint)contentOffset
--{
--  UIView *contentView = [self contentView];
--  if (contentView && _centerContent && !CGSizeEqualToSize(contentView.frame.size, CGSizeZero)) {
--    CGSize subviewSize = contentView.frame.size;
--    CGSize scrollViewSize = self.bounds.size;
--    if (subviewSize.width <= scrollViewSize.width) {
--      contentOffset.x = -(scrollViewSize.width - subviewSize.width) / 2.0;
--    }
--    if (subviewSize.height <= scrollViewSize.height) {
--      contentOffset.y = -(scrollViewSize.height - subviewSize.height) / 2.0;
--    }
--  }
--
--  super.contentOffset = CGPointMake(
--      RCTSanitizeNaNValue(contentOffset.x, @"scrollView.contentOffset.x"),
--      RCTSanitizeNaNValue(contentOffset.y, @"scrollView.contentOffset.y"));
--}
--
- - (void)setFrame:(CGRect)frame
- {
-   // Preserving and revalidating `contentOffset`.
-@@ -427,6 +402,11 @@ - (void)setRemoveClippedSubviews:(__unused BOOL)removeClippedSubviews
-   // Does nothing
- }
- 
-+- (void)setFrame:(CGRect)frame {
-+  [super setFrame:frame];
-+  [self centerContentIfNeeded];
-+}
-+
- - (void)insertReactSubview:(UIView *)view atIndex:(NSInteger)atIndex
- {
-   [super insertReactSubview:view atIndex:atIndex];
-@@ -444,6 +424,8 @@ - (void)insertReactSubview:(UIView *)view atIndex:(NSInteger)atIndex
-     RCTApplyTransformationAccordingLayoutDirection(_contentView, self.reactLayoutDirection);
-     [_scrollView addSubview:view];
-   }
-+
-+  [self centerContentIfNeeded];
- }
- 
- - (void)removeReactSubview:(UIView *)subview
-@@ -652,9 +634,46 @@ -(void)delegateMethod : (UIScrollView *)scrollView        \
-   }
- 
- RCT_SCROLL_EVENT_HANDLER(scrollViewWillBeginDecelerating, onMomentumScrollBegin)
--RCT_SCROLL_EVENT_HANDLER(scrollViewDidZoom, onScroll)
- RCT_SCROLL_EVENT_HANDLER(scrollViewDidScrollToTop, onScrollToTop)
- 
-+-(void)scrollViewDidZoom : (UIScrollView *)scrollView
-+{
-+  [self centerContentIfNeeded];
-+
-+  RCT_SEND_SCROLL_EVENT(onScroll, nil);
-+  RCT_FORWARD_SCROLL_EVENT(scrollViewDidZoom : scrollView);
-+}
-+
-+/*
-+ * Automatically centers the content such that if the content is smaller than the
-+ * ScrollView, we force it to be centered, but when you zoom or the content otherwise
-+ * becomes larger than the ScrollView, there is no padding around the content but it
-+ * can still fill the whole view.
-+ *
-+ * PATCHED: This deviates from the original React Native implementation to fix two issues:
-+ *
-+ * - The scroll view was swallowing any taps immediately after pinching
-+ * - The scroll view was jittering when crossing the full screen threshold while pinching
-+ *
-+ * This implementation is based on https://petersteinberger.com/blog/2013/how-to-center-uiscrollview/.
-+ */
-+-(void)centerContentIfNeeded
-+{
-+  if (_scrollView.centerContent &&
-+      !CGSizeEqualToSize(self.contentSize, CGSizeZero) &&
-+      !CGSizeEqualToSize(self.bounds.size, CGSizeZero)
-+  ) {
-+    CGFloat top = 0, left = 0;
-+    if (self.contentSize.width < self.bounds.size.width) {
-+      left = (self.bounds.size.width - self.contentSize.width) * 0.5f;
-+    }
-+    if (self.contentSize.height < self.bounds.size.height) {
-+      top = (self.bounds.size.height - self.contentSize.height) * 0.5f;
-+    }
-+    _scrollView.contentInset = UIEdgeInsetsMake(top, left, top, left);
-+  }
-+}
-+
- - (void)addScrollListener:(NSObject<UIScrollViewDelegate> *)scrollListener
- {
-   [_scrollListeners addObject:scrollListener];
-@@ -913,6 +932,7 @@ - (void)updateContentSizeIfNeeded
-   CGSize contentSize = self.contentSize;
-   if (!CGSizeEqualToSize(_scrollView.contentSize, contentSize)) {
-     _scrollView.contentSize = contentSize;
-+    [self centerContentIfNeeded];
-   }
- }
- 
 diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java
 index 5f5e1ab..aac00b6 100644
 --- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java
 +++ b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java
 @@ -99,8 +99,9 @@ public class JavaTimerManager {
        }
- 
+
        // If the JS thread is busy for multiple frames we cancel any other pending runnable.
 -      if (mCurrentIdleCallbackRunnable != null) {
 -        mCurrentIdleCallbackRunnable.cancel();
@@ -279,5 +166,5 @@ index 5f5e1ab..aac00b6 100644
 +      if (currentRunnable != null) {
 +        currentRunnable.cancel();
        }
- 
+
        mCurrentIdleCallbackRunnable = new IdleCallbackRunnable(frameTimeNanos);

patches/react-native-svg+15.3.0.patch

@@ -1,57 +0,0 @@
-diff --git a/node_modules/react-native-svg/android/src/main/java/com/horcrux/svg/PathView.java b/node_modules/react-native-svg/android/src/main/java/com/horcrux/svg/PathView.java
-index 06829bd..1b15818 100644
---- a/node_modules/react-native-svg/android/src/main/java/com/horcrux/svg/PathView.java
-+++ b/node_modules/react-native-svg/android/src/main/java/com/horcrux/svg/PathView.java
-@@ -14,17 +14,33 @@ import android.graphics.Paint;
- import android.graphics.Path;
- import com.facebook.react.bridge.ReactContext;
- 
-+import java.util.ArrayList;
-+import java.util.HashMap;
-+
-+class ParsedPath {
-+  final Path path;
-+  final ArrayList<PathElement> elements;
-+
-+  ParsedPath(Path path, ArrayList<PathElement> elements) {
-+    this.path = path;
-+    this.elements = elements;
-+  }
-+}
-+
- @SuppressLint("ViewConstructor")
- class PathView extends RenderableView {
-   private Path mPath;
- 
-+  // This grows forever but for our use case (static icons) it's ok.
-+  private static final HashMap<String, ParsedPath> sPathCache = new HashMap<>();
-+
-   public PathView(ReactContext reactContext) {
-     super(reactContext);
-     PathParser.mScale = mScale;
-     mPath = new Path();
-   }
- 
--  public void setD(String d) {
-+  void setDByParsing(String d) {
-     mPath = PathParser.parse(d);
-     elements = PathParser.elements;
-     for (PathElement elem : elements) {
-@@ -33,6 +49,17 @@ class PathView extends RenderableView {
-         point.y *= mScale;
-       }
-     }
-+  }
-+
-+  public void setD(String d) {
-+    ParsedPath cached = sPathCache.get(d);
-+    if (cached != null) {
-+      mPath = cached.path;
-+      elements = cached.elements;
-+    } else {
-+      setDByParsing(d);
-+      sPathCache.put(d, new ParsedPath(mPath, elements));
-+    }
-     invalidate();
-   }
- 

src/App.native.tsx

@@ -69,7 +69,6 @@ import {Provider as PortalProvider} from '#/components/Portal'
 import {Splash} from '#/Splash'
 import {BottomSheetProvider} from '../modules/bottom-sheet'
 import {BackgroundNotificationPreferencesProvider} from '../modules/expo-background-notification-handler/src/BackgroundNotificationHandlerProvider'
-import {AppProfiler} from './AppProfiler'
 
 SplashScreen.preventAutoHideAsync()
 
@@ -185,42 +184,40 @@ function App() {
    * that is set up in the InnerApp component above.
    */
   return (
-    <AppProfiler>
-      <GeolocationProvider>
-        <A11yProvider>
-          <KeyboardProvider enabled={false} statusBarTranslucent={true}>
-            <SessionProvider>
-              <PrefsStateProvider>
-                <I18nProvider>
-                  <ShellStateProvider>
-                    <InvitesStateProvider>
-                      <ModalStateProvider>
-                        <DialogStateProvider>
-                          <LightboxStateProvider>
-                            <PortalProvider>
-                              <BottomSheetProvider>
-                                <StarterPackProvider>
-                                  <SafeAreaProvider
-                                    initialMetrics={initialWindowMetrics}>
-                                    <IntentDialogProvider>
-                                      <InnerApp />
-                                    </IntentDialogProvider>
-                                  </SafeAreaProvider>
-                                </StarterPackProvider>
-                              </BottomSheetProvider>
-                            </PortalProvider>
-                          </LightboxStateProvider>
-                        </DialogStateProvider>
-                      </ModalStateProvider>
-                    </InvitesStateProvider>
-                  </ShellStateProvider>
-                </I18nProvider>
-              </PrefsStateProvider>
-            </SessionProvider>
-          </KeyboardProvider>
-        </A11yProvider>
-      </GeolocationProvider>
-    </AppProfiler>
+    <GeolocationProvider>
+      <A11yProvider>
+        <KeyboardProvider enabled={false} statusBarTranslucent={true}>
+          <SessionProvider>
+            <PrefsStateProvider>
+              <I18nProvider>
+                <ShellStateProvider>
+                  <InvitesStateProvider>
+                    <ModalStateProvider>
+                      <DialogStateProvider>
+                        <LightboxStateProvider>
+                          <PortalProvider>
+                            <BottomSheetProvider>
+                              <StarterPackProvider>
+                                <SafeAreaProvider
+                                  initialMetrics={initialWindowMetrics}>
+                                  <IntentDialogProvider>
+                                    <InnerApp />
+                                  </IntentDialogProvider>
+                                </SafeAreaProvider>
+                              </StarterPackProvider>
+                            </BottomSheetProvider>
+                          </PortalProvider>
+                        </LightboxStateProvider>
+                      </DialogStateProvider>
+                    </ModalStateProvider>
+                  </InvitesStateProvider>
+                </ShellStateProvider>
+              </I18nProvider>
+            </PrefsStateProvider>
+          </SessionProvider>
+        </KeyboardProvider>
+      </A11yProvider>
+    </GeolocationProvider>
   )
 }
 

src/AppProfiler.tsx

@@ -1,29 +0,0 @@
-import React, {Profiler} from 'react'
-
-// Don't let it get stripped out in profiling builds (which apply production Babel preset).
-const log = (global as any)['con' + 'sole'].log
-
-function onRender(id: string, phase: string, actualDuration: number) {
-  if (!__DEV__) {
-    // This block of code will exist in the production build of the app.
-    // However, only profiling builds of React call `onRender` so it's dead code in actual production.
-    const message = `<Profiler> ${id}:${phase} ${
-      actualDuration > 500
-        ? '(╯°□°）╯ '
-        : actualDuration > 100
-        ? '[!!] '
-        : actualDuration > 16
-        ? '[!] '
-        : ''
-    }${Math.round(actualDuration)}ms`
-    log(message)
-  }
-}
-
-export function AppProfiler({children}: {children: React.ReactNode}) {
-  return (
-    <Profiler id="app" onRender={onRender}>
-      {children}
-    </Profiler>
-  )
-}

src/Navigation.tsx

@@ -32,7 +32,7 @@ import {
 import {RouteParams, State} from '#/lib/routes/types'
 import {attachRouteToLogEvents, logEvent} from '#/lib/statsig/statsig'
 import {bskyTitle} from '#/lib/strings/headings'
-import {isNative, isWeb} from '#/platform/detection'
+import {isAndroid, isNative, isWeb} from '#/platform/detection'
 import {useModalControls} from '#/state/modals'
 import {useUnreadNotifications} from '#/state/queries/notifications/unread'
 import {useSession} from '#/state/session'
@@ -453,6 +453,7 @@ function HomeTabNavigator() {
   return (
     <HomeTab.Navigator
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,
@@ -471,6 +472,7 @@ function SearchTabNavigator() {
   return (
     <SearchTab.Navigator
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,
@@ -488,6 +490,7 @@ function NotificationsTabNavigator() {
   return (
     <NotificationsTab.Navigator
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,
@@ -509,6 +512,7 @@ function MyProfileTabNavigator() {
   return (
     <MyProfileTab.Navigator
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,
@@ -534,6 +538,7 @@ function MessagesTabNavigator() {
   return (
     <MessagesTab.Navigator
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,
@@ -567,6 +572,7 @@ const FlatNavigator = () => {
     <Flat.Navigator
       screenListeners={screenListeners}
       screenOptions={{
+        animation: isAndroid ? 'ios' : undefined,
         animationDuration: 285,
         gestureEnabled: true,
         fullScreenGestureEnabled: true,

src/Splash.tsx

@@ -81,40 +81,40 @@ export function Splash(props: React.PropsWithChildren<Props>) {
     return {
       transform: [
         {
-          scale: interpolate(intro.get(), [0, 1], [0.8, 1], 'clamp'),
+          scale: interpolate(intro.value, [0, 1], [0.8, 1], 'clamp'),
         },
         {
           scale: interpolate(
-            outroLogo.get(),
+            outroLogo.value,
             [0, 0.08, 1],
             [1, 0.8, 500],
             'clamp',
           ),
         },
       ],
-      opacity: interpolate(intro.get(), [0, 1], [0, 1], 'clamp'),
+      opacity: interpolate(intro.value, [0, 1], [0, 1], 'clamp'),
     }
   })
   const bottomLogoAnimation = useAnimatedStyle(() => {
     return {
-      opacity: interpolate(intro.get(), [0, 1], [0, 1], 'clamp'),
+      opacity: interpolate(intro.value, [0, 1], [0, 1], 'clamp'),
     }
   })
   const reducedLogoAnimation = useAnimatedStyle(() => {
     return {
       transform: [
         {
-          scale: interpolate(intro.get(), [0, 1], [0.8, 1], 'clamp'),
+          scale: interpolate(intro.value, [0, 1], [0.8, 1], 'clamp'),
         },
       ],
-      opacity: interpolate(intro.get(), [0, 1], [0, 1], 'clamp'),
+      opacity: interpolate(intro.value, [0, 1], [0, 1], 'clamp'),
     }
   })
 
   const logoWrapperAnimation = useAnimatedStyle(() => {
     return {
       opacity: interpolate(
-        outroAppOpacity.get(),
+        outroAppOpacity.value,
         [0, 0.1, 0.2, 1],
         [1, 1, 0, 0],
         'clamp',
@@ -126,11 +126,11 @@ export function Splash(props: React.PropsWithChildren<Props>) {
     return {
       transform: [
         {
-          scale: interpolate(outroApp.get(), [0, 1], [1.1, 1], 'clamp'),
+          scale: interpolate(outroApp.value, [0, 1], [1.1, 1], 'clamp'),
         },
       ],
       opacity: interpolate(
-        outroAppOpacity.get(),
+        outroAppOpacity.value,
         [0, 0.1, 0.2, 1],
         [0, 0, 1, 1],
         'clamp',
@@ -146,37 +146,29 @@ export function Splash(props: React.PropsWithChildren<Props>) {
     if (isReady) {
       SplashScreen.hideAsync()
         .then(() => {
-          intro.set(() =>
-            withTiming(
-              1,
-              {duration: 400, easing: Easing.out(Easing.cubic)},
-              async () => {
-                // set these values to check animation at specific point
-                // outroLogo.set(0.1)
-                // outroApp.set(0.1)
-                outroLogo.set(() =>
-                  withTiming(
-                    1,
-                    {duration: 1200, easing: Easing.in(Easing.cubic)},
-                    () => {
-                      runOnJS(onFinish)()
-                    },
-                  ),
-                )
-                outroApp.set(() =>
-                  withTiming(1, {
-                    duration: 1200,
-                    easing: Easing.inOut(Easing.cubic),
-                  }),
-                )
-                outroAppOpacity.set(() =>
-                  withTiming(1, {
-                    duration: 1200,
-                    easing: Easing.in(Easing.cubic),
-                  }),
-                )
-              },
-            ),
+          intro.value = withTiming(
+            1,
+            {duration: 400, easing: Easing.out(Easing.cubic)},
+            async () => {
+              // set these values to check animation at specific point
+              // outroLogo.value = 0.1
+              // outroApp.value = 0.1
+              outroLogo.value = withTiming(
+                1,
+                {duration: 1200, easing: Easing.in(Easing.cubic)},
+                () => {
+                  runOnJS(onFinish)()
+                },
+              )
+              outroApp.value = withTiming(1, {
+                duration: 1200,
+                easing: Easing.inOut(Easing.cubic),
+              })
+              outroAppOpacity.value = withTiming(1, {
+                duration: 1200,
+                easing: Easing.in(Easing.cubic),
+              })
+            },
           )
         })
         .catch(() => {})

src/alf/typography.tsx

@@ -1,126 +0,0 @@
-import React, {Children} from 'react'
-import {TextProps as RNTextProps} from 'react-native'
-import {StyleProp, TextStyle} from 'react-native'
-import {UITextView} from 'react-native-uitextview'
-import createEmojiRegex from 'emoji-regex'
-
-import {isNative} from '#/platform/detection'
-import {isIOS} from '#/platform/detection'
-import {Alf, applyFonts, atoms, flatten} from '#/alf'
-
-/**
- * Util to calculate lineHeight from a text size atom and a leading atom
- *
- * Example:
- *   `leading(atoms.text_md, atoms.leading_normal)` // => 24
- */
-export function leading<
-  Size extends {fontSize?: number},
-  Leading extends {lineHeight?: number},
->(textSize: Size, leading: Leading) {
-  const size = textSize?.fontSize || atoms.text_md.fontSize
-  const lineHeight = leading?.lineHeight || atoms.leading_normal.lineHeight
-  return Math.round(size * lineHeight)
-}
-
-/**
- * Ensures that `lineHeight` defaults to a relative value of `1`, or applies
- * other relative leading atoms.
- *
- * If the `lineHeight` value is > 2, we assume it's an absolute value and
- * returns it as-is.
- */
-export function normalizeTextStyles(
-  styles: StyleProp<TextStyle>,
-  {
-    fontScale,
-    fontFamily,
-  }: {
-    fontScale: number
-    fontFamily: Alf['fonts']['family']
-  } & Pick<Alf, 'flags'>,
-) {
-  const s = flatten(styles)
-  // should always be defined on these components
-  s.fontSize = (s.fontSize || atoms.text_md.fontSize) * fontScale
-
-  if (s?.lineHeight) {
-    if (s.lineHeight !== 0 && s.lineHeight <= 2) {
-      s.lineHeight = Math.round(s.fontSize * s.lineHeight)
-    }
-  } else if (!isNative) {
-    s.lineHeight = s.fontSize
-  }
-
-  applyFonts(s, fontFamily)
-
-  return s
-}
-
-export type StringChild = string | (string | null)[]
-export type TextProps = RNTextProps & {
-  /**
-   * Lets the user select text, to use the native copy and paste functionality.
-   */
-  selectable?: boolean
-  /**
-   * Provides `data-*` attributes to the underlying `UITextView` component on
-   * web only.
-   */
-  dataSet?: Record<string, string | number | undefined>
-  /**
-   * Appears as a small tooltip on web hover.
-   */
-  title?: string
-  /**
-   * Whether the children could possibly contain emoji.
-   */
-  emoji?: boolean
-}
-
-const EMOJI = createEmojiRegex()
-
-export function childHasEmoji(children: React.ReactNode) {
-  let hasEmoji = false
-  Children.forEach(children, child => {
-    if (typeof child === 'string' && createEmojiRegex().test(child)) {
-      hasEmoji = true
-    }
-  })
-  return hasEmoji
-}
-
-export function renderChildrenWithEmoji(
-  children: React.ReactNode,
-  props: Omit<TextProps, 'children'> = {},
-  emoji: boolean,
-) {
-  if (!isIOS || !emoji) {
-    return children
-  }
-  return Children.map(children, child => {
-    if (typeof child !== 'string') return child
-
-    const emojis = child.match(EMOJI)
-
-    if (emojis === null) {
-      return child
-    }
-
-    return child.split(EMOJI).map((stringPart, index) => [
-      stringPart,
-      emojis[index] ? (
-        <UITextView
-          {...props}
-          style={[props?.style, {color: 'black', fontFamily: 'System'}]}>
-          {emojis[index]}
-        </UITextView>
-      ) : null,
-    ])
-  })
-}
-
-const SINGLE_EMOJI_RE = /^[\p{Emoji_Presentation}\p{Extended_Pictographic}]+$/u
-export function isOnlyEmoji(text: string) {
-  return text.length <= 15 && SINGLE_EMOJI_RE.test(text)
-}

src/components/AvatarStack.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import {moderateProfile} from '@atproto/api'
 

src/components/Button.tsx

@@ -458,6 +458,7 @@ export const Button = React.forwardRef<View, ButtonProps>(
         // @ts-ignore - this will always be a pressable
         ref={ref}
         aria-label={label}
+        aria-pressed={state.pressed}
         accessibilityLabel={label}
         disabled={disabled || false}
         accessibilityState={{

src/components/Dialog/index.tsx

@@ -75,7 +75,7 @@ export function Outer({
       try {
         cb()
       } catch (e: any) {
-        logger.error(e || 'Error running close callback')
+        logger.error('Error running close callback', e)
       }
     }
 

src/components/Dialog/index.web.tsx

@@ -7,6 +7,7 @@ import {
   View,
   ViewStyle,
 } from 'react-native'
+import Animated, {FadeIn, FadeInDown} from 'react-native-reanimated'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {DismissableLayer} from '@radix-ui/react-dismissable-layer'
@@ -41,6 +42,7 @@ export function Outer({
   onClose,
 }: React.PropsWithChildren<DialogOuterProps>) {
   const {_} = useLingui()
+  const t = useTheme()
   const {gtMobile} = useBreakpoints()
   const [isOpen, setIsOpen] = React.useState(false)
   const {setDialogIsOpen} = useDialogStateControlContext()
@@ -116,7 +118,16 @@ export function Outer({
                   gtMobile ? a.p_lg : a.p_md,
                   {overflowY: 'auto'},
                 ]}>
-                <Backdrop />
+                <Animated.View
+                  entering={FadeIn.duration(150)}
+                  // exiting={FadeOut.duration(150)}
+                  style={[
+                    web(a.fixed),
+                    a.inset_0,
+                    {opacity: 0.8, backgroundColor: t.palette.black},
+                  ]}
+                />
+
                 <View
                   style={[
                     a.w_full,
@@ -153,7 +164,7 @@ export function Inner({
   useFocusGuards()
   return (
     <FocusScope loop asChild trapped>
-      <View
+      <Animated.View
         role="dialog"
         aria-role="dialog"
         aria-label={label}
@@ -163,6 +174,8 @@ export function Inner({
         onClick={stopPropagation}
         onStartShouldSetResponder={_ => true}
         onTouchEnd={stopPropagation}
+        entering={FadeInDown.duration(100)}
+        // exiting={FadeOut.duration(100)}
         style={flatten([
           a.relative,
           a.rounded_md,
@@ -175,8 +188,6 @@ export function Inner({
             shadowColor: t.palette.black,
             shadowOpacity: t.name === 'light' ? 0.1 : 0.4,
             shadowRadius: 30,
-            // @ts-ignore web only
-            animation: 'fadeIn ease-out 0.1s',
           },
           flatten(style),
         ])}>
@@ -190,7 +201,7 @@ export function Inner({
             {children}
           </View>
         </DismissableLayer>
-      </View>
+      </Animated.View>
     </FocusScope>
   )
 }
@@ -257,25 +268,3 @@ export function Close() {
 export function Handle() {
   return null
 }
-
-function Backdrop() {
-  const t = useTheme()
-  return (
-    <View
-      style={{
-        opacity: 0.8,
-      }}>
-      <View
-        style={[
-          a.fixed,
-          a.inset_0,
-          {
-            backgroundColor: t.palette.black,
-            // @ts-ignore web only
-            animation: 'fadeIn ease-out 0.15s',
-          },
-        ]}
-      />
-    </View>
-  )
-}

src/components/Dialog/shared.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import {StyleProp, TextStyle, View, ViewStyle} from 'react-native'
 
-import {atoms as a, useTheme} from '#/alf'
+import {atoms as a, useTheme, web} from '#/alf'
 import {Text} from '#/components/Typography'
 
 export function Header({
@@ -29,8 +29,10 @@ export function Header({
         a.border_b,
         t.atoms.border_contrast_medium,
         t.atoms.bg,
-        {borderTopLeftRadius: a.rounded_md.borderRadius},
-        {borderTopRightRadius: a.rounded_md.borderRadius},
+        web([
+          {borderRadiusTopLeft: a.rounded_md.borderRadius},
+          {borderRadiusTopRight: a.rounded_md.borderRadius},
+        ]),
         style,
       ]}>
       {renderLeft && (

src/components/Divider.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 
 import {atoms as a, flatten, useTheme, ViewStyleProp} from '#/alf'

src/components/Error.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'

src/components/GradientFill.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {LinearGradient} from 'expo-linear-gradient'
 
 import {atoms as a, tokens} from '#/alf'

src/components/IconCircle.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 
 import {

src/components/LikesDialog.tsx

@@ -1,4 +1,4 @@
-import {useCallback, useMemo} from 'react'
+import React, {useCallback, useMemo} from 'react'
 import {ActivityIndicator, FlatList, View} from 'react-native'
 import {AppBskyFeedGetLikes as GetLikes} from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'

src/components/Link.tsx

@@ -223,7 +223,7 @@ export function Link({
       {...web({
         hrefAttrs: {
           target: download ? undefined : isExternal ? 'blank' : undefined,
-          rel: isExternal ? 'noopener' : undefined,
+          rel: isExternal ? 'noopener noreferrer' : undefined,
           download,
         },
         dataSet: {
@@ -274,6 +274,11 @@ export function InlineLinkText({
     onOut: onHoverOut,
   } = useInteractionState()
   const {state: focused, onIn: onFocus, onOut: onBlur} = useInteractionState()
+  const {
+    state: pressed,
+    onIn: onPressIn,
+    onOut: onPressOut,
+  } = useInteractionState()
   const flattenedStyle = flatten(style) || {}
 
   return (
@@ -284,20 +289,19 @@ export function InlineLinkText({
       {...rest}
       style={[
         {color: t.palette.primary_500},
-        (hovered || focused) &&
+        (hovered || focused || pressed) &&
           !disableUnderline && {
-            ...web({
-              outline: 0,
-              textDecorationLine: 'underline',
-              textDecorationColor:
-                flattenedStyle.color ?? t.palette.primary_500,
-            }),
+            ...web({outline: 0}),
+            textDecorationLine: 'underline',
+            textDecorationColor: flattenedStyle.color ?? t.palette.primary_500,
           },
         flattenedStyle,
       ]}
       role="link"
       onPress={download ? undefined : onPress}
       onLongPress={onLongPress}
+      onPressIn={onPressIn}
+      onPressOut={onPressOut}
       onFocus={onFocus}
       onBlur={onBlur}
       onMouseEnter={onHoverIn}
@@ -307,7 +311,7 @@ export function InlineLinkText({
       {...web({
         hrefAttrs: {
           target: download ? undefined : isExternal ? 'blank' : undefined,
-          rel: isExternal ? 'noopener' : undefined,
+          rel: isExternal ? 'noopener noreferrer' : undefined,
           download,
         },
         dataSet: {

src/components/Loader.tsx

@@ -17,12 +17,13 @@ export function Loader(props: Props) {
   const rotation = useSharedValue(0)
 
   const animatedStyles = useAnimatedStyle(() => ({
-    transform: [{rotate: rotation.get() + 'deg'}],
+    transform: [{rotate: rotation.value + 'deg'}],
   }))
 
   React.useEffect(() => {
-    rotation.set(() =>
-      withRepeat(withTiming(360, {duration: 500, easing: Easing.linear}), -1),
+    rotation.value = withRepeat(
+      withTiming(360, {duration: 500, easing: Easing.linear}),
+      -1,
     )
   }, [rotation])
 

src/components/Loader.web.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 
 import {atoms as a, flatten, useTheme} from '#/alf'

src/components/Menu/index.web.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react/prop-types */
+
 import React from 'react'
 import {Pressable, StyleProp, View, ViewStyle} from 'react-native'
 import {msg} from '@lingui/macro'

src/components/ProfileHoverCard/index.web.tsx

@@ -302,8 +302,8 @@ export function ProfileHoverCardInner(props: ProfileHoverCardProps) {
   const animationStyle = {
     animation:
       currentState.stage === 'hiding'
-        ? `fadeOut ${HIDE_DURATION}ms both`
-        : `fadeIn ${SHOW_DURATION}ms both`,
+        ? `avatarHoverFadeOut ${HIDE_DURATION}ms both`
+        : `avatarHoverFadeIn ${SHOW_DURATION}ms both`,
   }
 
   return (

src/components/ProgressGuide/List.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleProp, View, ViewStyle} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'

src/components/ProgressGuide/Task.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import * as Progress from 'react-native-progress'
 

src/components/ProgressGuide/Toast.tsx

@@ -55,15 +55,13 @@ export const ProgressGuideToast = React.forwardRef<
 
     // animate the opacity then set isOpen to false when done
     const setIsntOpen = () => setIsOpen(false)
-    opacity.set(() =>
-      withTiming(
-        0,
-        {
-          duration: 400,
-          easing: Easing.out(Easing.cubic),
-        },
-        () => runOnJS(setIsntOpen)(),
-      ),
+    opacity.value = withTiming(
+      0,
+      {
+        duration: 400,
+        easing: Easing.out(Easing.cubic),
+      },
+      () => runOnJS(setIsntOpen)(),
     )
   }, [setIsOpen, opacity])
 
@@ -73,24 +71,20 @@ export const ProgressGuideToast = React.forwardRef<
 
     // animate the vertical translation, the opacity, and the checkmark
     const playCheckmark = () => animatedCheckRef.current?.play()
-    opacity.set(0)
-    opacity.set(() =>
-      withTiming(
-        1,
-        {
-          duration: 100,
-          easing: Easing.out(Easing.cubic),
-        },
-        () => runOnJS(playCheckmark)(),
-      ),
-    )
-    translateY.set(0)
-    translateY.set(() =>
-      withTiming(insets.top + 10, {
-        duration: 500,
+    opacity.value = 0
+    opacity.value = withTiming(
+      1,
+      {
+        duration: 100,
         easing: Easing.out(Easing.cubic),
-      }),
+      },
+      () => runOnJS(playCheckmark)(),
     )
+    translateY.value = 0
+    translateY.value = withTiming(insets.top + 10, {
+      duration: 500,
+      easing: Easing.out(Easing.cubic),
+    })
 
     // start the countdown timer to autoclose
     timeoutRef.current = setTimeout(close, visibleDuration || 5e3)
@@ -120,8 +114,8 @@ export const ProgressGuideToast = React.forwardRef<
   }, [winDim.width])
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{translateY: translateY.get()}],
-    opacity: opacity.get(),
+    transform: [{translateY: translateY.value}],
+    opacity: opacity.value,
   }))
 
   return (

src/components/ReportDialog/SelectLabelerView.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import {AppBskyLabelerDefs} from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'

src/components/RichText.tsx

@@ -9,7 +9,6 @@ import {NavigationProp} from '#/lib/routes/types'
 import {toShortUrl} from '#/lib/strings/url-helpers'
 import {isNative} from '#/platform/detection'
 import {atoms as a, flatten, native, TextStyleProp, useTheme, web} from '#/alf'
-import {isOnlyEmoji} from '#/alf/typography'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 import {InlineLinkText, LinkProps} from '#/components/Link'
 import {ProfileHoverCard} from '#/components/ProfileHoverCard'
@@ -54,6 +53,7 @@ export function RichText({
   const plainStyles = [a.leading_snug, flattenedStyle]
   const interactiveStyles = [
     a.leading_snug,
+    a.pointer_events_auto,
     flatten(interactiveStyle),
     flattenedStyle,
   ]
@@ -151,14 +151,17 @@ export function RichText({
         />,
       )
     } else {
-      els.push(segment.text)
+      els.push(
+        <Text key={key} emoji style={plainStyles}>
+          {segment.text}
+        </Text>,
+      )
     }
     key++
   }
 
   return (
     <Text
-      emoji
       selectable={selectable}
       testID={testID}
       style={plainStyles}
@@ -191,6 +194,11 @@ function RichTextTag({
     onOut: onHoverOut,
   } = useInteractionState()
   const {state: focused, onIn: onFocus, onOut: onBlur} = useInteractionState()
+  const {
+    state: pressed,
+    onIn: onPressIn,
+    onOut: onPressOut,
+  } = useInteractionState()
   const navigation = useNavigation<NavigationProp>()
 
   const navigateToPage = React.useCallback(() => {
@@ -220,6 +228,8 @@ function RichTextTag({
             accessibilityRole: isNative ? 'button' : undefined,
             onPress: navigateToPage,
             onLongPress: openDialog,
+            onPressIn: onPressIn,
+            onPressOut: onPressOut,
           })}
           {...web({
             onMouseEnter: onHoverIn,
@@ -233,12 +243,10 @@ function RichTextTag({
               cursor: 'pointer',
             }),
             {color: t.palette.primary_500},
-            (hovered || focused) && {
-              ...web({
-                outline: 0,
-                textDecorationLine: 'underline',
-                textDecorationColor: t.palette.primary_500,
-              }),
+            (hovered || focused || pressed) && {
+              ...web({outline: 0}),
+              textDecorationLine: 'underline',
+              textDecorationColor: t.palette.primary_500,
             },
             style,
           ]}>
@@ -248,3 +256,10 @@ function RichTextTag({
     </React.Fragment>
   )
 }
+
+export function isOnlyEmoji(text: string) {
+  return (
+    text.length <= 15 &&
+    /^[\p{Emoji_Presentation}\p{Extended_Pictographic}]+$/u.test(text)
+  )
+}

src/components/StarterPack/Main/ProfilesList.tsx

@@ -40,7 +40,7 @@ export const ProfilesList = React.forwardRef<SectionRef, ProfilesListProps>(
     ref,
   ) {
     const t = useTheme()
-    const bottomBarOffset = useBottomBarOffset(headerHeight)
+    const bottomBarOffset = useBottomBarOffset(300)
     const initialNumToRender = useInitialNumToRender()
     const {currentAccount} = useSession()
     const {data, refetch, isError} = useAllListMembersQuery(listUri)

src/components/StarterPack/ShareDialog.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import {Image} from 'expo-image'
 import {requestMediaLibraryPermissionsAsync} from 'expo-image-picker'

src/components/StarterPack/Wizard/WizardEditListDialog.tsx

@@ -1,4 +1,4 @@
-import {useRef} from 'react'
+import React, {useRef} from 'react'
 import type {ListRenderItemInfo} from 'react-native'
 import {View} from 'react-native'
 import {AppBskyActorDefs, ModerationOpts} from '@atproto/api'

src/components/StarterPack/Wizard/WizardListCard.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {Keyboard, View} from 'react-native'
 import {
   AppBskyActorDefs,

src/components/SubtleWebHover.web.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
 import {isTouchDevice} from '#/lib/browser'

src/components/TagMenu/index.tsx

@@ -40,37 +40,9 @@ export function TagMenu({
   tag: string
   authorHandle?: string
 }>) {
-  const navigation = useNavigation<NavigationProp>()
-  return (
-    <>
-      {children}
-      <Dialog.Outer control={control}>
-        <Dialog.Handle />
-        <TagMenuInner
-          control={control}
-          tag={tag}
-          authorHandle={authorHandle}
-          navigation={navigation}
-        />
-      </Dialog.Outer>
-    </>
-  )
-}
-
-function TagMenuInner({
-  control,
-  tag,
-  authorHandle,
-  navigation,
-}: {
-  control: Dialog.DialogOuterProps['control']
-  tag: string
-  authorHandle?: string
-  // Passed down because on native, we don't use real portals (and context would be wrong).
-  navigation: NavigationProp
-}) {
   const {_} = useLingui()
   const t = useTheme()
+  const navigation = useNavigation<NavigationProp>()
   const {isLoading: isPreferencesLoading, data: preferences} =
     usePreferencesQuery()
   const {
@@ -107,75 +79,32 @@ function TagMenuInner({
   }, [tag, preferences?.moderationPrefs?.mutedWords])
 
   return (
-    <Dialog.Inner label={_(msg`Tag menu: ${displayTag}`)}>
-      {isPreferencesLoading ? (
-        <View style={[a.w_full, a.align_center]}>
-          <Loader size="lg" />
-        </View>
-      ) : (
-        <>
-          <View
-            style={[
-              a.rounded_md,
-              a.border,
-              a.mb_md,
-              t.atoms.border_contrast_low,
-              t.atoms.bg_contrast_25,
-            ]}>
-            <Link
-              label={_(msg`View all posts with tag ${displayTag}`)}
-              {...createStaticClick(() => {
-                control.close(() => {
-                  navigation.push('Hashtag', {
-                    tag: encodeURIComponent(tag),
-                  })
-                })
-              })}>
+    <>
+      {children}
+
+      <Dialog.Outer control={control}>
+        <Dialog.Handle />
+        <Dialog.Inner label={_(msg`Tag menu: ${displayTag}`)}>
+          {isPreferencesLoading ? (
+            <View style={[a.w_full, a.align_center]}>
+              <Loader size="lg" />
+            </View>
+          ) : (
+            <>
               <View
                 style={[
-                  a.w_full,
-                  a.flex_row,
-                  a.align_center,
-                  a.justify_start,
-                  a.gap_md,
-                  a.px_lg,
-                  a.py_md,
+                  a.rounded_md,
+                  a.border,
+                  a.mb_md,
+                  t.atoms.border_contrast_low,
+                  t.atoms.bg_contrast_25,
                 ]}>
-                <Search size="lg" style={[t.atoms.text_contrast_medium]} />
-                <Text
-                  numberOfLines={1}
-                  ellipsizeMode="middle"
-                  style={[
-                    a.flex_1,
-                    a.text_md,
-                    a.font_bold,
-                    native({top: 2}),
-                    t.atoms.text_contrast_medium,
-                  ]}>
-                  <Trans>
-                    See{' '}
-                    <Text style={[a.text_md, a.font_bold, t.atoms.text]}>
-                      {displayTag}
-                    </Text>{' '}
-                    posts
-                  </Trans>
-                </Text>
-              </View>
-            </Link>
-
-            {authorHandle && !isInvalidHandle(authorHandle) && (
-              <>
-                <Divider />
-
                 <Link
-                  label={_(
-                    msg`View all posts by @${authorHandle} with tag ${displayTag}`,
-                  )}
+                  label={_(msg`View all posts with tag ${displayTag}`)}
                   {...createStaticClick(() => {
                     control.close(() => {
                       navigation.push('Hashtag', {
                         tag: encodeURIComponent(tag),
-                        author: authorHandle,
                       })
                     })
                   })}>
@@ -189,7 +118,7 @@ function TagMenuInner({
                       a.px_lg,
                       a.py_md,
                     ]}>
-                    <Person size="lg" style={[t.atoms.text_contrast_medium]} />
+                    <Search size="lg" style={[t.atoms.text_contrast_medium]} />
                     <Text
                       numberOfLines={1}
                       ellipsizeMode="middle"
@@ -205,86 +134,143 @@ function TagMenuInner({
                         <Text style={[a.text_md, a.font_bold, t.atoms.text]}>
                           {displayTag}
                         </Text>{' '}
-                        posts by this user
+                        posts
                       </Trans>
                     </Text>
                   </View>
                 </Link>
-              </>
-            )}
 
-            {preferences ? (
-              <>
-                <Divider />
+                {authorHandle && !isInvalidHandle(authorHandle) && (
+                  <>
+                    <Divider />
 
-                <Button
-                  label={
-                    isMuted
-                      ? _(msg`Unmute all ${displayTag} posts`)
-                      : _(msg`Mute all ${displayTag} posts`)
-                  }
-                  onPress={() => {
-                    control.close(() => {
-                      if (isMuted) {
-                        resetUpsert()
-                        removeMutedWords(removeableMuteWords)
-                      } else {
-                        resetRemove()
-                        upsertMutedWord([
-                          {
-                            value: tag,
-                            targets: ['tag'],
-                            actorTarget: 'all',
-                          },
-                        ])
+                    <Link
+                      label={_(
+                        msg`View all posts by @${authorHandle} with tag ${displayTag}`,
+                      )}
+                      {...createStaticClick(() => {
+                        control.close(() => {
+                          navigation.push('Hashtag', {
+                            tag: encodeURIComponent(tag),
+                            author: authorHandle,
+                          })
+                        })
+                      })}>
+                      <View
+                        style={[
+                          a.w_full,
+                          a.flex_row,
+                          a.align_center,
+                          a.justify_start,
+                          a.gap_md,
+                          a.px_lg,
+                          a.py_md,
+                        ]}>
+                        <Person
+                          size="lg"
+                          style={[t.atoms.text_contrast_medium]}
+                        />
+                        <Text
+                          numberOfLines={1}
+                          ellipsizeMode="middle"
+                          style={[
+                            a.flex_1,
+                            a.text_md,
+                            a.font_bold,
+                            native({top: 2}),
+                            t.atoms.text_contrast_medium,
+                          ]}>
+                          <Trans>
+                            See{' '}
+                            <Text
+                              style={[a.text_md, a.font_bold, t.atoms.text]}>
+                              {displayTag}
+                            </Text>{' '}
+                            posts by this user
+                          </Trans>
+                        </Text>
+                      </View>
+                    </Link>
+                  </>
+                )}
+
+                {preferences ? (
+                  <>
+                    <Divider />
+
+                    <Button
+                      label={
+                        isMuted
+                          ? _(msg`Unmute all ${displayTag} posts`)
+                          : _(msg`Mute all ${displayTag} posts`)
                       }
-                    })
-                  }}>
-                  <View
-                    style={[
-                      a.w_full,
-                      a.flex_row,
-                      a.align_center,
-                      a.justify_start,
-                      a.gap_md,
-                      a.px_lg,
-                      a.py_md,
-                    ]}>
-                    <Mute size="lg" style={[t.atoms.text_contrast_medium]} />
-                    <Text
-                      numberOfLines={1}
-                      ellipsizeMode="middle"
-                      style={[
-                        a.flex_1,
-                        a.text_md,
-                        a.font_bold,
-                        native({top: 2}),
-                        t.atoms.text_contrast_medium,
-                      ]}>
-                      {isMuted ? _(msg`Unmute`) : _(msg`Mute`)}{' '}
-                      <Text style={[a.text_md, a.font_bold, t.atoms.text]}>
-                        {displayTag}
-                      </Text>{' '}
-                      <Trans>posts</Trans>
-                    </Text>
-                  </View>
-                </Button>
-              </>
-            ) : null}
-          </View>
+                      onPress={() => {
+                        control.close(() => {
+                          if (isMuted) {
+                            resetUpsert()
+                            removeMutedWords(removeableMuteWords)
+                          } else {
+                            resetRemove()
+                            upsertMutedWord([
+                              {
+                                value: tag,
+                                targets: ['tag'],
+                                actorTarget: 'all',
+                              },
+                            ])
+                          }
+                        })
+                      }}>
+                      <View
+                        style={[
+                          a.w_full,
+                          a.flex_row,
+                          a.align_center,
+                          a.justify_start,
+                          a.gap_md,
+                          a.px_lg,
+                          a.py_md,
+                        ]}>
+                        <Mute
+                          size="lg"
+                          style={[t.atoms.text_contrast_medium]}
+                        />
+                        <Text
+                          numberOfLines={1}
+                          ellipsizeMode="middle"
+                          style={[
+                            a.flex_1,
+                            a.text_md,
+                            a.font_bold,
+                            native({top: 2}),
+                            t.atoms.text_contrast_medium,
+                          ]}>
+                          {isMuted ? _(msg`Unmute`) : _(msg`Mute`)}{' '}
+                          <Text style={[a.text_md, a.font_bold, t.atoms.text]}>
+                            {displayTag}
+                          </Text>{' '}
+                          <Trans>posts</Trans>
+                        </Text>
+                      </View>
+                    </Button>
+                  </>
+                ) : null}
+              </View>
 
-          <Button
-            label={_(msg`Close this dialog`)}
-            size="small"
-            variant="ghost"
-            color="secondary"
-            onPress={() => control.close()}>
-            <ButtonText>
-              <Trans>Cancel</Trans>
-            </ButtonText>
-          </Button>
-        </>
-      )}
-    </Dialog.Inner>
+              <Button
+                label={_(msg`Close this dialog`)}
+                size="small"
+                variant="ghost"
+                color="secondary"
+                onPress={() => control.close()}>
+                <ButtonText>
+                  <Trans>Cancel</Trans>
+                </ButtonText>
+              </Button>
+            </>
+          )}
+        </Dialog.Inner>
+      </Dialog.Outer>
+    </>
   )
 }

src/components/Typography.tsx

@@ -1,15 +1,140 @@
+import React from 'react'
+import {StyleProp, TextProps as RNTextProps, TextStyle} from 'react-native'
 import {UITextView} from 'react-native-uitextview'
+import createEmojiRegex from 'emoji-regex'
 
 import {logger} from '#/logger'
-import {atoms, flatten, useAlf, useTheme, web} from '#/alf'
-import {
-  childHasEmoji,
-  normalizeTextStyles,
-  renderChildrenWithEmoji,
-  TextProps,
-} from '#/alf/typography'
+import {isIOS, isNative} from '#/platform/detection'
+import {Alf, applyFonts, atoms, flatten, useAlf, useTheme, web} from '#/alf'
 import {IS_DEV} from '#/env'
-export type {TextProps}
+
+export type StringChild = string | (string | null)[]
+
+export type TextProps = Omit<RNTextProps, 'children'> & {
+  /**
+   * Lets the user select text, to use the native copy and paste functionality.
+   */
+  selectable?: boolean
+  /**
+   * Provides `data-*` attributes to the underlying `UITextView` component on
+   * web only.
+   */
+  dataSet?: Record<string, string | number | undefined>
+  /**
+   * Appears as a small tooltip on web hover.
+   */
+  title?: string
+} & (
+    | {
+        emoji?: true
+        children: StringChild
+      }
+    | {
+        emoji?: false
+        children: RNTextProps['children']
+      }
+  )
+
+const EMOJI = createEmojiRegex()
+
+export function childHasEmoji(children: React.ReactNode) {
+  return (Array.isArray(children) ? children : [children]).some(
+    child => typeof child === 'string' && createEmojiRegex().test(child),
+  )
+}
+
+export function childIsString(
+  children: React.ReactNode,
+): children is StringChild {
+  return (
+    typeof children === 'string' ||
+    (Array.isArray(children) &&
+      children.every(child => typeof child === 'string' || child === null))
+  )
+}
+
+export function renderChildrenWithEmoji(
+  children: StringChild,
+  props: Omit<TextProps, 'children'> = {},
+) {
+  const normalized = Array.isArray(children) ? children : [children]
+
+  return (
+    <UITextView {...props}>
+      {normalized.map(child => {
+        if (typeof child !== 'string') return child
+
+        const emojis = child.match(EMOJI)
+
+        if (emojis === null) {
+          return child
+        }
+
+        return child.split(EMOJI).map((stringPart, index) => (
+          <UITextView key={index} {...props}>
+            {stringPart}
+            {emojis[index] ? (
+              <UITextView
+                {...props}
+                style={[props?.style, {color: 'black', fontFamily: 'System'}]}>
+                {emojis[index]}
+              </UITextView>
+            ) : null}
+          </UITextView>
+        ))
+      })}
+    </UITextView>
+  )
+}
+
+/**
+ * Util to calculate lineHeight from a text size atom and a leading atom
+ *
+ * Example:
+ *   `leading(atoms.text_md, atoms.leading_normal)` // => 24
+ */
+export function leading<
+  Size extends {fontSize?: number},
+  Leading extends {lineHeight?: number},
+>(textSize: Size, leading: Leading) {
+  const size = textSize?.fontSize || atoms.text_md.fontSize
+  const lineHeight = leading?.lineHeight || atoms.leading_normal.lineHeight
+  return Math.round(size * lineHeight)
+}
+
+/**
+ * Ensures that `lineHeight` defaults to a relative value of `1`, or applies
+ * other relative leading atoms.
+ *
+ * If the `lineHeight` value is > 2, we assume it's an absolute value and
+ * returns it as-is.
+ */
+export function normalizeTextStyles(
+  styles: StyleProp<TextStyle>,
+  {
+    fontScale,
+    fontFamily,
+  }: {
+    fontScale: number
+    fontFamily: Alf['fonts']['family']
+  } & Pick<Alf, 'flags'>,
+) {
+  const s = flatten(styles)
+  // should always be defined on these components
+  s.fontSize = (s.fontSize || atoms.text_md.fontSize) * fontScale
+
+  if (s?.lineHeight) {
+    if (s.lineHeight !== 0 && s.lineHeight <= 2) {
+      s.lineHeight = Math.round(s.fontSize * s.lineHeight)
+    }
+  } else if (!isNative) {
+    s.lineHeight = s.fontSize
+  }
+
+  applyFonts(s, fontFamily)
+
+  return s
+}
 
 /**
  * Our main text component. Use this most of the time.
@@ -37,6 +162,10 @@ export function Text({
         `Text: emoji detected but emoji not enabled: "${children}"\n\nPlease add <Text emoji />'`,
       )
     }
+
+    if (emoji && !childIsString(children)) {
+      logger.error('Text: when <Text emoji />, children can only be strings.')
+    }
   }
 
   const shared = {
@@ -49,12 +178,12 @@ export function Text({
 
   return (
     <UITextView {...shared}>
-      {renderChildrenWithEmoji(children, shared, emoji ?? false)}
+      {isIOS && emoji ? renderChildrenWithEmoji(children, shared) : children}
     </UITextView>
   )
 }
 
-function createHeadingElement({level}: {level: number}) {
+export function createHeadingElement({level}: {level: number}) {
   return function HeadingElement({style, ...rest}: TextProps) {
     const attr =
       web({

src/components/anim/AnimatedCheck.tsx

@@ -32,25 +32,21 @@ export const AnimatedCheck = React.forwardRef<
   const checkAnim = useSharedValue(0)
 
   const circleAnimatedProps = useAnimatedProps(() => ({
-    strokeDashoffset: 166 - circleAnim.get() * 166,
+    strokeDashoffset: 166 - circleAnim.value * 166,
   }))
   const checkAnimatedProps = useAnimatedProps(() => ({
-    strokeDashoffset: 48 - 48 * checkAnim.get(),
+    strokeDashoffset: 48 - 48 * checkAnim.value,
   }))
 
   const play = React.useCallback(
     (cb?: () => void) => {
-      circleAnim.set(0)
-      checkAnim.set(0)
+      circleAnim.value = 0
+      checkAnim.value = 0
 
-      circleAnim.set(() =>
-        withTiming(1, {duration: 500, easing: Easing.linear}),
-      )
-      checkAnim.set(() =>
-        withDelay(
-          500,
-          withTiming(1, {duration: 300, easing: Easing.linear}, cb),
-        ),
+      circleAnim.value = withTiming(1, {duration: 500, easing: Easing.linear})
+      checkAnim.value = withDelay(
+        500,
+        withTiming(1, {duration: 300, easing: Easing.linear}, cb),
       )
     },
     [circleAnim, checkAnim],

src/components/dialogs/EmbedConsent.tsx

@@ -1,4 +1,4 @@
-import {useCallback} from 'react'
+import React, {useCallback} from 'react'
 import {View} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'

src/components/dialogs/PostInteractionSettingsDialog.tsx

@@ -256,9 +256,6 @@ export function PostInteractionSettingsForm({
     } else {
       newSelected.splice(i, 1)
     }
-    if (newSelected.length === 0) {
-      newSelected.push({type: 'everybody'})
-    }
 
     onChangeThreadgateAllowUISettings(newSelected)
   }
@@ -309,7 +306,7 @@ export function PostInteractionSettingsForm({
               }
               value={quotesEnabled}
               onChange={onChangeQuotesEnabled}
-              style={[a.justify_between, a.pt_xs]}>
+              style={[, a.justify_between, a.pt_xs]}>
               <Text style={[t.atoms.text_contrast_medium]}>
                 {quotesEnabled ? (
                   <Trans>Quote posts enabled</Trans>
@@ -486,7 +483,7 @@ function Selectable({
             a.justify_between,
             a.rounded_sm,
             a.p_md,
-            {minHeight: 40}, // for consistency with checkmark icon visible or not
+            {height: 40}, // for consistency with checkmark icon visible or not
             t.atoms.bg_contrast_50,
             (hovered || focused) && t.atoms.bg_contrast_100,
             isSelected && {

src/components/dialogs/SwitchAccount.tsx

@@ -1,4 +1,4 @@
-import {useCallback} from 'react'
+import React, {useCallback} from 'react'
 import {View} from 'react-native'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'

src/components/dialogs/VerifyEmailDialog.tsx

@@ -146,17 +146,18 @@ export function Inner({
               <ErrorMessage message={error} />
             </View>
           ) : null}
-          {currentStep === 'StepOne' ? (
-            <View>
-              {reasonText ? (
-                <View style={[a.gap_sm]}>
-                  <Text style={[a.text_md, a.leading_snug]}>{reasonText}</Text>
-                  <Text style={[a.text_md, a.leading_snug]}>
-                    Don't have access to{' '}
-                    <Text style={[a.text_md, a.leading_snug, a.font_bold]}>
-                      {currentAccount?.email}
-                    </Text>
-                    ?{' '}
+          <Text style={[a.text_md, a.leading_snug]}>
+            {currentStep === 'StepOne' ? (
+              <>
+                {!reasonText ? (
+                  <>
+                    <Trans>
+                      You'll receive an email at{' '}
+                      <Text style={[a.text_md, a.leading_snug, a.font_bold]}>
+                        {currentAccount?.email}
+                      </Text>{' '}
+                      to verify it's you.
+                    </Trans>{' '}
                     <InlineLinkText
                       to="#"
                       label={_(msg`Change email address`)}
@@ -168,41 +169,17 @@ export function Inner({
                         })
                         return false
                       }}>
-                      <Trans>Change your email address</Trans>
+                      <Trans>Need to change it?</Trans>
                     </InlineLinkText>
-                    .
-                  </Text>
-                </View>
-              ) : (
-                <Text style={[a.text_md, a.leading_snug]}>
-                  <Trans>
-                    You'll receive an email at{' '}
-                    <Text style={[a.text_md, a.leading_snug, a.font_bold]}>
-                      {currentAccount?.email}
-                    </Text>{' '}
-                    to verify it's you.
-                  </Trans>{' '}
-                  <InlineLinkText
-                    to="#"
-                    label={_(msg`Change email address`)}
-                    style={[a.text_md, a.leading_snug]}
-                    onPress={e => {
-                      e.preventDefault()
-                      control.close(() => {
-                        openModal({name: 'change-email'})
-                      })
-                      return false
-                    }}>
-                    <Trans>Need to change it?</Trans>
-                  </InlineLinkText>
-                </Text>
-              )}
-            </View>
-          ) : (
-            <Text style={[a.text_md, a.leading_snug]}>
-              {uiStrings[currentStep].message}
-            </Text>
-          )}
+                  </>
+                ) : (
+                  reasonText
+                )}
+              </>
+            ) : (
+              uiStrings[currentStep].message
+            )}
+          </Text>
         </View>
         {currentStep === 'StepTwo' ? (
           <View>

src/components/dialogs/nuxs/NeueTypography.tsx

@@ -0,0 +1,117 @@
+import React from 'react'
+import {View} from 'react-native'
+import {msg, Trans} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+
+import {AppearanceToggleButtonGroup} from '#/screens/Settings/AppearanceSettings'
+import {atoms as a, useAlf, useTheme} from '#/alf'
+import * as Dialog from '#/components/Dialog'
+import {useNuxDialogContext} from '#/components/dialogs/nuxs'
+import {Divider} from '#/components/Divider'
+import {TextSize_Stroke2_Corner0_Rounded as TextSize} from '#/components/icons/TextSize'
+import {TitleCase_Stroke2_Corner0_Rounded as Aa} from '#/components/icons/TitleCase'
+import {Text} from '#/components/Typography'
+
+export function NeueTypography() {
+  const t = useTheme()
+  const {_} = useLingui()
+  const nuxDialogs = useNuxDialogContext()
+  const control = Dialog.useDialogControl()
+  const {fonts} = useAlf()
+
+  Dialog.useAutoOpen(control, 3e3)
+
+  const onClose = React.useCallback(() => {
+    nuxDialogs.dismissActiveNux()
+  }, [nuxDialogs])
+
+  const onChangeFontFamily = React.useCallback(
+    (values: string[]) => {
+      const next = values[0] === 'system' ? 'system' : 'theme'
+      fonts.setFontFamily(next)
+    },
+    [fonts],
+  )
+
+  const onChangeFontScale = React.useCallback(
+    (values: string[]) => {
+      const next = values[0] || ('0' as any)
+      fonts.setFontScale(next)
+    },
+    [fonts],
+  )
+
+  return (
+    <Dialog.Outer control={control} onClose={onClose}>
+      <Dialog.Handle />
+      <Dialog.ScrollableInner label={_(msg`Introducing new font settings`)}>
+        <View style={[a.gap_xl]}>
+          <View style={[a.gap_md]}>
+            <Text style={[a.text_3xl, a.font_heavy]}>
+              <Trans>New font settings ✨</Trans>
+            </Text>
+            <Text style={[a.text_lg, a.leading_snug, {maxWidth: 400}]}>
+              <Trans>
+                We're introducing a new theme font, along with adjustable font
+                sizing.
+              </Trans>
+            </Text>
+            <Text
+              style={[a.text_sm, a.leading_snug, t.atoms.text_contrast_medium]}>
+              <Trans>
+                You can adjust these in your Appearance Settings later.
+              </Trans>
+            </Text>
+          </View>
+
+          <Divider />
+
+          <View style={[a.gap_lg]}>
+            <AppearanceToggleButtonGroup
+              title={_(msg`Font`)}
+              description={_(
+                msg`For the best experience, we recommend using the theme font.`,
+              )}
+              icon={Aa}
+              items={[
+                {
+                  label: _(msg`System`),
+                  name: 'system',
+                },
+                {
+                  label: _(msg`Theme`),
+                  name: 'theme',
+                },
+              ]}
+              values={[fonts.family]}
+              onChange={onChangeFontFamily}
+            />
+
+            <AppearanceToggleButtonGroup
+              title={_(msg`Font size`)}
+              icon={TextSize}
+              items={[
+                {
+                  label: _(msg`Smaller`),
+                  name: '-1',
+                },
+                {
+                  label: _(msg`Default`),
+                  name: '0',
+                },
+                {
+                  label: _(msg`Larger`),
+                  name: '1',
+                },
+              ]}
+              values={[fonts.scale]}
+              onChange={onChangeFontScale}
+            />
+          </View>
+        </View>
+
+        <Dialog.Close />
+      </Dialog.ScrollableInner>
+    </Dialog.Outer>
+  )
+}

src/components/dialogs/nuxs/index.tsx

@@ -19,6 +19,7 @@ import {useOnboardingState} from '#/state/shell'
 /*
  * NUXs
  */
+import {NeueTypography} from '#/components/dialogs/nuxs/NeueTypography'
 import {isSnoozed, snooze, unsnooze} from '#/components/dialogs/nuxs/snoozing'
 import {IS_DEV} from '#/env'
 
@@ -35,7 +36,19 @@ const queuedNuxs: {
     currentProfile: AppBskyActorDefs.ProfileViewDetailed
     preferences: UsePreferencesQueryResponse
   }) => boolean
-}[] = []
+}[] = [
+  {
+    id: Nux.NeueTypography,
+    enabled(props) {
+      if (props.currentProfile.createdAt) {
+        if (new Date(props.currentProfile.createdAt) < new Date('2024-10-09')) {
+          return true
+        }
+      }
+      return false
+    },
+  },
+]
 
 const Context = React.createContext<Context>({
   activeNux: undefined,
@@ -53,14 +66,7 @@ export function NuxDialogs() {
   const onboardingActive = useOnboardingState().isActive
 
   const isLoading =
-    onboardingActive ||
-    !currentAccount ||
-    !preferences ||
-    !profile ||
-    // Profile isn't legit ready until createdAt is a real date.
-    !profile.createdAt ||
-    profile.createdAt === '0001-01-01T00:00:00.000Z' // TODO: Fix this in AppView.
-
+    !currentAccount || !preferences || !profile || onboardingActive
   return !isLoading ? (
     <Inner
       currentAccount={currentAccount}
@@ -168,7 +174,7 @@ function Inner({
 
   return (
     <Context.Provider value={ctx}>
-      {/*For example, activeNux === Nux.NeueTypography && <NeueTypography />*/}
+      {activeNux === Nux.NeueTypography && <NeueTypography />}
     </Context.Provider>
   )
 }

src/components/dms/ActionsWrapper.tsx

@@ -34,7 +34,7 @@ export function ActionsWrapper({
   const scale = useSharedValue(1)
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{scale: scale.get()}],
+    transform: [{scale: scale.value}],
   }))
 
   const open = React.useCallback(() => {
@@ -46,7 +46,7 @@ export function ActionsWrapper({
   const shrink = React.useCallback(() => {
     'worklet'
     cancelAnimation(scale)
-    scale.set(() => withTiming(1, {duration: 200}))
+    scale.value = withTiming(1, {duration: 200})
   }, [scale])
 
   const doubleTapGesture = Gesture.Tap()
@@ -58,13 +58,11 @@ export function ActionsWrapper({
   const pressAndHoldGesture = Gesture.LongPress()
     .onStart(() => {
       'worklet'
-      scale.set(() =>
-        withTiming(1.05, {duration: 200}, finished => {
-          if (!finished) return
-          runOnJS(open)()
-          shrink()
-        }),
-      )
+      scale.value = withTiming(1.05, {duration: 200}, finished => {
+        if (!finished) return
+        runOnJS(open)()
+        shrink()
+      })
     })
     .onTouchesUp(shrink)
     .onTouchesMove(shrink)

src/components/dms/ChatEmptyPill.tsx

@@ -42,12 +42,12 @@ export function ChatEmptyPill() {
 
   const onPressIn = React.useCallback(() => {
     if (isWeb) return
-    scale.set(() => withTiming(1.075, {duration: 100}))
+    scale.value = withTiming(1.075, {duration: 100})
   }, [scale])
 
   const onPressOut = React.useCallback(() => {
     if (isWeb) return
-    scale.set(() => withTiming(1, {duration: 100}))
+    scale.value = withTiming(1, {duration: 100})
   }, [scale])
 
   const onPress = React.useCallback(() => {
@@ -61,7 +61,7 @@ export function ChatEmptyPill() {
   }, [playHaptic, prompts.length])
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{scale: scale.get()}],
+    transform: [{scale: scale.value}],
   }))
 
   return (

src/components/dms/ConvoMenu.tsx

@@ -115,7 +115,7 @@ let ConvoMenu = ({
                   {...props}
                   onPress={() => {
                     Keyboard.dismiss()
-
+                    // eslint-disable-next-line react/prop-types -- eslint is confused by the name `props`
                     props.onPress()
                   }}
                   style={[

src/components/dms/LeaveConvoPrompt.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useNavigation} from '@react-navigation/native'

src/components/dms/MessageItem.tsx

@@ -19,11 +19,10 @@ import {ConvoItem} from '#/state/messages/convo/types'
 import {useSession} from '#/state/session'
 import {TimeElapsed} from '#/view/com/util/TimeElapsed'
 import {atoms as a, useTheme} from '#/alf'
-import {isOnlyEmoji} from '#/alf/typography'
 import {ActionsWrapper} from '#/components/dms/ActionsWrapper'
 import {InlineLinkText} from '#/components/Link'
 import {Text} from '#/components/Typography'
-import {RichText} from '../RichText'
+import {isOnlyEmoji, RichText} from '../RichText'
 import {DateDivider} from './DateDivider'
 import {MessageItemEmbed} from './MessageItemEmbed'
 import {localDateString} from './util'

src/components/dms/MessageMenu.tsx

@@ -62,7 +62,7 @@ export let MessageMenu = ({
       message.text,
       langPrefs.primaryLanguage,
     )
-    openLink(translatorUrl, true)
+    openLink(translatorUrl)
   }, [langPrefs.primaryLanguage, message.text, openLink])
 
   const onDelete = React.useCallback(() => {

src/components/dms/NewMessagesPill.tsx

@@ -35,12 +35,12 @@ export function NewMessagesPill({
 
   const onPressIn = React.useCallback(() => {
     if (isWeb) return
-    scale.set(() => withTiming(1.075, {duration: 100}))
+    scale.value = withTiming(1.075, {duration: 100})
   }, [scale])
 
   const onPressOut = React.useCallback(() => {
     if (isWeb) return
-    scale.set(() => withTiming(1, {duration: 100}))
+    scale.value = withTiming(1, {duration: 100})
   }, [scale])
 
   const onPress = React.useCallback(() => {
@@ -49,7 +49,7 @@ export function NewMessagesPill({
   }, [onPressInner, playHaptic])
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{scale: scale.get()}],
+    transform: [{scale: scale.value}],
   }))
 
   return (

src/components/dms/ReportConversationPrompt.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 

src/components/dms/dialogs/NewChatDialog.tsx

@@ -1,4 +1,4 @@
-import {useCallback} from 'react'
+import React, {useCallback} from 'react'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 

src/components/dms/dialogs/SearchablePeopleList.tsx

@@ -278,7 +278,7 @@ export function SearchablePeopleList({
           ) : null}
         </View>
 
-        <View style={web([a.pt_xs])}>
+        <View style={[, web([a.pt_xs])]}>
           <SearchInput
             inputRef={inputRef}
             value={searchText}
@@ -313,7 +313,6 @@ export function SearchablePeopleList({
         web([a.py_0, {height: '100vh', maxHeight: 600}, a.px_0]),
         native({height: '100%'}),
       ]}
-      webInnerContentContainerStyle={a.py_0}
       webInnerStyle={[a.py_0, {maxWidth: 500, minWidth: 200}]}
       keyboardDismissMode="on-drag"
     />

src/components/dms/dialogs/ShareViaChatDialog.tsx

@@ -1,4 +1,4 @@
-import {useCallback} from 'react'
+import React, {useCallback} from 'react'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 

src/components/forms/DateField/index.shared.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {Pressable, View} from 'react-native'
 import {useLingui} from '@lingui/react'
 

src/components/forms/FormError.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 
 import {atoms as a, useTheme} from '#/alf'

src/components/hooks/dates.ts

@@ -16,21 +16,17 @@ import {
   es,
   fi,
   fr,
-  gl,
   hi,
   hu,
   id,
   it,
   ja,
   ko,
-  nl,
-  pl,
   ptBR,
   ru,
   th,
   tr,
   uk,
-  vi,
   zhCN,
   zhHK,
   zhTW,
@@ -51,21 +47,17 @@ const locales: Record<AppLanguage, Locale | undefined> = {
   fi,
   fr,
   ga: undefined,
-  gl,
   hi,
   hu,
   id,
   it,
   ja,
   ko,
-  nl,
-  pl,
   ['pt-BR']: ptBR,
   ru,
   th,
   tr,
   uk,
-  vi,
   ['zh-CN']: zhCN,
   ['zh-HK']: zhHK,
   ['zh-TW']: zhTW,

src/components/icons/CalendarClock.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const CalendarClock_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M15.439 3.148a1 1 0 0 1 .41.645l.568 3.22a7 7 0 1 1-6.174 10.97L4.32 19.027a1 1 0 0 1-1.159-.811L1.078 6.398a1 1 0 0 1 .81-1.158l12.803-2.258a1 1 0 0 1 .748.166ZM9.325 16.114A7 7 0 0 1 9 14c0-1.56.51-3 1.372-4.164l-6.456 1.139 1.041 5.909 4.368-.77ZM3.568 9.005l10.833-1.91-.347-1.97L3.22 7.036l.347 1.97ZM16 9a5 5 0 1 0 0 10 5 5 0 0 0 0-10Zm0 2a1 1 0 0 1 1 1v1.586l1.374 1.374a1 1 0 0 1-1.414 1.414l-1.667-1.667A1 1 0 0 1 15 14v-2a1 1 0 0 1 1-1Z',
-})

src/components/icons/ChainLink.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const ChainLink3_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M18.535 5.465a5.003 5.003 0 0 0-7.076 0l-.005.005-.752.742a1 1 0 1 1-1.404-1.424l.749-.74a7.003 7.003 0 0 1 9.904 9.905l-.002.003-.737.746a1 1 0 1 1-1.424-1.404l.747-.757a5.003 5.003 0 0 0 0-7.076ZM6.202 9.288a1 1 0 0 1 .01 1.414l-.747.757a5.003 5.003 0 1 0 7.076 7.076l.005-.005.752-.742a1 1 0 1 1 1.404 1.424l-.746.737-.003.002a7.003 7.003 0 0 1-9.904-9.904l.74-.75a1 1 0 0 1 1.413-.009Zm8.505.005a1 1 0 0 1 0 1.414l-4 4a1 1 0 0 1-1.414-1.414l4-4a1 1 0 0 1 1.414 0Z',
-})

src/components/icons/common.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleSheet, TextProps} from 'react-native'
 import type {PathProps, SvgProps} from 'react-native-svg'
 import {Defs, LinearGradient, Stop} from 'react-native-svg'

src/components/moderation/ContentHider.tsx

@@ -31,37 +31,6 @@ export function ContentHider({
   ignoreMute?: boolean
   style?: StyleProp<ViewStyle>
   childContainerStyle?: StyleProp<ViewStyle>
-}>) {
-  const blur = modui?.blurs[0]
-  if (!blur || (ignoreMute && isJustAMute(modui))) {
-    return (
-      <View testID={testID} style={style}>
-        {children}
-      </View>
-    )
-  }
-  return (
-    <ContentHiderActive
-      testID={testID}
-      modui={modui}
-      style={style}
-      childContainerStyle={childContainerStyle}>
-      {children}
-    </ContentHiderActive>
-  )
-}
-
-function ContentHiderActive({
-  testID,
-  modui,
-  style,
-  childContainerStyle,
-  children,
-}: React.PropsWithChildren<{
-  testID?: string
-  modui: ModerationUI
-  style?: StyleProp<ViewStyle>
-  childContainerStyle?: StyleProp<ViewStyle>
 }>) {
   const t = useTheme()
   const {_} = useLingui()
@@ -71,6 +40,7 @@ function ContentHiderActive({
   const {labelDefs} = useLabelDefinitions()
   const globalLabelStrings = useGlobalLabelStrings()
   const {i18n} = useLingui()
+
   const blur = modui?.blurs[0]
   const desc = useModerationCauseDescription(blur)
 
@@ -129,6 +99,14 @@ function ContentHiderActive({
     globalLabelStrings,
   ])
 
+  if (!blur || (ignoreMute && isJustAMute(modui))) {
+    return (
+      <View testID={testID} style={style}>
+        {children}
+      </View>
+    )
+  }
+
   return (
     <View testID={testID} style={[a.overflow_hidden, style]}>
       <ModerationDetailsDialog control={control} modcause={blur} />

src/components/moderation/LabelPreference.tsx

@@ -22,7 +22,7 @@ export function Outer({children}: React.PropsWithChildren<{}>) {
     <View
       style={[
         a.flex_row,
-        a.gap_sm,
+        a.gap_md,
         a.px_lg,
         a.py_lg,
         a.justify_between,
@@ -74,9 +74,10 @@ export function Buttons({
   hideLabel?: string
 }) {
   const {_} = useLingui()
+  const {gtPhone} = useBreakpoints()
 
   return (
-    <View style={[{minHeight: 35}, a.w_full]}>
+    <View style={[{minHeight: 35}, gtPhone ? undefined : a.w_full]}>
       <ToggleButton.Group
         label={_(
           msg`Configure content filtering setting for category: ${name}`,
@@ -258,7 +259,7 @@ export function LabelerLabelPreference({
       </Content>
 
       {showConfig && (
-        <>
+        <View style={[gtPhone ? undefined : a.w_full]}>
           {cantConfigure ? (
             <View
               style={[
@@ -289,7 +290,7 @@ export function LabelerLabelPreference({
               hideLabel={hideLabel}
             />
           )}
-        </>
+        </View>
       )}
     </Outer>
   )

src/components/moderation/LabelsOnMe.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleProp, View, ViewStyle} from 'react-native'
 import {AppBskyFeedDefs, ComAtprotoLabelDefs} from '@atproto/api'
 import {msg, Plural} from '@lingui/macro'

src/components/moderation/ModerationDetailsDialog.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import {ModerationCause} from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'

src/components/moderation/PostAlerts.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleProp, ViewStyle} from 'react-native'
 import {ModerationCause, ModerationUI} from '@atproto/api'
 

src/components/moderation/ProfileHeaderAlerts.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleProp, ViewStyle} from 'react-native'
 import {ModerationDecision} from '@atproto/api'
 

src/components/video/PlayButtonIcon.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 
 import {atoms as a, useTheme} from '#/alf'
@@ -9,23 +10,39 @@ export function PlayButtonIcon({size = 32}: {size?: number}) {
   const fg = t.name === 'light' ? t.palette.contrast_975 : t.palette.contrast_25
 
   return (
-    <>
+    <View
+      style={[
+        a.rounded_full,
+        a.overflow_hidden,
+        a.align_center,
+        a.justify_center,
+        t.atoms.shadow_lg,
+        {
+          width: size + size / 1.5,
+          height: size + size / 1.5,
+        },
+      ]}>
       <View
         style={[
-          a.rounded_full,
+          a.absolute,
+          a.inset_0,
           {
             backgroundColor: bg,
-            shadowColor: 'black',
-            shadowRadius: 32,
-            shadowOpacity: 0.5,
-            elevation: 24,
-            width: size + size / 1.5,
-            height: size + size / 1.5,
             opacity: 0.7,
           },
         ]}
       />
-      <PlayIcon width={size} fill={fg} style={a.absolute} />
-    </>
+      <PlayIcon
+        width={size}
+        fill={fg}
+        style={[
+          a.relative,
+          a.z_10,
+          {
+            left: size / 50,
+          },
+        ]}
+      />
+    </View>
   )
 }

src/lib/constants.ts

@@ -21,7 +21,7 @@ export const STARTER_PACK_MAX_SIZE = 150
 // code and update this number with each release until we can get the
 // server route done.
 // -prf
-export const JOINED_THIS_WEEK = 3500000 // estimate as of 11/16/24
+export const JOINED_THIS_WEEK = 650000 // estimate as of 10/28/24
 
 export const DISCOVER_DEBUG_DIDS: Record<string, true> = {
   'did:plc:oisofpd7lj26yvgiivf3lxsi': true, // hailey.at
@@ -154,7 +154,6 @@ export const SUPPORTED_MIME_TYPES = [
   'video/mpeg',
   'video/webm',
   'video/quicktime',
-  'image/gif',
 ] as const
 
 export type SupportedMimeTypes = (typeof SUPPORTED_MIME_TYPES)[number]

src/lib/custom-animations/GestureActionView.tsx

@@ -61,7 +61,7 @@ export function GestureActionView({
   const clampedTransX = useDerivedValue(() => {
     const min = actions.leftFirst ? -MAX_WIDTH : 0
     const max = actions.rightFirst ? MAX_WIDTH : 0
-    return clamp(transX.get(), min, max)
+    return clamp(transX.value, min, max)
   })
 
   const iconScale = useSharedValue(1)
@@ -75,23 +75,21 @@ export function GestureActionView({
       return
     }
 
-    iconScale.set(() =>
-      withSequence(
-        withTiming(1.2, {duration: 175}),
-        withTiming(1, {duration: 100}),
-      ),
+    iconScale.value = withSequence(
+      withTiming(1.2, {duration: 175}),
+      withTiming(1, {duration: 100}),
     )
   }
 
   useAnimatedReaction(
     () => transX,
     () => {
-      if (transX.get() === 0) {
+      if (transX.value === 0) {
         runOnJS(setActiveAction)(null)
-      } else if (transX.get() < 0) {
+      } else if (transX.value < 0) {
         if (
           actions.leftSecond &&
-          transX.get() <= -actions.leftSecond.threshold
+          transX.value <= -actions.leftSecond.threshold
         ) {
           if (activeAction !== 'leftSecond') {
             runOnJS(setActiveAction)('leftSecond')
@@ -99,10 +97,10 @@ export function GestureActionView({
         } else if (activeAction !== 'leftFirst') {
           runOnJS(setActiveAction)('leftFirst')
         }
-      } else if (transX.get() > 0) {
+      } else if (transX.value > 0) {
         if (
           actions.rightSecond &&
-          transX.get() > actions.rightSecond.threshold
+          transX.value > actions.rightSecond.threshold
         ) {
           if (activeAction !== 'rightSecond') {
             runOnJS(setActiveAction)('rightSecond')
@@ -121,44 +119,44 @@ export function GestureActionView({
     .activeOffsetY([-200, 200])
     .onStart(() => {
       'worklet'
-      isActive.set(true)
+      isActive.value = true
     })
     .onChange(e => {
       'worklet'
-      transX.set(e.translationX)
+      transX.value = e.translationX
 
       if (e.translationX < 0) {
         // Left side
         if (actions.leftSecond) {
           if (
             e.translationX <= -actions.leftSecond.threshold &&
-            !hitSecond.get()
+            !hitSecond.value
           ) {
             runPopAnimation()
             runOnJS(haptic)()
-            hitSecond.set(true)
+            hitSecond.value = true
           } else if (
-            hitSecond.get() &&
+            hitSecond.value &&
             e.translationX > -actions.leftSecond.threshold
           ) {
             runPopAnimation()
-            hitSecond.set(false)
+            hitSecond.value = false
           }
         }
 
-        if (!hitSecond.get() && actions.leftFirst) {
+        if (!hitSecond.value && actions.leftFirst) {
           if (
             e.translationX <= -actions.leftFirst.threshold &&
-            !hitFirst.get()
+            !hitFirst.value
           ) {
             runPopAnimation()
             runOnJS(haptic)()
-            hitFirst.set(true)
+            hitFirst.value = true
           } else if (
-            hitFirst.get() &&
+            hitFirst.value &&
             e.translationX > -actions.leftFirst.threshold
           ) {
-            hitFirst.set(false)
+            hitFirst.value = false
           }
         }
       } else if (e.translationX > 0) {
@@ -166,33 +164,33 @@ export function GestureActionView({
         if (actions.rightSecond) {
           if (
             e.translationX >= actions.rightSecond.threshold &&
-            !hitSecond.get()
+            !hitSecond.value
           ) {
             runPopAnimation()
             runOnJS(haptic)()
-            hitSecond.set(true)
+            hitSecond.value = true
           } else if (
-            hitSecond.get() &&
+            hitSecond.value &&
             e.translationX < actions.rightSecond.threshold
           ) {
             runPopAnimation()
-            hitSecond.set(false)
+            hitSecond.value = false
           }
         }
 
-        if (!hitSecond.get() && actions.rightFirst) {
+        if (!hitSecond.value && actions.rightFirst) {
           if (
             e.translationX >= actions.rightFirst.threshold &&
-            !hitFirst.get()
+            !hitFirst.value
           ) {
             runPopAnimation()
             runOnJS(haptic)()
-            hitFirst.set(true)
+            hitFirst.value = true
           } else if (
-            hitFirst.get() &&
+            hitFirst.value &&
             e.translationX < actions.rightFirst.threshold
           ) {
-            hitFirst.set(false)
+            hitFirst.value = false
           }
         }
       }
@@ -200,29 +198,29 @@ export function GestureActionView({
     .onEnd(e => {
       'worklet'
       if (e.translationX < 0) {
-        if (hitSecond.get() && actions.leftSecond) {
+        if (hitSecond.value && actions.leftSecond) {
           runOnJS(actions.leftSecond.action)()
-        } else if (hitFirst.get() && actions.leftFirst) {
+        } else if (hitFirst.value && actions.leftFirst) {
           runOnJS(actions.leftFirst.action)()
         }
       } else if (e.translationX > 0) {
-        if (hitSecond.get() && actions.rightSecond) {
+        if (hitSecond.value && actions.rightSecond) {
           runOnJS(actions.rightSecond.action)()
-        } else if (hitSecond.get() && actions.rightFirst) {
+        } else if (hitSecond.value && actions.rightFirst) {
           runOnJS(actions.rightFirst.action)()
         }
       }
-      transX.set(() => withTiming(0, {duration: 200}))
-      hitFirst.set(false)
-      hitSecond.set(false)
-      isActive.set(false)
+      transX.value = withTiming(0, {duration: 200})
+      hitFirst.value = false
+      hitSecond.value = false
+      isActive.value = false
     })
 
   const composedGesture = Gesture.Simultaneous(panGesture)
 
   const animatedSliderStyle = useAnimatedStyle(() => {
     return {
-      transform: [{translateX: clampedTransX.get()}],
+      transform: [{translateX: clampedTransX.value}],
     }
   })
 
@@ -276,7 +274,7 @@ export function GestureActionView({
   const animatedBackgroundStyle = useAnimatedStyle(() => {
     return {
       backgroundColor: interpolateColor(
-        clampedTransX.get(),
+        clampedTransX.value,
         interpolation.inputRange,
         // @ts-expect-error - Weird type expected by reanimated, but this is okay
         interpolation.outputRange,
@@ -285,10 +283,10 @@ export function GestureActionView({
   })
 
   const animatedIconStyle = useAnimatedStyle(() => {
-    const absTransX = Math.abs(clampedTransX.get())
+    const absTransX = Math.abs(clampedTransX.value)
     return {
       opacity: interpolate(absTransX, [0, 75], [0.15, 1]),
-      transform: [{scale: iconScale.get()}],
+      transform: [{scale: iconScale.value}],
     }
   })
 

src/lib/custom-animations/LikeIcon.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {View} from 'react-native'
 import Animated, {
   Keyframe,

src/lib/custom-animations/PressableScale.tsx

@@ -1,6 +1,8 @@
+import React from 'react'
 import {Pressable, PressableProps, StyleProp, ViewStyle} from 'react-native'
 import Animated, {
   cancelAnimation,
+  runOnJS,
   useAnimatedStyle,
   useReducedMotion,
   useSharedValue,
@@ -30,25 +32,27 @@ export function PressableScale({
   const scale = useSharedValue(1)
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{scale: scale.get()}],
+    transform: [{scale: scale.value}],
   }))
 
   return (
     <AnimatedPressable
       accessibilityRole="button"
       onPressIn={e => {
+        'worklet'
         if (onPressIn) {
-          onPressIn(e)
+          runOnJS(onPressIn)(e)
         }
         cancelAnimation(scale)
-        scale.set(() => withTiming(targetScale, {duration: 100}))
+        scale.value = withTiming(targetScale, {duration: 100})
       }}
       onPressOut={e => {
+        'worklet'
         if (onPressOut) {
-          onPressOut(e)
+          runOnJS(onPressOut)(e)
         }
         cancelAnimation(scale)
-        scale.set(() => withTiming(1, {duration: 100}))
+        scale.value = withTiming(1, {duration: 100})
       }}
       style={[!reducedMotion && animatedStyle, style]}
       {...rest}>

src/lib/hooks/useEmail.ts

@@ -1,5 +1,4 @@
 import {useServiceConfigQuery} from '#/state/queries/email-verification-required'
-import {useProfileQuery} from '#/state/queries/profile'
 import {useSession} from '#/state/session'
 import {BSKY_SERVICE} from '../constants'
 import {getHostnameFromUrl} from '../strings/url-helpers'
@@ -8,25 +7,13 @@ export function useEmail() {
   const {currentAccount} = useSession()
 
   const {data: serviceConfig} = useServiceConfigQuery()
-  const {data: profile} = useProfileQuery({did: currentAccount?.did})
-
-  const checkEmailConfirmed = !!serviceConfig?.checkEmailConfirmed
-
-  // Date set for 11 AM PST on the 18th of November
-  const isNewEnough =
-    !!profile?.createdAt &&
-    Date.parse(profile.createdAt) >= Date.parse('2024-11-18T19:00:00.000Z')
 
   const isSelfHost =
+    serviceConfig?.checkEmailConfirmed &&
     currentAccount &&
     getHostnameFromUrl(currentAccount.service) !==
       getHostnameFromUrl(BSKY_SERVICE)
-
-  const needsEmailVerification =
-    !isSelfHost &&
-    checkEmailConfirmed &&
-    !currentAccount?.emailConfirmed &&
-    isNewEnough
+  const needsEmailVerification = !isSelfHost && !currentAccount?.emailConfirmed
 
   return {needsEmailVerification}
 }

src/lib/hooks/useHandleRef.ts

@@ -1,39 +0,0 @@
-import {useState} from 'react'
-import {AnimatedRef, measure, MeasuredDimensions} from 'react-native-reanimated'
-
-export type HandleRef = {
-  (node: any): void
-  current: null | number
-}
-
-// This is a lighterweight alternative to `useAnimatedRef()` for imperative UI thread actions.
-// Render it like <View ref={ref} />, then pass `ref.current` to `measureHandle()` and such.
-export function useHandleRef(): HandleRef {
-  return useState(() => {
-    const ref = (node: any) => {
-      if (node) {
-        ref.current =
-          node._nativeTag ??
-          node.__nativeTag ??
-          node.canonical?.nativeTag ??
-          null
-      } else {
-        ref.current = null
-      }
-    }
-    ref.current = null
-    return ref
-  })[0] as HandleRef
-}
-
-// When using this version, you need to read ref.current on the JS thread, and pass it to UI.
-export function measureHandle(
-  current: number | null,
-): MeasuredDimensions | null {
-  'worklet'
-  if (current !== null) {
-    return measure((() => current) as AnimatedRef<any>)
-  } else {
-    return null
-  }
-}

src/lib/hooks/useMinimalShellTransform.ts

@@ -10,16 +10,15 @@ export function useMinimalShellHeaderTransform() {
   const {headerHeight} = useShellLayout()
 
   const headerTransform = useAnimatedStyle(() => {
-    const headerModeValue = headerMode.get()
     return {
-      pointerEvents: headerModeValue === 0 ? 'auto' : 'none',
-      opacity: Math.pow(1 - headerModeValue, 2),
+      pointerEvents: headerMode.value === 0 ? 'auto' : 'none',
+      opacity: Math.pow(1 - headerMode.value, 2),
       transform: [
         {
           translateY: interpolate(
-            headerModeValue,
+            headerMode.value,
             [0, 1],
-            [0, -headerHeight.get()],
+            [0, -headerHeight.value],
           ),
         },
       ],
@@ -34,16 +33,15 @@ export function useMinimalShellFooterTransform() {
   const {footerHeight} = useShellLayout()
 
   const footerTransform = useAnimatedStyle(() => {
-    const footerModeValue = footerMode.get()
     return {
-      pointerEvents: footerModeValue === 0 ? 'auto' : 'none',
-      opacity: Math.pow(1 - footerModeValue, 2),
+      pointerEvents: footerMode.value === 0 ? 'auto' : 'none',
+      opacity: Math.pow(1 - footerMode.value, 2),
       transform: [
         {
           translateY: interpolate(
-            footerModeValue,
+            footerMode.value,
             [0, 1],
-            [0, footerHeight.get()],
+            [0, footerHeight.value],
           ),
         },
       ],
@@ -60,7 +58,7 @@ export function useMinimalShellFabTransform() {
     return {
       transform: [
         {
-          translateY: interpolate(footerMode.get(), [0, 1], [-44, 0]),
+          translateY: interpolate(footerMode.value, [0, 1], [-44, 0]),
         },
       ],
     }

src/lib/hooks/useOpenLink.ts

@@ -4,14 +4,12 @@ import * as WebBrowser from 'expo-web-browser'
 
 import {
   createBskyAppAbsoluteUrl,
-  isBskyAppUrl,
   isBskyRSSUrl,
   isRelativeUrl,
 } from '#/lib/strings/url-helpers'
 import {isNative} from '#/platform/detection'
 import {useModalControls} from '#/state/modals'
 import {useInAppBrowser} from '#/state/preferences/in-app-browser'
-import {useOptOutOfUtm} from '#/state/preferences/opt-out-of-utm'
 import {useTheme} from '#/alf'
 import {useSheetWrapper} from '#/components/Dialog/sheet-wrapper'
 
@@ -20,7 +18,6 @@ export function useOpenLink() {
   const enabled = useInAppBrowser()
   const t = useTheme()
   const sheetWrapper = useSheetWrapper()
-  const optOutOfUtm = useOptOutOfUtm()
 
   const openLink = useCallback(
     async (url: string, override?: boolean) => {
@@ -29,9 +26,6 @@ export function useOpenLink() {
       }
 
       if (isNative && !url.startsWith('mailto:')) {
-        if (!optOutOfUtm && !isBskyAppUrl(url) && url.startsWith('http')) {
-          url = addUtmSource(url)
-        }
         if (override === undefined && enabled === undefined) {
           openModal({
             name: 'in-app-browser-consent',
@@ -53,24 +47,8 @@ export function useOpenLink() {
       }
       Linking.openURL(url)
     },
-    [enabled, openModal, t, sheetWrapper, optOutOfUtm],
+    [enabled, openModal, t, sheetWrapper],
   )
 
   return openLink
 }
-
-function addUtmSource(url: string): string {
-  let parsedUrl
-  try {
-    parsedUrl = new URL(url)
-  } catch (e) {
-    return url
-  }
-  if (!parsedUrl.searchParams.has('utm_source')) {
-    parsedUrl.searchParams.set('utm_source', 'bluesky')
-    if (!parsedUrl.searchParams.has('utm_medium')) {
-      parsedUrl.searchParams.set('utm_medium', 'social')
-    }
-  }
-  return parsedUrl.toString()
-}

src/lib/icons.tsx

@@ -1,3 +1,4 @@
+import React from 'react'
 import {StyleProp, TextStyle, ViewStyle} from 'react-native'
 import Svg, {Ellipse, Line, Path, Rect} from 'react-native-svg'
 

src/lib/media/video/util.ts

@@ -32,8 +32,6 @@ export function mimeToExt(mimeType: SupportedMimeTypes | (string & {})) {
       return 'mpeg'
     case 'video/quicktime':
       return 'mov'
-    case 'image/gif':
-      return 'gif'
     default:
       throw new Error(`Unsupported mime type: ${mimeType}`)
   }
@@ -49,8 +47,6 @@ export function extToMime(ext: string) {
       return 'video/mpeg'
     case 'mov':
       return 'video/quicktime'
-    case 'gif':
-      return 'image/gif'
     default:
       throw new Error(`Unsupported file extension: ${ext}`)
   }

src/lib/statsig/gates.ts

@@ -2,3 +2,4 @@ export type Gate =
   // Keep this alphabetic please.
   | 'debug_show_feedcontext' // DISABLED DUE TO EME
   | 'post_feed_lang_window' // DISABLED DUE TO EME
+  | 'suggested_feeds_interstitial'

src/lib/strings/errors.ts

@@ -1,5 +1,3 @@
-import {t} from '@lingui/macro'
-
 export function cleanError(str: any): string {
   if (!str) {
     return ''
@@ -8,17 +6,13 @@ export function cleanError(str: any): string {
     str = str.toString()
   }
   if (isNetworkError(str)) {
-    return t`Unable to connect. Please check your internet connection and try again.`
+    return 'Unable to connect. Please check your internet connection and try again.'
   }
-  if (
-    str.includes('Upstream Failure') ||
-    str.includes('NotEnoughResources') ||
-    str.includes('pipethrough network error')
-  ) {
-    return t`The server appears to be experiencing issues. Please try again in a few moments.`
+  if (str.includes('Upstream Failure')) {
+    return 'The server appears to be experiencing issues. Please try again in a few moments.'
   }
   if (str.includes('Bad token scope')) {
-    return t`This feature is not available while using an App Password. Please sign in with your main password.`
+    return 'This feature is not available while using an App Password. Please sign in with your main password.'
   }
   if (str.startsWith('Error: ')) {
     return str.slice('Error: '.length)

src/locale/__tests__/helpers.test.ts

@@ -11,5 +11,4 @@ test('sanitizeAppLanguageSetting', () => {
   expect(sanitizeAppLanguageSetting('foo')).toBe(AppLanguage.en)
   expect(sanitizeAppLanguageSetting('en,foo')).toBe(AppLanguage.en)
   expect(sanitizeAppLanguageSetting('foo,en')).toBe(AppLanguage.en)
-  expect(sanitizeAppLanguageSetting('vi')).toBe(AppLanguage.vi)
 })

src/locale/deviceLocales.ts

@@ -13,12 +13,6 @@ type LocalWithLanguageCode = Locale & {
  *
  * {@link https://github.com/bluesky-social/social-app/pull/4461}
  * {@link https://xml.coverpages.org/iso639a.html}
- *
- * Convert Chinese language tags for Native.
- *
- * {@link https://datatracker.ietf.org/doc/html/rfc5646#appendix-A}
- * {@link https://developer.apple.com/documentation/packagedescription/languagetag}
- * {@link https://gist.github.com/amake/0ac7724681ac1c178c6f95a5b09f03ce#new-locales-vs-old-locales-chinese}
  */
 export function getLocales() {
   const locales = defaultGetLocales?.() ?? []
@@ -38,25 +32,10 @@ export function getLocales() {
         // yiddish
         locale.languageCode = 'yi'
       }
-    }
 
-    if (typeof locale.languageTag === 'string') {
-      if (locale.languageTag.startsWith('zh-Hans')) {
-        // Simplified Chinese to zh-CN
-        locale.languageTag = 'zh-CN'
-      }
-      if (locale.languageTag.startsWith('zh-Hant')) {
-        // Traditional Chinese to zh-TW
-        locale.languageTag = 'zh-TW'
-      }
-      if (locale.languageTag.startsWith('yue')) {
-        // Cantonese (Yue) to zh-HK
-        locale.languageTag = 'zh-HK'
-      }
+      // @ts-ignore checked above
+      output.push(locale)
     }
-
-    // @ts-ignore checked above
-    output.push(locale)
   }
 
   return output

src/locale/helpers.ts

@@ -101,7 +101,7 @@ export function getTranslatorLink(text: string, lang: string): string {
 /**
  * Returns a valid `appLanguage` value from an arbitrary string.
  *
- * Context: post-refactor, we populated some user's `appLanguage` setting with
+ * Contenxt: post-refactor, we populated some user's `appLanguage` setting with
  * `postLanguage`, which can be a comma-separated list of values. This breaks
  * `appLanguage` handling in the app, so we introduced this util to parse out a
  * valid `appLanguage` from the pre-populated `postLanguage` values.
@@ -133,8 +133,6 @@ export function sanitizeAppLanguageSetting(appLanguage: string): AppLanguage {
         return AppLanguage.fr
       case 'ga':
         return AppLanguage.ga
-      case 'gl':
-        return AppLanguage.gl
       case 'hi':
         return AppLanguage.hi
       case 'hu':
@@ -147,10 +145,6 @@ export function sanitizeAppLanguageSetting(appLanguage: string): AppLanguage {
         return AppLanguage.ja
       case 'ko':
         return AppLanguage.ko
-      case 'nl':
-        return AppLanguage.nl
-      case 'pl':
-        return AppLanguage.pl
       case 'pt-BR':
         return AppLanguage.pt_BR
       case 'ru':
@@ -161,8 +155,6 @@ export function sanitizeAppLanguageSetting(appLanguage: string): AppLanguage {
         return AppLanguage.tr
       case 'uk':
         return AppLanguage.uk
-      case 'vi':
-        return AppLanguage.vi
       case 'zh-CN':
         return AppLanguage.zh_CN
       case 'zh-HK':

src/locale/i18n.ts

@@ -19,21 +19,17 @@ import {messages as messagesEs} from '#/locale/locales/es/messages'
 import {messages as messagesFi} from '#/locale/locales/fi/messages'
 import {messages as messagesFr} from '#/locale/locales/fr/messages'
 import {messages as messagesGa} from '#/locale/locales/ga/messages'
-import {messages as messagesGl} from '#/locale/locales/gl/messages'
 import {messages as messagesHi} from '#/locale/locales/hi/messages'
 import {messages as messagesHu} from '#/locale/locales/hu/messages'
 import {messages as messagesId} from '#/locale/locales/id/messages'
 import {messages as messagesIt} from '#/locale/locales/it/messages'
 import {messages as messagesJa} from '#/locale/locales/ja/messages'
 import {messages as messagesKo} from '#/locale/locales/ko/messages'
-import {messages as messagesNl} from '#/locale/locales/nl/messages'
-import {messages as messagesPl} from '#/locale/locales/pl/messages'
 import {messages as messagesPt_BR} from '#/locale/locales/pt-BR/messages'
 import {messages as messagesRu} from '#/locale/locales/ru/messages'
 import {messages as messagesTh} from '#/locale/locales/th/messages'
 import {messages as messagesTr} from '#/locale/locales/tr/messages'
 import {messages as messagesUk} from '#/locale/locales/uk/messages'
-import {messages as messagesVi} from '#/locale/locales/vi/messages'
 import {messages as messagesZh_CN} from '#/locale/locales/zh-CN/messages'
 import {messages as messagesZh_HK} from '#/locale/locales/zh-HK/messages'
 import {messages as messagesZh_TW} from '#/locale/locales/zh-TW/messages'
@@ -100,14 +96,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       ])
       break
     }
-    case AppLanguage.gl: {
-      i18n.loadAndActivate({locale, messages: messagesGl})
-      await Promise.all([
-        import('@formatjs/intl-pluralrules/locale-data/gl'),
-        import('@formatjs/intl-numberformat/locale-data/gl'),
-      ])
-      break
-    }
     case AppLanguage.hi: {
       i18n.loadAndActivate({locale, messages: messagesHi})
       await Promise.all([
@@ -156,22 +144,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       ])
       break
     }
-    case AppLanguage.nl: {
-      i18n.loadAndActivate({locale, messages: messagesNl})
-      await Promise.all([
-        import('@formatjs/intl-pluralrules/locale-data/nl'),
-        import('@formatjs/intl-numberformat/locale-data/nl'),
-      ])
-      break
-    }
-    case AppLanguage.pl: {
-      i18n.loadAndActivate({locale, messages: messagesPl})
-      await Promise.all([
-        import('@formatjs/intl-pluralrules/locale-data/pl'),
-        import('@formatjs/intl-numberformat/locale-data/pl'),
-      ])
-      break
-    }
     case AppLanguage.pt_BR: {
       i18n.loadAndActivate({locale, messages: messagesPt_BR})
       await Promise.all([
@@ -212,14 +184,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       ])
       break
     }
-    case AppLanguage.vi: {
-      i18n.loadAndActivate({locale, messages: messagesVi})
-      await Promise.all([
-        import('@formatjs/intl-pluralrules/locale-data/vi'),
-        import('@formatjs/intl-numberformat/locale-data/vi'),
-      ])
-      break
-    }
     case AppLanguage.zh_CN: {
       i18n.loadAndActivate({locale, messages: messagesZh_CN})
       await Promise.all([
@@ -251,7 +215,7 @@ export async function dynamicActivate(locale: AppLanguage) {
   }
 }
 
-export function useLocaleLanguage() {
+export async function useLocaleLanguage() {
   const {appLanguage} = useLanguagePrefs()
   useEffect(() => {
     dynamicActivate(sanitizeAppLanguageSetting(appLanguage))

src/locale/i18n.web.ts

@@ -40,10 +40,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       mod = await import(`./locales/ga/messages`)
       break
     }
-    case AppLanguage.gl: {
-      mod = await import(`./locales/gl/messages`)
-      break
-    }
     case AppLanguage.hi: {
       mod = await import(`./locales/hi/messages`)
       break
@@ -68,14 +64,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       mod = await import(`./locales/ko/messages`)
       break
     }
-    case AppLanguage.nl: {
-      mod = await import(`./locales/nl/messages`)
-      break
-    }
-    case AppLanguage.pl: {
-      mod = await import(`./locales/pl/messages`)
-      break
-    }
     case AppLanguage.pt_BR: {
       mod = await import(`./locales/pt-BR/messages`)
       break
@@ -96,10 +84,6 @@ export async function dynamicActivate(locale: AppLanguage) {
       mod = await import(`./locales/uk/messages`)
       break
     }
-    case AppLanguage.vi: {
-      mod = await import(`./locales/vi/messages`)
-      break
-    }
     case AppLanguage.zh_CN: {
       mod = await import(`./locales/zh-CN/messages`)
       break