Revert "Add cancel button to dropdowns"

This reverts commit b8f5ddce92.

.eslintrc.js

@@ -7,52 +7,10 @@ module.exports = {
     'prettier',
   ],
   parser: '@typescript-eslint/parser',
-  plugins: [
-    '@typescript-eslint',
-    'detox',
-    'react',
-    'lingui',
-    'simple-import-sort',
-  ],
+  plugins: ['@typescript-eslint', 'detox', 'react', 'lingui'],
   rules: {
     'react/no-unescaped-entities': 0,
     'react-native/no-inline-styles': 0,
-    'simple-import-sort/imports': [
-      'warn',
-      {
-        groups: [
-          // Side effect imports.
-          ['^\\u0000'],
-          // Node.js builtins prefixed with `node:`.
-          ['^node:'],
-          // Packages.
-          // Things that start with a letter (or digit or underscore), or `@` followed by a letter.
-          // React/React Native priortized, followed by expo
-          // Followed by all packages excluding unprefixed relative ones
-          [
-            '^(react\\/(.*)$)|^(react$)|^(react-native(.*)$)',
-            '^(expo(.*)$)|^(expo$)',
-            '^(?!(?:alf|components|lib|locale|logger|platform|screens|state|view)(?:$|\\/))@?\\w',
-          ],
-          // Relative imports.
-          // Ideally, anything that starts with a dot or #
-          // due to unprefixed relative imports being used, we whitelist the relative paths we use
-          // (?:$|\\/) matches end of string or /
-          [
-            '^(?:#\\/)?(?:lib|state|logger|platform|locale)(?:$|\\/)',
-            '^(?:#\\/)?view(?:$|\\/)',
-            '^(?:#\\/)?screens(?:$|\\/)',
-            '^(?:#\\/)?alf(?:$|\\/)',
-            '^(?:#\\/)?components(?:$|\\/)',
-            '^#\\/',
-            '^\\.',
-          ],
-          // anything else - hopefully we don't have any of these
-          ['^'],
-        ],
-      },
-    ],
-    'simple-import-sort/exports': 'warn',
   },
   ignorePatterns: [
     '**/__mocks__/*.ts',
@@ -73,8 +31,4 @@ module.exports = {
   settings: {
     componentWrapperFunctions: ['observer'],
   },
-  parserOptions: {
-    sourceType: 'module',
-    ecmaVersion: 'latest',
-  },
 }

.github/workflows/build-and-push-bskyweb-aws.yaml

@@ -3,8 +3,8 @@ on:
   push:
     branches:
       - main
-      - 3p-moderators
-
+      - traffic-reduction
+      - respect-optout-for-embeds
 env:
   REGISTRY: ${{ secrets.AWS_ECR_REGISTRY_USEAST2_PACKAGES_REGISTRY }}
   USERNAME: ${{ secrets.AWS_ECR_REGISTRY_USEAST2_PACKAGES_USERNAME }}

.github/workflows/bundle-deploy-eas-update.yml

@@ -1,55 +0,0 @@
----
-name: Bundle and Deploy EAS Update
-
-on:
-  workflow_dispatch:
-    inputs:
-      runtimeVersion:
-        type: string
-        description: Runtime version (in x.x.x format) that this update is for
-        required: true
-
-jobs:
-  bundleDeploy:
-    name: Bundle and Deploy EAS Update
-    runs-on: ubuntu-latest
-    steps:
-      - name: 🧐 Validate version
-        run: |
-          [[ "${{ github.event.inputs.runtimeVersion }}" =~ ^[0-9]+\.[0-9]+\.[0-9]+$ ]] && echo "Version is valid" || exit 1
-
-      - name: ⬇️ Checkout
-        uses: actions/checkout@v4
-
-      - name: 🔧 Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version-file: .nvmrc
-          cache: yarn
-
-      - name: ⚙️ Install Dependencies
-        run: yarn install
-
-      - name: 🪛 Install jq
-        uses: dcarbone/install-jq-action@v2
-
-      - name: ⛏️ Setup Expo
-        run: yarn global add eas-cli-local-build-plugin
-
-      - name: 🔤 Compile Translations
-        run: yarn intl:build
-
-      - name: ✏️ Write environment variables
-        run: |
-          export json='${{ secrets.GOOGLE_SERVICES_TOKEN }}'
-          echo "${{ secrets.ENV_TOKEN }}" > .env
-          echo "$json" > google-services.json
-
-      - name: 🏗️ Create Bundle
-        run: yarn export
-
-      - name: 📦 Package Bundle and 🚀 Deploy
-        run: yarn make-deploy-bundle
-        env:
-          DENIS_API_KEY: ${{ secrets.DENIS_API_KEY }}
-          RUNTIME_VERSION: ${{ github.event.inputs.runtimeVersion }}

.github/workflows/pull-request-commit.yml

@@ -1,185 +0,0 @@
-# Credit https://github.com/expo/expo
-# https://github.com/expo/expo/blob/main/.github/workflows/pr-labeler.yml
----
-name: PR labeler
-
-on:
-  push:
-    branches: [main]
-  pull_request:
-    types: [opened, synchronize]
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event_name }}-${{ github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  test-suite-fingerprint:
-    runs-on: ubuntu-22.04
-    if: ${{ github.event.pull_request.head.repo.full_name == github.repository || github.event_name == 'push' }}
-    # REQUIRED: limit concurrency when pushing main(default) branch to prevent conflict for this action to update its fingerprint database
-    concurrency: fingerprint-${{ github.event_name != 'pull_request' && 'main' || github.run_id }}
-    permissions:
-      # REQUIRED: Allow comments of PRs
-      pull-requests: write
-      # REQUIRED: Allow updating fingerprint in acton caches
-      actions: write
-    steps:
-      - name: ⬇️ Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 100
-
-      - name: ⬇️ Fetch commits from base branch
-        run: git fetch origin main:main --depth 100
-        if: github.event_name == 'pull_request'
-
-      - name: 🔧 Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version-file: .nvmrc
-          cache: yarn
-
-      - name: ⚙️ Install Dependencies
-        run: yarn install
-
-      - name: Get the base commit
-        id: base-commit
-        run: |
-          # Since we limit this pr-labeler workflow only triggered from limited paths, we should use custom base commit
-          echo base-commit=$(git log -n 1 main --pretty=format:'%H') >> "$GITHUB_OUTPUT"
-
-      - name: 📷 Check fingerprint
-        id: fingerprint
-        uses: expo/expo-github-action/fingerprint@main
-        with:
-          previous-git-commit: ${{ steps.base-commit.outputs.base-commit }}
-
-      - name: 👀 Debug fingerprint
-        run: |
-          echo "previousGitCommit=${{ steps.fingerprint.outputs.previous-git-commit }} currentGitCommit=${{ steps.fingerprint.outputs.current-git-commit }}"
-          echo "isPreviousFingerprintEmpty=${{ steps.fingerprint.outputs.previous-fingerprint == '' }}"
-
-      - name: 🏷️ Labeling PR
-        uses: actions/github-script@v6
-        if: ${{ github.event_name == 'pull_request' && steps.fingerprint.outputs.fingerprint-diff == '[]' }}
-        with:
-          script: |
-            try {
-              await github.rest.issues.removeLabel({
-                issue_number: context.issue.number,
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                name: ['bot: fingerprint changed']
-              })
-            } catch (e) {
-              if (e.status != 404) {
-                throw e;
-              }
-            }
-            github.rest.issues.addLabels({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              labels: ['bot: fingerprint compatible']
-            })
-
-      - name: 🏷️ Labeling PR
-        uses: actions/github-script@v6
-        if: ${{ github.event_name == 'pull_request' && steps.fingerprint.outputs.fingerprint-diff != '[]' }}
-        with:
-          script: |
-            try {
-              await github.rest.issues.removeLabel({
-                issue_number: context.issue.number,
-                owner: context.repo.owner,
-                repo: context.repo.repo,
-                name: ['bot: fingerprint compatible']
-              })
-            } catch (e) {
-              if (e.status != 404) {
-                throw e;
-              }
-            }
-            github.rest.issues.addLabels({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              labels: ['bot: fingerprint changed']
-            })
-
-      - name: 🔍 Find old comment if it exists
-        uses: peter-evans/find-comment@v2
-        if: ${{ github.event_name == 'pull_request' }}
-        id: old_comment
-        with:
-          issue-number: ${{ github.event.pull_request.number }}
-          comment-author: 'github-actions[bot]'
-          body-includes: <!-- pr-labeler comment -->
-
-      - name: 💬 Add comment with fingerprint
-        if: ${{ github.event_name == 'pull_request' && steps.fingerprint.outputs.fingerprint-diff != '[]' && steps.old_comment.outputs.comment-id == '' }}
-        uses: actions/github-script@v6
-        with:
-          script: |
-            const diff = JSON.stringify(${{ steps.fingerprint.outputs.fingerprint-diff}}, null, 2);
-            const body = `<!-- pr-labeler comment -->
-            The Pull Request introduced fingerprint changes against the base commit: ${{ steps.fingerprint.outputs.previous-git-commit }}
-            <details><summary>Fingerprint diff</summary>
-
-            \`\`\`json
-            ${diff}
-            \`\`\`
-
-            </details>
-
-            ---
-            *Generated by [PR labeler](https://github.com/expo/expo/actions/workflows/pr-labeler.yml) 🤖*
-            `;
-
-            github.rest.issues.createComment({
-              issue_number: context.issue.number,
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              body: body,
-            });
-
-      - name: 💬 Update comment with fingerprint
-        if: ${{ github.event_name == 'pull_request' && steps.fingerprint.outputs.fingerprint-diff != '[]' && steps.old_comment.outputs.comment-id != '' }}
-        uses: actions/github-script@v6
-        with:
-          script: |
-            const diff = JSON.stringify(${{ steps.fingerprint.outputs.fingerprint-diff}}, null, 2);
-            const body = `<!-- pr-labeler comment -->
-            The Pull Request introduced fingerprint changes against the base commit: ${{ steps.fingerprint.outputs.previous-git-commit }}
-            <details><summary>Fingerprint diff</summary>
-
-            \`\`\`json
-            ${diff}
-            \`\`\`
-
-            </details>
-
-            ---
-            *Generated by [PR labeler](https://github.com/expo/expo/actions/workflows/pr-labeler.yml) 🤖*
-            `;
-
-            github.rest.issues.updateComment({
-              issue_number: context.issue.number,
-              comment_id: '${{ steps.old_comment.outputs.comment-id }}',
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              body: body,
-            });
-
-      - name: 💬 Delete comment with fingerprint
-        if: ${{ github.event_name == 'pull_request' && steps.fingerprint.outputs.fingerprint-diff == '[]' && steps.old_comment.outputs.comment-id != '' }}
-        uses: actions/github-script@v6
-        with:
-          script: |
-            github.rest.issues.deleteComment({
-              issue_number: context.issue.number,
-              comment_id: '${{ steps.old_comment.outputs.comment-id }}',
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-            });

__e2e__/tests/curate-lists.test.ts

@@ -64,7 +64,7 @@ describe('Curate lists', () => {
     await element(by.text('Edit list details')).tap()
     await expect(element(by.id('createOrEditListModal'))).toBeVisible()
     await element(by.id('changeAvatarBtn')).tap()
-    await element(by.text('Upload from Library')).tap()
+    await element(by.text('Library')).tap()
     await sleep(3e3)
     await element(by.id('saveBtn')).tap()
     await expect(element(by.id('createOrEditListModal'))).not.toBeVisible()
@@ -81,7 +81,7 @@ describe('Curate lists', () => {
     await element(by.text('Edit list details')).tap()
     await expect(element(by.id('createOrEditListModal'))).toBeVisible()
     await element(by.id('changeAvatarBtn')).tap()
-    await element(by.text('Remove Avatar')).tap()
+    await element(by.text('Remove')).tap()
     await element(by.id('saveBtn')).tap()
     await expect(element(by.id('createOrEditListModal'))).not.toBeVisible()
     await expect(element(by.id('userAvatarFallback'))).toExist()

__e2e__/tests/home-screen.test.ts

@@ -17,7 +17,7 @@ describe('Home screen', () => {
 
   it('Can go to feeds page using feeds button in tab bar', async () => {
     await element(by.id('homeScreenFeedTabs-Feeds ✨')).tap()
-    await expect(element(by.text('Discover New Feeds'))).toBeVisible()
+    await expect(element(by.text('Discover new feeds'))).toBeVisible()
   })
 
   it('Feeds button disappears after pinning a feed', async () => {

__e2e__/tests/profile-screen.test.ts

@@ -70,10 +70,10 @@ describe('Profile screen', () => {
     await element(by.id('profileHeaderEditProfileButton')).tap()
     await expect(element(by.id('editProfileModal'))).toBeVisible()
     await element(by.id('changeBannerBtn')).tap()
-    await element(by.text('Upload from Library')).tap()
+    await element(by.text('Library')).tap()
     await sleep(3e3)
     await element(by.id('changeAvatarBtn')).tap()
-    await element(by.text('Upload from Library')).tap()
+    await element(by.text('Library')).tap()
     await sleep(3e3)
     await element(by.id('editProfileSaveBtn')).tap()
     await expect(element(by.id('editProfileModal'))).not.toBeVisible()
@@ -87,9 +87,9 @@ describe('Profile screen', () => {
     await element(by.id('profileHeaderEditProfileButton')).tap()
     await expect(element(by.id('editProfileModal'))).toBeVisible()
     await element(by.id('changeBannerBtn')).tap()
-    await element(by.text('Remove Banner')).tap()
+    await element(by.text('Remove')).tap()
     await element(by.id('changeAvatarBtn')).tap()
-    await element(by.text('Remove Avatar')).tap()
+    await element(by.text('Remove')).tap()
     await element(by.id('editProfileSaveBtn')).tap()
     await expect(element(by.id('editProfileModal'))).not.toBeVisible()
     await expect(element(by.id('userBannerFallback'))).toExist()

__e2e__/tests/text-verification.test.ts

@@ -12,7 +12,6 @@ describe('Create account', () => {
   })
 
   it('I can create a new account with text verification', async () => {
-    console.log('SERVICE IS', service)
     await element(by.id('e2eOpenLoggedOutView')).tap()
 
     await element(by.id('createAccountButton')).tap()
@@ -29,18 +28,17 @@ describe('Create account', () => {
     await device.takeScreenshot('4- entered account details')
     await element(by.id('nextBtn')).tap()
 
-    await element(by.id('handleInput')).typeText('text-verification-test')
-    await device.takeScreenshot('5- entered handle')
-    await element(by.id('nextBtn')).tap()
-
     await element(by.id('phoneInput')).typeText('8042221111')
     await element(by.id('requestCodeBtn')).tap()
-    await device.takeScreenshot('6- requested code')
+    await device.takeScreenshot('5- requested code')
 
     await element(by.id('codeInput')).typeText('000000')
-    await device.takeScreenshot('7- entered code')
+    await device.takeScreenshot('6- entered code')
     await element(by.id('nextBtn')).tap()
 
+    await element(by.id('handleInput')).typeText('text-verification-test')
+    await device.takeScreenshot('7- entered handle')
+
     await element(by.id('nextBtn')).tap()
 
     await expect(element(by.id('onboardingInterests'))).toBeVisible()

__tests__/lib/strings/url-helpers.test.ts

@@ -4,7 +4,6 @@ import {
   linkRequiresWarning,
   isPossiblyAUrl,
   splitApexDomain,
-  isTrustedUrl,
 } from '../../../src/lib/strings/url-helpers'
 
 describe('linkRequiresWarning', () => {
@@ -75,10 +74,6 @@ describe('linkRequiresWarning', () => {
     // bad uri inputs, default to true
     ['', '', true],
     ['example.com', 'example.com', true],
-    ['/profile', 'Username', false],
-    ['#', 'Show More', false],
-    ['https://docs.bsky.app', 'https://docs.bsky.app', false],
-    ['https://bsky.app/compose/intent?text=test', 'Compose a post', false],
   ]
 
   it.each(cases)(
@@ -144,36 +139,3 @@ describe('splitApexDomain', () => {
     },
   )
 })
-
-describe('isTrustedUrl', () => {
-  const cases = [
-    ['#', true],
-    ['#profile', true],
-    ['/', true],
-    ['/profile', true],
-    ['/profile/', true],
-    ['/profile/bob.test', true],
-    ['https://bsky.app', true],
-    ['https://bsky.app/', true],
-    ['https://bsky.app/profile/bob.test', true],
-    ['https://www.bsky.app', true],
-    ['https://www.bsky.app/', true],
-    ['https://docs.bsky.app', true],
-    ['https://bsky.social', true],
-    ['https://bsky.social/blog', true],
-    ['https://blueskyweb.xyz', true],
-    ['https://blueskyweb.zendesk.com', true],
-    ['http://bsky.app', true],
-    ['http://bsky.social', true],
-    ['http://blueskyweb.xyz', true],
-    ['http://blueskyweb.zendesk.com', true],
-    ['https://google.com', false],
-    ['https://docs.google.com', false],
-    ['https://google.com/#', false],
-  ]
-
-  it.each(cases)('given input uri %p, returns %p', (str, expected) => {
-    const output = isTrustedUrl(str)
-    expect(output).toEqual(expected)
-  })
-})

app.config.js

@@ -161,7 +161,6 @@ module.exports = function (config) {
         './plugins/withAndroidManifestPlugin.js',
         './plugins/withAndroidManifestFCMIconPlugin.js',
         './plugins/withAndroidStylesWindowBackgroundPlugin.js',
-        './plugins/withAndroidSplashScreenStatusBarTranslucentPlugin.js',
         './plugins/shareExtension/withShareExtensions.js',
       ].filter(Boolean),
       extra: {

assets/icons/arrowTriangleBottom_stroke2_corner1_rounded.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" d="M4.213 6.886c-.673-1.35.334-2.889 1.806-2.889H17.98c1.472 0 2.479 1.539 1.806 2.89l-5.982 11.997c-.74 1.484-2.87 1.484-3.61 0L4.213 6.886Z"/></svg>

assets/icons/bars3_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="M3 5a1 1 0 0 0 0 2h18a1 1 0 1 0 0-2H3Zm-1 7a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm0 6a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>

assets/icons/calendar_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="M8 2a1 1 0 0 1 1 1v1h6V3a1 1 0 1 1 2 0v1h2a2 2 0 0 1 2 2v13a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 1-1ZM5 6v3h14V6H5Zm14 5H5v8h14v-8Z" clip-rule="evenodd"/></svg>

assets/icons/chevronBottom_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="M3.293 8.293a1 1 0 0 1 1.414 0L12 15.586l7.293-7.293a1 1 0 1 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"/></svg>

assets/icons/chevronTop_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="M12 6a1 1 0 0 1 .707.293l8 8a1 1 0 0 1-1.414 1.414L12 8.414l-7.293 7.293a1 1 0 0 1-1.414-1.414l8-8A1 1 0 0 1 12 6Z" clip-rule="evenodd"/></svg>

assets/icons/circleBanSign_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="M12 4a8 8 0 0 0-6.32 12.906L16.906 5.68A7.962 7.962 0 0 0 12 4Zm6.32 3.094L7.094 18.32A8 8 0 0 0 18.32 7.094ZM2 12C2 6.477 6.477 2 12 2a9.972 9.972 0 0 1 7.071 2.929A9.972 9.972 0 0 1 22 12c0 5.523-4.477 10-10 10a9.972 9.972 0 0 1-7.071-2.929A9.972 9.972 0 0 1 2 12Z" clip-rule="evenodd"/></svg>

assets/icons/envelope_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="M4.568 4h14.864c.252 0 .498 0 .706.017.229.019.499.063.77.201a2 2 0 0 1 .874.874c.138.271.182.541.201.77.017.208.017.454.017.706v10.864c0 .252 0 .498-.017.706a2.022 2.022 0 0 1-.201.77 2 2 0 0 1-.874.874 2.022 2.022 0 0 1-.77.201c-.208.017-.454.017-.706.017H4.568c-.252 0-.498 0-.706-.017a2.022 2.022 0 0 1-.77-.201 2 2 0 0 1-.874-.874 2.022 2.022 0 0 1-.201-.77C2 17.93 2 17.684 2 17.432V6.568c0-.252 0-.498.017-.706.019-.229.063-.499.201-.77a2 2 0 0 1 .874-.874c.271-.138.541-.182.77-.201C4.07 4 4.316 4 4.568 4Zm.456 2L12 11.708 18.976 6H5.024ZM20 7.747l-6.733 5.509a2 2 0 0 1-2.534 0L4 7.746V17.4a8.187 8.187 0 0 0 .011.589h.014c.116.01.278.011.575.011h14.8a8.207 8.207 0 0 0 .589-.012v-.013c.01-.116.011-.279.011-.575V7.747Z" clip-rule="evenodd"/></svg>

assets/icons/flag_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="M4 4a2 2 0 0 1 2-2h13.131c1.598 0 2.55 1.78 1.665 3.11L18.202 9l2.594 3.89c.886 1.33-.067 3.11-1.665 3.11H6v5a1 1 0 1 1-2 0V4Zm2 10h13.131l-2.593-3.89a2 2 0 0 1 0-2.22L19.13 4H6v10Z" clip-rule="evenodd"/></svg>

assets/icons/group3_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="M8 5a2 2 0 1 0 0 4 2 2 0 0 0 0-4ZM4 7a4 4 0 1 1 8 0 4 4 0 0 1-8 0Zm13-1a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Zm-3.5 1.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0Zm5.826 7.376c-.919-.779-2.052-1.03-3.1-.787a1 1 0 0 1-.451-1.949c1.671-.386 3.45.028 4.844 1.211 1.397 1.185 2.348 3.084 2.524 5.579a1 1 0 0 1-.997 1.07H18a1 1 0 1 1 0-2h3.007c-.29-1.47-.935-2.49-1.681-3.124ZM3.126 19h9.747c-.61-3.495-2.867-5-4.873-5-2.006 0-4.263 1.505-4.873 5ZM8 12c3.47 0 6.64 2.857 6.998 7.93A1 1 0 0 1 14 21H2a1 1 0 0 1-.998-1.07C1.36 14.857 4.53 12 8 12Z" clip-rule="evenodd"/></svg>

assets/icons/heart2_filled_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" d="M12.489 21.372c8.528-4.78 10.626-10.47 9.022-14.47-.779-1.941-2.414-3.333-4.342-3.763-1.697-.378-3.552.003-5.169 1.287-1.617-1.284-3.472-1.665-5.17-1.287-1.927.43-3.562 1.822-4.34 3.764-1.605 4 .493 9.69 9.021 14.47a1 1 0 0 0 .978 0Z"/></svg>

assets/icons/heart2_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="M16.734 5.091c-1.238-.276-2.708.047-4.022 1.38a1 1 0 0 1-1.424 0C9.974 5.137 8.504 4.814 7.266 5.09c-1.263.282-2.379 1.206-2.92 2.556C3.33 10.18 4.252 14.84 12 19.348c7.747-4.508 8.67-9.168 7.654-11.7-.541-1.351-1.657-2.275-2.92-2.557Zm4.777 1.812c1.604 4-.494 9.69-9.022 14.47a1 1 0 0 1-.978 0C2.983 16.592.885 10.902 2.49 6.902c.779-1.942 2.414-3.334 4.342-3.764 1.697-.378 3.552.003 5.169 1.286 1.617-1.283 3.472-1.664 5.17-1.286 1.927.43 3.562 1.822 4.34 3.764Z" clip-rule="evenodd"/></svg>

assets/icons/lock_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="M7 7a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-9a2 2 0 0 1 2-2h1V7Zm-1 4v9h12v-9H6Zm9-2H9V7a3 3 0 1 1 6 0v2Zm-3 4a1 1 0 0 1 1 1v3a1 1 0 1 1-2 0v-3a1 1 0 0 1 1-1Z" clip-rule="evenodd"/></svg>

assets/icons/pencilLine_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.586 2.5a2 2 0 0 1 2.828 0L21.5 5.586a2 2 0 0 1 0 2.828l-13 13A2 2 0 0 1 7.086 22H3a1 1 0 0 1-1-1v-4.086a2 2 0 0 1 .586-1.414l13-13ZM17 3.914l-13 13V20h3.086l13-13L17 3.914ZM13 21a1 1 0 0 1 1-1h7a1 1 0 1 1 0 2h-7a1 1 0 0 1-1-1Z" clip-rule="evenodd"/></svg>

assets/icons/peopleRemove2_stroke2_corner0_rounded.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#000" fill-rule="evenodd" d="M10 4a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5ZM5.5 6.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM16 11a1 1 0 0 1 1-1h5a1 1 0 1 1 0 2h-5a1 1 0 0 1-1-1ZM3.678 19h12.644c-.71-2.909-3.092-5-6.322-5s-5.613 2.091-6.322 5Zm-2.174.906C1.917 15.521 5.242 12 10 12c4.758 0 8.083 3.521 8.496 7.906A1 1 0 0 1 17.5 21h-15a1 1 0 0 1-.996-1.094Z" clip-rule="evenodd"/></svg>

assets/icons/personCheck_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="M12 4a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5ZM7.5 6.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM5.679 19c.709-2.902 3.079-5 6.321-5a6.69 6.69 0 0 1 2.612.51 1 1 0 0 0 .776-1.844A8.687 8.687 0 0 0 12 12c-4.3 0-7.447 2.884-8.304 6.696-.29 1.29.767 2.304 1.902 2.304H11a1 1 0 1 0 0-2H5.679Zm14.835-4.857a1 1 0 0 1 .344 1.371l-3 5a1 1 0 0 1-1.458.286l-2-1.5a1 1 0 0 1 1.2-1.6l1.113.835 2.43-4.05a1 1 0 0 1 1.372-.342Z" clip-rule="evenodd"/></svg>

assets/icons/personX_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="M12 4a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5ZM7.5 6.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM5.679 19c.709-2.902 3.079-5 6.321-5 .302 0 .595.018.878.053a1 1 0 0 0 .243-1.985A9.235 9.235 0 0 0 12 12c-4.3 0-7.447 2.884-8.304 6.696-.29 1.29.767 2.304 1.902 2.304H12a1 1 0 1 0 0-2H5.679Zm9.614-3.707a1 1 0 0 1 1.414 0L18 16.586l1.293-1.293a1 1 0 0 1 1.414 1.414L19.414 18l1.293 1.293a1 1 0 0 1-1.414 1.414L18 19.414l-1.293 1.293a1 1 0 0 1-1.414-1.414L16.586 18l-1.293-1.293a1 1 0 0 1 0-1.414Z" clip-rule="evenodd"/></svg>

assets/icons/person_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="M12 4a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5ZM7.5 6.5a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM5.678 19h12.644c-.71-2.909-3.092-5-6.322-5s-5.613 2.091-6.322 5Zm-2.174.906C3.917 15.521 7.242 12 12 12c4.758 0 8.083 3.521 8.496 7.906A1 1 0 0 1 19.5 21h-15a1 1 0 0 1-.996-1.094Z" clip-rule="evenodd"/></svg>

assets/icons/raisingHand4Finger_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="M10.25 4a.75.75 0 0 0-.75.75V11a1 1 0 1 1-2 0V6.75a.75.75 0 0 0-1.5 0V14a6 6 0 0 0 12 0V9a2 2 0 0 0-2 2v1.5a1 1 0 0 1-.684.949l-.628.21A2.469 2.469 0 0 0 13 16a1 1 0 1 1-2 0 4.469 4.469 0 0 1 3-4.22V11c0-.703.181-1.364.5-1.938V5.75a.75.75 0 0 0-1.5 0V9a1 1 0 1 1-2 0V4.75a.75.75 0 0 0-.75-.75Zm2.316-.733A2.75 2.75 0 0 1 16.5 5.75v1.54c.463-.187.97-.29 1.5-.29h1a1 1 0 0 1 1 1v6a8 8 0 1 1-16 0V6.75a2.75 2.75 0 0 1 3.571-2.625 2.751 2.751 0 0 1 4.995-.858Z" clip-rule="evenodd"/></svg>

assets/icons/settingsGear2_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="M11.1 2a1 1 0 0 0-.832.445L8.851 4.57 6.6 4.05a1 1 0 0 0-.932.268l-1.35 1.35a1 1 0 0 0-.267.932l.52 2.251-2.126 1.417A1 1 0 0 0 2 11.1v1.8a1 1 0 0 0 .445.832l2.125 1.417-.52 2.251a1 1 0 0 0 .268.932l1.35 1.35a1 1 0 0 0 .932.267l2.251-.52 1.417 2.126A1 1 0 0 0 11.1 22h1.8a1 1 0 0 0 .832-.445l1.417-2.125 2.251.52a1 1 0 0 0 .932-.268l1.35-1.35a1 1 0 0 0 .267-.932l-.52-2.251 2.126-1.417A1 1 0 0 0 22 12.9v-1.8a1 1 0 0 0-.445-.832L19.43 8.851l.52-2.251a1 1 0 0 0-.268-.932l-1.35-1.35a1 1 0 0 0-.932-.267l-2.251.52-1.417-2.126A1 1 0 0 0 12.9 2h-1.8Zm-.968 4.255L11.635 4h.73l1.503 2.255a1 1 0 0 0 1.057.42l2.385-.551.566.566-.55 2.385a1 1 0 0 0 .42 1.057L20 11.635v.73l-2.255 1.503a1 1 0 0 0-.42 1.057l.551 2.385-.566.566-2.385-.55a1 1 0 0 0-1.057.42L12.365 20h-.73l-1.503-2.255a1 1 0 0 0-1.057-.42l-2.385.551-.566-.566.55-2.385a1 1 0 0 0-.42-1.057L4 12.365v-.73l2.255-1.503a1 1 0 0 0 .42-1.057L6.123 6.69l.566-.566 2.385.55a1 1 0 0 0 1.057-.42ZM8 12a4 4 0 1 1 8 0 4 4 0 0 1-8 0Zm4-2a2 2 0 1 0 0 4 2 2 0 0 0 0-4Z" clip-rule="evenodd"/></svg>

assets/icons/shield_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="M11.675 2.054a1 1 0 0 1 .65 0l8 2.75A1 1 0 0 1 21 5.75v6.162c0 2.807-1.149 4.83-2.813 6.405-1.572 1.488-3.632 2.6-5.555 3.636l-.157.085a1 1 0 0 1-.95 0l-.157-.085c-1.923-1.037-3.983-2.148-5.556-3.636C4.15 16.742 3 14.719 3 11.912V5.75a1 1 0 0 1 .675-.946l8-2.75ZM5 6.464v5.448c0 2.166.851 3.687 2.188 4.952 1.276 1.209 2.964 2.158 4.812 3.157 1.848-1 3.536-1.948 4.813-3.157C18.148 15.6 19 14.078 19 11.912V6.464l-7-2.407-7 2.407Z" clip-rule="evenodd"/></svg>

assets/icons/squareArrowTopRight_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="M14 5a1 1 0 1 1 0-2h6a1 1 0 0 1 1 1v6a1 1 0 1 1-2 0V6.414l-7.293 7.293a1 1 0 0 1-1.414-1.414L17.586 5H14ZM3 6a1 1 0 0 1 1-1h5a1 1 0 0 1 0 2H5v12h12v-4a1 1 0 1 1 2 0v5a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V6Z" clip-rule="evenodd"/></svg>

assets/icons/squareBehindSquare4_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="M8 8V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1h-5v5a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h5Zm1 8a1 1 0 0 1-1-1v-5H4v10h10v-4H9Z" clip-rule="evenodd"/></svg>

assets/icons/ticket_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" stroke="#000" stroke-linejoin="round" d="M4 5.5a.5.5 0 0 0-.5.5v2.535a.5.5 0 0 0 .25.433A3.498 3.498 0 0 1 5.5 12a3.498 3.498 0 0 1-1.75 3.032.5.5 0 0 0-.25.433V18a.5.5 0 0 0 .5.5h16a.5.5 0 0 0 .5-.5v-2.535a.5.5 0 0 0-.25-.433A3.498 3.498 0 0 1 18.5 12a3.5 3.5 0 0 1 1.75-3.032.5.5 0 0 0 .25-.433V6a.5.5 0 0 0-.5-.5H4ZM2.5 6A1.5 1.5 0 0 1 4 4.5h16A1.5 1.5 0 0 1 21.5 6v3.17a.5.5 0 0 1-.333.472 2.501 2.501 0 0 0 0 4.716.5.5 0 0 1 .333.471V18a1.5 1.5 0 0 1-1.5 1.5H4A1.5 1.5 0 0 1 2.5 18v-3.17a.5.5 0 0 1 .333-.472 2.501 2.501 0 0 0 0-4.716.5.5 0 0 1-.333-.471V6Zm12 2a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0Zm0 4a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0Zm0 4a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0Z"/></svg>

assets/icons/triangleExclamation_stroke2_corner2_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="M12.86 4.494a.995.995 0 0 0-1.72 0L4.14 16.502A.996.996 0 0 0 4.999 18h14.003a.996.996 0 0 0 .86-1.498L12.86 4.494ZM9.413 3.487c1.155-1.983 4.019-1.983 5.174 0l7.002 12.007C22.753 17.491 21.314 20 19.002 20H4.998c-2.312 0-3.751-2.509-2.587-4.506L9.413 3.487ZM12 8.019a1 1 0 0 1 1 1v2.994a1 1 0 1 1-2 0V9.02a1 1 0 0 1 1-1Z" clip-rule="evenodd"/><rect width="2.5" height="2.5" x="10.75" y="13.75" fill="#000" rx="1.25"/></svg>

bskyweb/cmd/bskyweb/server.go

@@ -188,7 +188,6 @@ func serve(cctx *cli.Context) error {
 	e.GET("/settings/threads", server.WebGeneric)
 	e.GET("/settings/external-embeds", server.WebGeneric)
 	e.GET("/sys/debug", server.WebGeneric)
-	e.GET("/sys/debug-mod", server.WebGeneric)
 	e.GET("/sys/log", server.WebGeneric)
 	e.GET("/support", server.WebGeneric)
 	e.GET("/support/privacy", server.WebGeneric)
@@ -204,7 +203,6 @@ func serve(cctx *cli.Context) error {
 	e.GET("/profile/:handleOrDID/lists/:rkey", server.WebGeneric)
 	e.GET("/profile/:handleOrDID/feed/:rkey", server.WebGeneric)
 	e.GET("/profile/:handleOrDID/feed/:rkey/liked-by", server.WebGeneric)
-	e.GET("/profile/:handleOrDID/labeler/liked-by", server.WebGeneric)
 
 	// profile RSS feed (DID not handle)
 	e.GET("/profile/:ident/rss", server.WebProfileRSS)

bskyweb/static/iframe/youtube.html

@@ -5,14 +5,16 @@
     }
     .container {
         position: relative;
-        overflow: hidden;
-        width: 100vw;
-        height: 100vh;
+        width: 100%;
+        height: 0;
+        padding-bottom: 56.25%;
     }
     .video {
         position: absolute;
-        width: 100vw;
-        height: 100vh;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
     }
 </style>
 <div class="container"><div class="video" id="player"></div></div>

bskyweb/templates/base.html

@@ -44,7 +44,7 @@
       scrollbar-gutter: stable both-edges;
     }
     html, body {
-      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Liberation Sans", Helvetica, Arial, sans-serif;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
     }
 
     /* Buttons and inputs have a font set by UA, so we'll have to reset that */
@@ -141,7 +141,7 @@
 
     /* ProseMirror */
     .ProseMirror {
-      font: 18px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Liberation Sans", Helvetica, Arial, sans-serif;
+      font: 18px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
       min-height: 140px;
     }
     .ProseMirror-dark {

code-signing/certificate.pem

@@ -1,18 +0,0 @@
------BEGIN CERTIFICATE-----
-MIIC0TCCAbmgAwIBAgIJcMN2yt5KNDqTMA0GCSqGSIb3DQEBCwUAMBIxEDAOBgNV
-BAMTB0JsdWVza3kwHhcNMjQwMzE0MDA1OTU4WhcNMzQwMzE0MDA1OTU4WjASMRAw
-DgYDVQQDEwdCbHVlc2t5MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA
-izSAWEc3wRoa3eTBEh/kE9pH0d6jhEGw9GrYfei60MHT1pSq2cTdyUM1yUZchAeW
-gFFtqFxX0pfIZQyMlIZbjkaOxOqzWhB0aCsxngnhbSahFwRxkVwTAuonhqIpaLBL
-hrCCCQ2IfZUpy8QeasqlTlmvmijuCC34fXxJlxNcj8SqzIZi+civ7U5PMPfIMMnD
-tCDIBy1vxMk57m25X2ikcWUFW64qNVLkFAL36xEnmFTL4Ivqpz23gUcUIe1zbesY
-jAgDtlwnAE7mU3oagCUDcSuOveT4POhT35Xp3Y/07I68kmXtrPxwd5k0L0zbisEm
-poKZ87E2X29BitihicMpBwIDAQABoyowKDAOBgNVHQ8BAf8EBAMCB4AwFgYDVR0l
-AQH/BAwwCgYIKwYBBQUHAwMwDQYJKoZIhvcNAQELBQADggEBAED1gdMF0yr8Gy87
-RgyaeVpPySwSsO0selmXXrcmOWgiPA05lubyhFEa4P5kdzBEByG2MT+pJkjGYpvK
-XRnqXM5VvdS2RhYYFH0cFOIUqBKwCnzViCMuGQeoGUx4oPcKFS0PQ1WjW2d4pS75
-51GBfB6LOepsCHUG0A9XEk7EAyUWc4M2ITCJsTtJh8CVn2pTks2q14ETDs86YQv4
-peDaJv8nhIe8oQkeGn2o/P/ctkwJg/uBydQUsWgjjGTQZTilVjGTW1mwDr9FucAE
-d5gKIk4rtR/3Zd/NDdqp8PrkoWeVM7Hwr789/mpUOeqa/j7YNkDYQh7x+M/odd1D
-KY0bQEQ=
------END CERTIFICATE-----

jest/jestSetup.js

@@ -88,5 +88,3 @@ jest.mock('sentry-expo', () => ({
     ReactNavigationInstrumentation: jest.fn(),
   },
 }))
-
-jest.mock('crypto', () => ({}))

jest/test-pds.ts

@@ -72,7 +72,6 @@ export async function createServer(
   const phoneParams = phoneRequired
     ? {
         phoneVerificationRequired: true,
-        phoneVerificationProvider: 'twilio',
         twilioAccountSid: 'ACXXXXXXX',
         twilioAuthToken: 'AUTH',
         twilioServiceSid: 'VAXXXXXXXX',
@@ -96,35 +95,6 @@ export async function createServer(
   })
   mockTwilio(testNet.pds)
 
-  // add the test mod authority
-  if (!phoneRequired) {
-    const agent = new BskyAgent({service: pdsUrl})
-    const res = await agent.api.com.atproto.server.createAccount({
-      email: 'mod-authority@test.com',
-      handle: 'mod-authority.test',
-      password: 'hunter2',
-    })
-    agent.api.setHeader('Authorization', `Bearer ${res.data.accessJwt}`)
-    await agent.api.app.bsky.actor.profile.create(
-      {repo: res.data.did},
-      {
-        displayName: 'Dev-env Moderation',
-        description: `The pretend version of mod.bsky.app`,
-      },
-    )
-
-    await agent.api.app.bsky.labeler.service.create(
-      {repo: res.data.did, rkey: 'self'},
-      {
-        policies: {
-          labelValues: ['!hide', '!warn'],
-          labelValueDefinitions: [],
-        },
-        createdAt: new Date().toISOString(),
-      },
-    )
-  }
-
   const pic = fs.readFileSync(
     path.join(__dirname, '..', 'assets', 'default-avatar.png'),
   )
@@ -485,13 +455,13 @@ async function getPort(start = 3000) {
 }
 
 export const mockTwilio = (pds: TestPds) => {
-  if (!pds.ctx.phoneVerifier) return
+  if (!pds.ctx.twilio) return
 
-  pds.ctx.phoneVerifier.sendCode = async (_number: string) => {
+  pds.ctx.twilio.sendCode = async (_number: string) => {
     // do nothing
   }
 
-  pds.ctx.phoneVerifier.verifyCode = async (_number: string, code: string) => {
+  pds.ctx.twilio.verifyCode = async (_number: string, code: string) => {
     return code === '000000'
   }
 }

lingui.config.js

@@ -4,7 +4,6 @@ module.exports = {
     'en',
     'de',
     'es',
-    'fi',
     'fr',
     'hi',
     'id',

package.json

@@ -1,11 +1,10 @@
 {
   "name": "bsky.app",
-  "version": "1.74.0",
+  "version": "1.72.0",
   "private": true,
   "engines": {
     "node": ">=18"
   },
-  "packageManager": "yarn@1.22.19",
   "scripts": {
     "prepare": "is-ci || husky install",
     "postinstall": "patch-package && yarn intl:compile",
@@ -42,15 +41,12 @@
     "intl:extract": "lingui extract",
     "intl:compile": "lingui compile",
     "nuke": "rm -rf ./node_modules && rm -rf ./ios && rm -rf ./android",
-    "update-extensions": "bash scripts/updateExtensions.sh",
-    "export": "npx expo export",
-    "make-deploy-bundle": "bash scripts/bundleUpdate.sh"
+    "update-extensions": "scripts/updateExtensions.sh"
   },
   "dependencies": {
-    "@atproto/api": "^0.12.2",
+    "@atproto/api": "^0.10.5",
     "@bam.tech/react-native-image-resizer": "^3.0.4",
     "@braintree/sanitize-url": "^6.0.2",
-    "@discord/bottom-sheet": "https://github.com/bluesky-social/react-native-bottom-sheet.git#discord-fork-4.6.1",
     "@emoji-mart/react": "^1.1.1",
     "@expo/html-elements": "^0.4.2",
     "@expo/webpack-config": "^19.0.0",
@@ -58,6 +54,7 @@
     "@fortawesome/free-regular-svg-icons": "^6.1.1",
     "@fortawesome/free-solid-svg-icons": "^6.1.1",
     "@fortawesome/react-native-fontawesome": "^0.3.0",
+    "@gorhom/bottom-sheet": "^4.5.1",
     "@lingui/react": "^4.5.0",
     "@mattermost/react-native-paste-input": "^0.6.4",
     "@miblanchard/react-native-slider": "^2.3.1",
@@ -79,9 +76,7 @@
     "@segment/sovran-react-native": "^0.4.5",
     "@sentry/react-native": "5.5.0",
     "@tamagui/focus-scope": "^1.84.1",
-    "@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.0.0-beta.220",
     "@tiptap/extension-document": "^2.0.0-beta.220",
     "@tiptap/extension-hard-break": "^2.0.3",
@@ -94,7 +89,6 @@
     "@tiptap/pm": "^2.0.0-beta.220",
     "@tiptap/react": "^2.0.0-beta.220",
     "@tiptap/suggestion": "^2.0.0-beta.220",
-    "@types/invariant": "^2.2.37",
     "@types/node": "^18.16.2",
     "@zxing/text-encoding": "^0.9.0",
     "array.prototype.findlast": "^1.2.3",
@@ -185,6 +179,7 @@
     "react-responsive": "^9.0.2",
     "rn-fetch-blob": "^0.12.0",
     "sentry-expo": "~7.0.1",
+    "statsig-react": "^1.36.0",
     "statsig-react-native-expo": "^4.6.1",
     "tippy.js": "^6.3.7",
     "tlds": "^1.234.0",
@@ -239,7 +234,6 @@
     "eslint-plugin-lingui": "^0.2.0",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-native-a11y": "^3.3.0",
-    "eslint-plugin-simple-import-sort": "^12.0.0",
     "html-webpack-plugin": "^5.5.0",
     "husky": "^8.0.3",
     "is-ci": "^3.0.1",

patches/expo-image-picker+14.7.1.patch

@@ -1,56 +1,8 @@
-diff --git a/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/ImagePickerModule.kt b/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/ImagePickerModule.kt
-index 3f50f8c..ee47fa1 100644
---- a/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/ImagePickerModule.kt
-+++ b/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/ImagePickerModule.kt
-@@ -33,7 +33,9 @@ import kotlin.coroutines.resumeWithException
- // TODO(@bbarthec): rename to ExpoImagePicker
- private const val moduleName = "ExponentImagePicker"
-
-+
- class ImagePickerModule : Module() {
-+  private var isPickerOpen = false
-
-   override fun definition() = ModuleDefinition {
-     Name(moduleName)
-@@ -129,6 +131,11 @@ class ImagePickerModule : Module() {
-     options: ImagePickerOptions
-   ): Any {
-     return try {
-+      if(isPickerOpen) {
-+        return ImagePickerResponse(canceled = true)
-+      }
-+
-+      isPickerOpen = true
-       var result = launchPicker(pickerLauncher)
-       if (
-         !options.allowsMultipleSelection &&
-@@ -143,6 +150,8 @@ class ImagePickerModule : Module() {
-       mediaHandler.readExtras(result.data, options)
-     } catch (cause: OperationCanceledException) {
-       return ImagePickerResponse(canceled = true)
-+    } finally {
-+      isPickerOpen = false
-     }
-   }
-
 diff --git a/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/contracts/ImageLibraryContract.kt b/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/contracts/ImageLibraryContract.kt
-index ff15c91..9763012 100644
+index ff15c91..41aaf12 100644
 --- a/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/contracts/ImageLibraryContract.kt
 +++ b/node_modules/expo-image-picker/android/src/main/java/expo/modules/imagepicker/contracts/ImageLibraryContract.kt
-@@ -5,12 +5,7 @@ import android.content.ContentResolver
- import android.content.Context
- import android.content.Intent
- import android.net.Uri
--import androidx.activity.result.PickVisualMediaRequest
--import androidx.activity.result.contract.ActivityResultContracts.PickVisualMedia
--import androidx.activity.result.contract.ActivityResultContracts.PickMultipleVisualMedia
- import expo.modules.imagepicker.ImagePickerOptions
--import expo.modules.imagepicker.MediaTypes
--import expo.modules.imagepicker.UNLIMITED_SELECTION
- import expo.modules.imagepicker.getAllDataUris
- import expo.modules.imagepicker.toMediaType
- import expo.modules.kotlin.activityresult.AppContextActivityResultContract
-@@ -26,51 +21,26 @@ import java.io.Serializable
+@@ -26,51 +26,26 @@ import java.io.Serializable
   * @see [androidx.activity.result.contract.ActivityResultContracts.GetMultipleContents]
   */
  internal class ImageLibraryContract(
@@ -60,7 +12,7 @@ index ff15c91..9763012 100644
    private val contentResolver: ContentResolver
      get() = appContextProvider.appContext.reactContext?.contentResolver
        ?: throw Exceptions.ReactContextLost()
-
+ 
    override fun createIntent(context: Context, input: ImageLibraryContractOptions): Intent {
 -    val request = PickVisualMediaRequest.Builder()
 -      .setMediaType(
@@ -82,7 +34,7 @@ index ff15c91..9763012 100644
 +    val intent = Intent(Intent.ACTION_GET_CONTENT)
 +            .addCategory(Intent.CATEGORY_OPENABLE)
 +            .setType("image/*")
-
+ 
      if (input.options.allowsMultipleSelection) {
 -      val selectionLimit = input.options.selectionLimit
 -
@@ -93,7 +45,7 @@ index ff15c91..9763012 100644
 +      if(input.options.selectionLimit == 1) {
 +        return intent
        }
-
+ 
 -      if (selectionLimit > 1) {
 -        return PickMultipleVisualMedia(selectionLimit).createIntent(context, request)
 -      }
@@ -104,9 +56,9 @@ index ff15c91..9763012 100644
 -      }
 +      intent.putExtra(Intent.EXTRA_ALLOW_MULTIPLE, true)
      }
-
+ 
 -    return PickVisualMedia().createIntent(context, request)
 +    return intent
    }
-
+ 
    override fun parseResult(input: ImageLibraryContractOptions, resultCode: Int, intent: Intent?) =

patches/react-native+0.73.2.patch

@@ -1,19 +1,92 @@
-diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-index b09e653..d290dab 100644
---- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-+++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-@@ -198,6 +198,14 @@ - (void)refreshControlValueChanged
-   [self setCurrentRefreshingState:super.refreshing];
-   _refreshingProgrammatically = NO;
+diff --git a/node_modules/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm b/node_modules/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm
+index 9dca6a5..090bda5 100644
+--- a/node_modules/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm
++++ b/node_modules/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm
+@@ -266,11 +266,10 @@ - (void)textViewDidChange:(__unused UITextView *)textView
 
-+  if (@available(iOS 17.4, *)) {
-+    if (_currentRefreshingState) {
-+      UIImpactFeedbackGenerator *feedbackGenerator = [[UIImpactFeedbackGenerator alloc] initWithStyle:UIImpactFeedbackStyleLight];
-+      [feedbackGenerator prepare];
-+      [feedbackGenerator impactOccurred];
+ - (void)textViewDidChangeSelection:(__unused UITextView *)textView
+ {
+-  if (_lastStringStateWasUpdatedWith && ![_lastStringStateWasUpdatedWith isEqual:_backedTextInputView.attributedText]) {
++  if (![_lastStringStateWasUpdatedWith isEqual:_backedTextInputView.attributedText]) {
+     [self textViewDidChange:_backedTextInputView];
+     _ignoreNextTextInputCall = YES;
+   }
+-  _lastStringStateWasUpdatedWith = _backedTextInputView.attributedText;
+   [self textViewProbablyDidChangeSelection];
+ }
+
+diff --git a/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputShadowView.mm b/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputShadowView.mm
+index 1f06b79..ab458f3 100644
+--- a/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputShadowView.mm
++++ b/node_modules/react-native/Libraries/Text/TextInput/RCTBaseTextInputShadowView.mm
+@@ -87,7 +87,7 @@ - (void)invalidateContentSize
+     return;
+   }
+
+-  CGSize maximumSize = self.layoutMetrics.frame.size;
++  CGSize maximumSize = self.layoutMetrics.contentFrame.size;
+
+   if (_maximumNumberOfLines == 1) {
+     maximumSize.width = CGFLOAT_MAX;
+@@ -158,6 +158,8 @@ - (void)uiManagerWillPerformMounting
+     [attributedText insertAttributedString:propertyAttributedText atIndex:0];
+   }
+
++  [self postprocessAttributedText:attributedText];
++
+   NSAttributedString *newAttributedText;
+   if (![_previousAttributedText isEqualToAttributedString:attributedText]) {
+     // We have to follow `set prop` pattern:
+@@ -191,6 +193,52 @@ - (void)uiManagerWillPerformMounting
+   }];
+ }
+
++- (void)postprocessAttributedText:(NSMutableAttributedString *)attributedText
++{
++  __block CGFloat maximumLineHeight = 0;
++
++  [attributedText enumerateAttribute:NSParagraphStyleAttributeName
++                             inRange:NSMakeRange(0, attributedText.length)
++                             options:NSAttributedStringEnumerationLongestEffectiveRangeNotRequired
++                          usingBlock:^(NSParagraphStyle *paragraphStyle, __unused NSRange range, __unused BOOL *stop) {
++    if (!paragraphStyle) {
++      return;
 +    }
++
++    maximumLineHeight = MAX(paragraphStyle.maximumLineHeight, maximumLineHeight);
++  }];
++
++  if (maximumLineHeight == 0) {
++    // `lineHeight` was not specified, nothing to do.
++    return;
 +  }
 +
-   if (_onRefresh) {
-     _onRefresh(nil);
-   }
++  __block CGFloat maximumFontLineHeight = 0;
++
++  [attributedText enumerateAttribute:NSFontAttributeName
++                             inRange:NSMakeRange(0, attributedText.length)
++                             options:NSAttributedStringEnumerationLongestEffectiveRangeNotRequired
++                          usingBlock:^(UIFont *font, NSRange range, __unused BOOL *stop) {
++    if (!font) {
++      return;
++    }
++
++    if (maximumFontLineHeight <= font.lineHeight) {
++      maximumFontLineHeight = font.lineHeight;
++    }
++  }];
++
++  if (maximumLineHeight < maximumFontLineHeight) {
++    return;
++  }
++
++  CGFloat baseLineOffset = maximumLineHeight / 2.0 - maximumFontLineHeight / 2.0;
++
++  [attributedText addAttribute:NSBaselineOffsetAttributeName
++                         value:@(baseLineOffset)
++                         range:NSMakeRange(0, attributedText.length)];
++}
++
+ #pragma mark -
+
+ - (NSAttributedString *)measurableAttributedText

patches/react-native+0.73.2.patch.md

@@ -1,5 +1,5 @@
-# RefreshControl Patch
+# TextInput Patch
 
-Patching `RCTRefreshControl.mm` temporarily to play an impact haptic on refresh when using iOS 17.4 or higher. Since
-17.4, there has been a regression somewhere causing haptics to not play on iOS on refresh. Should monitor for an update
-in the RN repo: https://github.com/facebook/react-native/issues/43388
+Patching `RCTBaseTextShadowInput.mm` from https://github.com/facebook/react-native/pull/38359. This fixes some text
+getting cut off inside the composer. This was merged in December, so we should be able to remove this patch when RN
+ships the next release.

plugins/withAndroidSplashScreenStatusBarTranslucentPlugin.js

@@ -1,28 +0,0 @@
-const {withStringsXml, AndroidConfig} = require('@expo/config-plugins')
-
-module.exports = function withAndroidSplashScreenStatusBarTranslucentPlugin(
-  appConfig,
-) {
-  return withStringsXml(appConfig, function (decoratedAppConfig) {
-    try {
-      decoratedAppConfig.modResults = AndroidConfig.Strings.setStringItem(
-        [
-          {
-            _: 'true',
-            $: {
-              name: 'expo_splash_screen_status_bar_translucent',
-              translatable: 'false',
-            },
-          },
-        ],
-        decoratedAppConfig.modResults,
-      )
-    } catch (e) {
-      console.error(
-        `withAndroidSplashScreenStatusBarTranslucentPlugin failed`,
-        e,
-      )
-    }
-    return decoratedAppConfig
-  })
-}

scripts/bundleUpdate.js

@@ -1,104 +0,0 @@
-const crypto = require('crypto')
-const fs = require('fs')
-const fsp = fs.promises
-const path = require('path')
-
-const DIST_DIR = './dist'
-const BUNDLES_DIR = '/_expo/static/js'
-const IOS_BUNDLE_DIR = path.join(DIST_DIR, BUNDLES_DIR, '/ios')
-const ANDROID_BUNDLE_DIR = path.join(DIST_DIR, BUNDLES_DIR, '/android')
-const METADATA_PATH = path.join(DIST_DIR, '/metadata.json')
-const DEST_DIR = './bundleTempDir'
-
-// Weird, don't feel like figuring out _why_ it wants this
-const METADATA = require(`../${METADATA_PATH}`)
-const IOS_METADATA_ASSETS = METADATA.fileMetadata.ios.assets
-const ANDROID_METADATA_ASSETS = METADATA.fileMetadata.android.assets
-
-const getMd5 = async path => {
-  return new Promise(res => {
-    const hash = crypto.createHash('md5')
-    const rStream = fs.createReadStream(path)
-    rStream.on('data', data => {
-      hash.update(data)
-    })
-    rStream.on('end', () => {
-      res(hash.digest('hex'))
-    })
-  })
-}
-
-const moveFiles = async () => {
-  console.log('Making directory...')
-  await fsp.mkdir(DEST_DIR)
-  await fsp.mkdir(path.join(DEST_DIR, '/assets'))
-
-  console.log('Getting ios md5...')
-  const iosCurrPath = path.join(
-    IOS_BUNDLE_DIR,
-    (await fsp.readdir(IOS_BUNDLE_DIR))[0],
-  )
-  const iosMd5 = await getMd5(iosCurrPath)
-  const iosNewPath = `bundles/${iosMd5}.bundle`
-
-  console.log('Copying ios bundle...')
-  await fsp.cp(iosCurrPath, path.join(DEST_DIR, iosNewPath))
-
-  console.log('Getting android md5...')
-  const androidCurrPath = path.join(
-    ANDROID_BUNDLE_DIR,
-    (await fsp.readdir(ANDROID_BUNDLE_DIR))[0],
-  )
-  const androidMd5 = await getMd5(androidCurrPath)
-  const androidNewPath = `bundles/${androidMd5}.bundle`
-
-  console.log('Copying android bundle...')
-  await fsp.cp(androidCurrPath, path.join(DEST_DIR, androidNewPath))
-
-  const iosAssets = []
-  const androidAssets = []
-
-  console.log('Getting ios asset md5s and moving them...')
-  for (const asset of IOS_METADATA_ASSETS) {
-    const currPath = path.join(DIST_DIR, asset.path)
-    const md5 = await getMd5(currPath)
-    const withExtPath = `assets/${md5}.${asset.ext}`
-    iosAssets.push(withExtPath)
-    await fsp.cp(currPath, path.join(DEST_DIR, withExtPath))
-  }
-
-  console.log('Getting android asset md5s and moving them...')
-  for (const asset of ANDROID_METADATA_ASSETS) {
-    const currPath = path.join(DIST_DIR, asset.path)
-    const md5 = await getMd5(currPath)
-    const withExtPath = `assets/${md5}.${asset.ext}`
-    androidAssets.push(withExtPath)
-    await fsp.cp(currPath, path.join(DEST_DIR, withExtPath))
-  }
-
-  const result = {
-    version: 0,
-    bundler: 'metro',
-    fileMetadata: {
-      ios: {
-        bundle: iosNewPath,
-        assets: iosAssets,
-      },
-      android: {
-        bundle: androidNewPath,
-        assets: androidAssets,
-      },
-    },
-  }
-
-  console.log('Writing metadata...')
-  await fsp.writeFile(
-    path.join(DEST_DIR, 'metadata.json'),
-    JSON.stringify(result),
-  )
-
-  console.log('Finished!')
-  console.log('Metadata:', result)
-}
-
-moveFiles()

scripts/bundleUpdate.sh

@@ -1,26 +0,0 @@
-#!/bin/bash
-set -o errexit
-set -o pipefail
-set -o nounset
-
-rm -rf bundleTempDir
-rm -rf bundle.tar.gz
-
-echo "Creating tarball..."
-node scripts/bundleUpdate.js
-
-cd bundleTempDir || exit
-
-BUNDLE_VERSION=$(date +%s)
-DEPLOYMENT_URL="https://updates.bsky.app/v1/upload?runtime-version=$RUNTIME_VERSION&bundle-version=$BUNDLE_VERSION"
-
-tar czvf bundle.tar.gz ./*
-
-echo "Deploying to $DEPLOYMENT_URL..."
-
-curl -o - --form "bundle=@./bundle.tar.gz" --user "bsky:$DENIS_API_KEY" --basic "$DEPLOYMENT_URL"
-
-cd ..
-
-rm -rf bundleTempDir
-rm -rf bundle.tar.gz

src/App.native.tsx

@@ -1,56 +1,54 @@
 import 'react-native-url-polyfill/auto'
 import 'lib/sentry' // must be near top
+
+import React, {useState, useEffect} from 'react'
+import {RootSiblingParent} from 'react-native-root-siblings'
+import * as SplashScreen from 'expo-splash-screen'
+import {GestureHandlerRootView} from 'react-native-gesture-handler'
+import {QueryClientProvider} from '@tanstack/react-query'
+import {
+  SafeAreaProvider,
+  initialWindowMetrics,
+} from 'react-native-safe-area-context'
+
 import 'view/icons'
 
-import React, {useEffect, useState} from 'react'
-import {GestureHandlerRootView} from 'react-native-gesture-handler'
-import {RootSiblingParent} from 'react-native-root-siblings'
-import {
-  initialWindowMetrics,
-  SafeAreaProvider,
-} from 'react-native-safe-area-context'
-import * as SplashScreen from 'expo-splash-screen'
-import {msg} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {PersistQueryClientProvider} from '@tanstack/react-query-persist-client'
-
-import {Provider as StatsigProvider} from '#/lib/statsig/statsig'
+import {ThemeProvider as Alf} from '#/alf'
+import {useColorModeTheme} from '#/alf/util/useColorModeTheme'
 import {init as initPersistedState} from '#/state/persisted'
-import * as persisted from '#/state/persisted'
-import {Provider as LabelDefsProvider} from '#/state/preferences/label-defs'
-import {useIntentHandler} from 'lib/hooks/useIntentHandler'
-import * as notifications from 'lib/notifications/notifications'
-import {
-  asyncStoragePersister,
-  dehydrateOptions,
-  queryClient,
-} from 'lib/react-query'
-import {s} from 'lib/styles'
+import {listenSessionDropped} from './state/events'
 import {ThemeProvider} from 'lib/ThemeContext'
-import {Provider as DialogStateProvider} from 'state/dialogs'
-import {Provider as InvitesStateProvider} from 'state/invites'
-import {Provider as LightboxStateProvider} from 'state/lightbox'
+import {s} from 'lib/styles'
+import {Shell} from 'view/shell'
+import * as notifications from 'lib/notifications/notifications'
+import * as Toast from 'view/com/util/Toast'
+import {queryClient} from 'lib/react-query'
+import {TestCtrls} from 'view/com/testing/TestCtrls'
+import {Provider as ShellStateProvider} from 'state/shell'
 import {Provider as ModalStateProvider} from 'state/modals'
+import {Provider as DialogStateProvider} from 'state/dialogs'
+import {Provider as LightboxStateProvider} from 'state/lightbox'
 import {Provider as MutedThreadsProvider} from 'state/muted-threads'
+import {Provider as InvitesStateProvider} from 'state/invites'
 import {Provider as PrefsStateProvider} from 'state/preferences'
-import {Provider as UnreadNotifsProvider} from 'state/queries/notifications/unread'
+import {Provider as LoggedOutViewProvider} from 'state/shell/logged-out'
+import {Provider as SelectedFeedProvider} from 'state/shell/selected-feed'
+import I18nProvider from './locale/i18nProvider'
 import {
   Provider as SessionProvider,
   useSession,
   useSessionApi,
 } from 'state/session'
-import {Provider as ShellStateProvider} from 'state/shell'
-import {Provider as LoggedOutViewProvider} from 'state/shell/logged-out'
-import {Provider as SelectedFeedProvider} from 'state/shell/selected-feed'
-import {TestCtrls} from 'view/com/testing/TestCtrls'
-import * as Toast from 'view/com/util/Toast'
-import {Shell} from 'view/shell'
-import {ThemeProvider as Alf} from '#/alf'
-import {useColorModeTheme} from '#/alf/util/useColorModeTheme'
-import {Provider as PortalProvider} from '#/components/Portal'
+import {Provider as UnreadNotifsProvider} from 'state/queries/notifications/unread'
+import * as persisted from '#/state/persisted'
 import {Splash} from '#/Splash'
-import I18nProvider from './locale/i18nProvider'
-import {listenSessionDropped} from './state/events'
+import {Provider as PortalProvider} from '#/components/Portal'
+import {Provider as StatsigProvider} from '#/lib/statsig/statsig'
+import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useIntentHandler} from 'lib/hooks/useIntentHandler'
+import {StatusBar} from 'expo-status-bar'
+import {isAndroid} from 'platform/detection'
 
 SplashScreen.preventAutoHideAsync()
 
@@ -74,29 +72,28 @@ function InnerApp() {
 
   return (
     <SafeAreaProvider initialMetrics={initialWindowMetrics}>
+      {isAndroid && <StatusBar />}
       <Alf theme={theme}>
         <Splash isReady={!isInitialLoad}>
           <React.Fragment
             // Resets the entire tree below when it changes:
             key={currentAccount?.did}>
             <StatsigProvider>
-              <LabelDefsProvider>
-                <LoggedOutViewProvider>
-                  <SelectedFeedProvider>
-                    <UnreadNotifsProvider>
-                      <ThemeProvider theme={theme}>
-                        {/* All components should be within this provider */}
-                        <RootSiblingParent>
-                          <GestureHandlerRootView style={s.h100pct}>
-                            <TestCtrls />
-                            <Shell />
-                          </GestureHandlerRootView>
-                        </RootSiblingParent>
-                      </ThemeProvider>
-                    </UnreadNotifsProvider>
-                  </SelectedFeedProvider>
-                </LoggedOutViewProvider>
-              </LabelDefsProvider>
+              <LoggedOutViewProvider>
+                <SelectedFeedProvider>
+                  <UnreadNotifsProvider>
+                    <ThemeProvider theme={theme}>
+                      {/* All components should be within this provider */}
+                      <RootSiblingParent>
+                        <GestureHandlerRootView style={s.h100pct}>
+                          <TestCtrls />
+                          <Shell />
+                        </GestureHandlerRootView>
+                      </RootSiblingParent>
+                    </ThemeProvider>
+                  </UnreadNotifsProvider>
+                </SelectedFeedProvider>
+              </LoggedOutViewProvider>
             </StatsigProvider>
           </React.Fragment>
         </Splash>
@@ -121,9 +118,7 @@ function App() {
    * that is set up in the InnerApp component above.
    */
   return (
-    <PersistQueryClientProvider
-      client={queryClient}
-      persistOptions={{persister: asyncStoragePersister, dehydrateOptions}}>
+    <QueryClientProvider client={queryClient}>
       <SessionProvider>
         <ShellStateProvider>
           <PrefsStateProvider>
@@ -145,7 +140,7 @@ function App() {
           </PrefsStateProvider>
         </ShellStateProvider>
       </SessionProvider>
-    </PersistQueryClientProvider>
+    </QueryClientProvider>
   )
 }
 

src/App.web.tsx

@@ -1,7 +1,7 @@
 import 'lib/sentry' // must be near top
 
 import React, {useState, useEffect} from 'react'
-import {PersistQueryClientProvider} from '@tanstack/react-query-persist-client'
+import {QueryClientProvider} from '@tanstack/react-query'
 import {SafeAreaProvider} from 'react-native-safe-area-context'
 import {RootSiblingParent} from 'react-native-root-siblings'
 
@@ -13,11 +13,7 @@ import {init as initPersistedState} from '#/state/persisted'
 import {Shell} from 'view/shell/index'
 import {ToastContainer} from 'view/com/util/Toast.web'
 import {ThemeProvider} from 'lib/ThemeContext'
-import {
-  queryClient,
-  asyncStoragePersister,
-  dehydrateOptions,
-} from 'lib/react-query'
+import {queryClient} from 'lib/react-query'
 import {Provider as ShellStateProvider} from 'state/shell'
 import {Provider as ModalStateProvider} from 'state/modals'
 import {Provider as DialogStateProvider} from 'state/dialogs'
@@ -27,7 +23,6 @@ import {Provider as InvitesStateProvider} from 'state/invites'
 import {Provider as PrefsStateProvider} from 'state/preferences'
 import {Provider as LoggedOutViewProvider} from 'state/shell/logged-out'
 import {Provider as SelectedFeedProvider} from 'state/shell/selected-feed'
-import {Provider as LabelDefsProvider} from '#/state/preferences/label-defs'
 import I18nProvider from './locale/i18nProvider'
 import {
   Provider as SessionProvider,
@@ -61,23 +56,21 @@ function InnerApp() {
         // Resets the entire tree below when it changes:
         key={currentAccount?.did}>
         <StatsigProvider>
-          <LabelDefsProvider>
-            <LoggedOutViewProvider>
-              <SelectedFeedProvider>
-                <UnreadNotifsProvider>
-                  <ThemeProvider theme={theme}>
-                    {/* All components should be within this provider */}
-                    <RootSiblingParent>
-                      <SafeAreaProvider>
-                        <Shell />
-                      </SafeAreaProvider>
-                    </RootSiblingParent>
-                    <ToastContainer />
-                  </ThemeProvider>
-                </UnreadNotifsProvider>
-              </SelectedFeedProvider>
-            </LoggedOutViewProvider>
-          </LabelDefsProvider>
+          <LoggedOutViewProvider>
+            <SelectedFeedProvider>
+              <UnreadNotifsProvider>
+                <ThemeProvider theme={theme}>
+                  {/* All components should be within this provider */}
+                  <RootSiblingParent>
+                    <SafeAreaProvider>
+                      <Shell />
+                    </SafeAreaProvider>
+                  </RootSiblingParent>
+                  <ToastContainer />
+                </ThemeProvider>
+              </UnreadNotifsProvider>
+            </SelectedFeedProvider>
+          </LoggedOutViewProvider>
         </StatsigProvider>
       </React.Fragment>
     </Alf>
@@ -100,9 +93,7 @@ function App() {
    * that is set up in the InnerApp component above.
    */
   return (
-    <PersistQueryClientProvider
-      client={queryClient}
-      persistOptions={{persister: asyncStoragePersister, dehydrateOptions}}>
+    <QueryClientProvider client={queryClient}>
       <SessionProvider>
         <ShellStateProvider>
           <PrefsStateProvider>
@@ -124,7 +115,7 @@ function App() {
           </PrefsStateProvider>
         </ShellStateProvider>
       </SessionProvider>
-    </PersistQueryClientProvider>
+    </QueryClientProvider>
   )
 }
 

src/Navigation.tsx

@@ -1,86 +1,84 @@
 import * as React from 'react'
-import {JSX} from 'react/jsx-runtime'
-import {i18n, MessageDescriptor} from '@lingui/core'
-import {msg} from '@lingui/macro'
+import {
+  NavigationContainer,
+  createNavigationContainerRef,
+  CommonActions,
+  StackActions,
+  DefaultTheme,
+  DarkTheme,
+} from '@react-navigation/native'
 import {
   BottomTabBarProps,
   createBottomTabNavigator,
 } from '@react-navigation/bottom-tabs'
 import {
-  CommonActions,
-  createNavigationContainerRef,
-  DarkTheme,
-  DefaultTheme,
-  NavigationContainer,
-  StackActions,
-} from '@react-navigation/native'
-
-import {timeout} from 'lib/async/timeout'
-import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle'
-import {usePalette} from 'lib/hooks/usePalette'
-import {buildStateObject} from 'lib/routes/helpers'
-import {
-  AllNavigatorParams,
-  BottomTabNavigatorParams,
-  FeedsTabNavigatorParams,
-  FlatNavigatorParams,
   HomeTabNavigatorParams,
-  MyProfileTabNavigatorParams,
-  NotificationsTabNavigatorParams,
   SearchTabNavigatorParams,
+  FeedsTabNavigatorParams,
+  NotificationsTabNavigatorParams,
+  FlatNavigatorParams,
+  AllNavigatorParams,
+  MyProfileTabNavigatorParams,
+  BottomTabNavigatorParams,
 } from 'lib/routes/types'
-import {RouteParams, State} from 'lib/routes/types'
-import {bskyTitle} from 'lib/strings/headings'
+import {BottomBar} from './view/shell/bottom-bar/BottomBar'
+import {buildStateObject} from 'lib/routes/helpers'
+import {State, RouteParams} from 'lib/routes/types'
 import {isAndroid, isNative} from 'platform/detection'
-import {PreferencesExternalEmbeds} from '#/view/screens/PreferencesExternalEmbeds'
-import {AppPasswords} from 'view/screens/AppPasswords'
-import {ModerationBlockedAccounts} from 'view/screens/ModerationBlockedAccounts'
-import {ModerationMutedAccounts} from 'view/screens/ModerationMutedAccounts'
-import {PreferencesFollowingFeed} from 'view/screens/PreferencesFollowingFeed'
-import {PreferencesThreads} from 'view/screens/PreferencesThreads'
-import {SavedFeeds} from 'view/screens/SavedFeeds'
-import HashtagScreen from '#/screens/Hashtag'
-import {ModerationScreen} from '#/screens/Moderation'
-import {ProfileLabelerLikedByScreen} from '#/screens/Profile/ProfileLabelerLikedBy'
-import {init as initAnalytics} from './lib/analytics/analytics'
-import {useWebScrollRestoration} from './lib/hooks/useWebScrollRestoration'
-import {attachRouteToLogEvents, logEvent} from './lib/statsig/statsig'
+import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle'
 import {router} from './routes'
-import {useModalControls} from './state/modals'
+import {usePalette} from 'lib/hooks/usePalette'
+import {bskyTitle} from 'lib/strings/headings'
+import {JSX} from 'react/jsx-runtime'
+import {timeout} from 'lib/async/timeout'
 import {useUnreadNotifications} from './state/queries/notifications/unread'
 import {useSession} from './state/session'
+import {useModalControls} from './state/modals'
 import {
-  setEmailConfirmationRequested,
   shouldRequestEmailConfirmation,
+  setEmailConfirmationRequested,
 } from './state/shell/reminders'
-import {CommunityGuidelinesScreen} from './view/screens/CommunityGuidelines'
-import {CopyrightPolicyScreen} from './view/screens/CopyrightPolicy'
-import {DebugModScreen} from './view/screens/DebugMod'
-import {FeedsScreen} from './view/screens/Feeds'
+import {init as initAnalytics} from './lib/analytics/analytics'
+import {useWebScrollRestoration} from './lib/hooks/useWebScrollRestoration'
+
 import {HomeScreen} from './view/screens/Home'
-import {LanguageSettingsScreen} from './view/screens/LanguageSettings'
+import {SearchScreen} from './view/screens/Search'
+import {FeedsScreen} from './view/screens/Feeds'
+import {NotificationsScreen} from './view/screens/Notifications'
 import {ListsScreen} from './view/screens/Lists'
-import {LogScreen} from './view/screens/Log'
+import {ModerationScreen} from './view/screens/Moderation'
 import {ModerationModlistsScreen} from './view/screens/ModerationModlists'
 import {NotFoundScreen} from './view/screens/NotFound'
-import {NotificationsScreen} from './view/screens/Notifications'
-import {PostLikedByScreen} from './view/screens/PostLikedBy'
-import {PostRepostedByScreen} from './view/screens/PostRepostedBy'
-import {PostThreadScreen} from './view/screens/PostThread'
-import {PrivacyPolicyScreen} from './view/screens/PrivacyPolicy'
+import {SettingsScreen} from './view/screens/Settings'
+import {LanguageSettingsScreen} from './view/screens/LanguageSettings'
 import {ProfileScreen} from './view/screens/Profile'
-import {ProfileFeedScreen} from './view/screens/ProfileFeed'
-import {ProfileFeedLikedByScreen} from './view/screens/ProfileFeedLikedBy'
 import {ProfileFollowersScreen} from './view/screens/ProfileFollowers'
 import {ProfileFollowsScreen} from './view/screens/ProfileFollows'
+import {ProfileFeedScreen} from './view/screens/ProfileFeed'
+import {ProfileFeedLikedByScreen} from './view/screens/ProfileFeedLikedBy'
 import {ProfileListScreen} from './view/screens/ProfileList'
-import {SearchScreen} from './view/screens/Search'
-import {SettingsScreen} from './view/screens/Settings'
+import {PostThreadScreen} from './view/screens/PostThread'
+import {PostLikedByScreen} from './view/screens/PostLikedBy'
+import {PostRepostedByScreen} from './view/screens/PostRepostedBy'
 import {Storybook} from './view/screens/Storybook'
+import {LogScreen} from './view/screens/Log'
 import {SupportScreen} from './view/screens/Support'
+import {PrivacyPolicyScreen} from './view/screens/PrivacyPolicy'
 import {TermsOfServiceScreen} from './view/screens/TermsOfService'
-import {BottomBar} from './view/shell/bottom-bar/BottomBar'
+import {CommunityGuidelinesScreen} from './view/screens/CommunityGuidelines'
+import {CopyrightPolicyScreen} from './view/screens/CopyrightPolicy'
+import {AppPasswords} from 'view/screens/AppPasswords'
+import {ModerationMutedAccounts} from 'view/screens/ModerationMutedAccounts'
+import {ModerationBlockedAccounts} from 'view/screens/ModerationBlockedAccounts'
+import {SavedFeeds} from 'view/screens/SavedFeeds'
+import {PreferencesFollowingFeed} from 'view/screens/PreferencesFollowingFeed'
+import {PreferencesThreads} from 'view/screens/PreferencesThreads'
+import {PreferencesExternalEmbeds} from '#/view/screens/PreferencesExternalEmbeds'
 import {createNativeStackNavigatorWithAuth} from './view/shell/createNativeStackNavigatorWithAuth'
+import {msg} from '@lingui/macro'
+import {i18n, MessageDescriptor} from '@lingui/core'
+import HashtagScreen from '#/screens/Hashtag'
+import {logEvent} from './lib/statsig/statsig'
 
 const navigationRef = createNavigationContainerRef<AllNavigatorParams>()
 
@@ -200,21 +198,11 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
         getComponent={() => ProfileFeedLikedByScreen}
         options={{title: title(msg`Liked by`)}}
       />
-      <Stack.Screen
-        name="ProfileLabelerLikedBy"
-        getComponent={() => ProfileLabelerLikedByScreen}
-        options={{title: title(msg`Liked by`)}}
-      />
       <Stack.Screen
         name="Debug"
         getComponent={() => Storybook}
         options={{title: title(msg`Storybook`), requireAuth: true}}
       />
-      <Stack.Screen
-        name="DebugMod"
-        getComponent={() => DebugModScreen}
-        options={{title: title(msg`Moderation states`), requireAuth: true}}
-      />
       <Stack.Screen
         name="Log"
         getComponent={() => LogScreen}
@@ -554,28 +542,15 @@ function RoutesContainer({children}: React.PropsWithChildren<{}>) {
       ref={navigationRef}
       linking={LINKING}
       theme={theme}
-      onStateChange={() => {
-        logEvent('router:navigate', {})
-      }}
       onReady={() => {
-        attachRouteToLogEvents(getCurrentRouteName)
         logModuleInitTime()
         onReady()
-        logEvent('router:navigate', {})
       }}>
       {children}
     </NavigationContainer>
   )
 }
 
-function getCurrentRouteName() {
-  if (navigationRef.isReady()) {
-    return navigationRef.getCurrentRoute()?.name
-  } else {
-    return undefined
-  }
-}
-
 /**
  * These helpers can be used from outside of the RoutesContainer
  * (eg in the state models).
@@ -681,9 +656,7 @@ function logModuleInitTime() {
     performance.now() - global.__BUNDLE_START_TIME__,
   )
   console.log(`Time to first paint: ${initMs} ms`)
-  logEvent('init', {
-    initMs,
-  })
+  logEvent('init', initMs)
 
   if (__DEV__) {
     // This log is noisy, so keep false committed
@@ -697,11 +670,11 @@ function logModuleInitTime() {
 }
 
 export {
-  FlatNavigator,
-  handleLink,
   navigate,
-  reset,
   resetToTab,
-  RoutesContainer,
+  reset,
+  handleLink,
   TabsNavigator,
+  FlatNavigator,
+  RoutesContainer,
 }

src/alf/atoms.ts

@@ -1,14 +1,12 @@
-import {Platform} from 'react-native'
-
+import {web, native} from '#/alf/util/platform'
 import * as tokens from '#/alf/tokens'
-import {native, web} from '#/alf/util/platform'
 
 export const atoms = {
   /*
    * Positioning
    */
   fixed: {
-    position: Platform.select({web: 'fixed', native: 'absolute'}) as 'absolute',
+    position: 'fixed',
   },
   absolute: {
     position: 'absolute',
@@ -51,9 +49,6 @@ export const atoms = {
   h_full: {
     height: '100%',
   },
-  h_full_vh: web({
-    height: '100vh',
-  }),
 
   /*
    * Border radius
@@ -116,12 +111,6 @@ export const atoms = {
   flex_row: {
     flexDirection: 'row',
   },
-  flex_col_reverse: {
-    flexDirection: 'column-reverse',
-  },
-  flex_row_reverse: {
-    flexDirection: 'row-reverse',
-  },
   flex_wrap: {
     flexWrap: 'wrap',
   },
@@ -158,12 +147,6 @@ export const atoms = {
   align_end: {
     alignItems: 'flex-end',
   },
-  align_baseline: {
-    alignItems: 'baseline',
-  },
-  align_stretch: {
-    alignItems: 'stretch',
-  },
   self_auto: {
     alignSelf: 'auto',
   },
@@ -253,11 +236,8 @@ export const atoms = {
   font_normal: {
     fontWeight: tokens.fontWeight.normal,
   },
-  font_semibold: {
-    fontWeight: tokens.fontWeight.semibold,
-  },
   font_bold: {
-    fontWeight: tokens.fontWeight.bold,
+    fontWeight: tokens.fontWeight.semibold,
   },
   italic: {
     fontStyle: 'italic',
@@ -307,9 +287,6 @@ export const atoms = {
   /*
    * Padding
    */
-  p_0: {
-    padding: 0,
-  },
   p_2xs: {
     padding: tokens.space._2xs,
   },
@@ -340,10 +317,6 @@ export const atoms = {
   p_5xl: {
     padding: tokens.space._5xl,
   },
-  px_0: {
-    paddingLeft: 0,
-    paddingRight: 0,
-  },
   px_2xs: {
     paddingLeft: tokens.space._2xs,
     paddingRight: tokens.space._2xs,
@@ -384,10 +357,6 @@ export const atoms = {
     paddingLeft: tokens.space._5xl,
     paddingRight: tokens.space._5xl,
   },
-  py_0: {
-    paddingTop: 0,
-    paddingBottom: 0,
-  },
   py_2xs: {
     paddingTop: tokens.space._2xs,
     paddingBottom: tokens.space._2xs,
@@ -428,9 +397,6 @@ export const atoms = {
     paddingTop: tokens.space._5xl,
     paddingBottom: tokens.space._5xl,
   },
-  pt_0: {
-    paddingTop: 0,
-  },
   pt_2xs: {
     paddingTop: tokens.space._2xs,
   },
@@ -461,9 +427,6 @@ export const atoms = {
   pt_5xl: {
     paddingTop: tokens.space._5xl,
   },
-  pb_0: {
-    paddingBottom: 0,
-  },
   pb_2xs: {
     paddingBottom: tokens.space._2xs,
   },
@@ -494,9 +457,6 @@ export const atoms = {
   pb_5xl: {
     paddingBottom: tokens.space._5xl,
   },
-  pl_0: {
-    paddingLeft: 0,
-  },
   pl_2xs: {
     paddingLeft: tokens.space._2xs,
   },
@@ -527,9 +487,6 @@ export const atoms = {
   pl_5xl: {
     paddingLeft: tokens.space._5xl,
   },
-  pr_0: {
-    paddingRight: 0,
-  },
   pr_2xs: {
     paddingRight: tokens.space._2xs,
   },
@@ -564,9 +521,6 @@ export const atoms = {
   /*
    * Margin
    */
-  m_0: {
-    margin: 0,
-  },
   m_2xs: {
     margin: tokens.space._2xs,
   },
@@ -597,13 +551,6 @@ export const atoms = {
   m_5xl: {
     margin: tokens.space._5xl,
   },
-  m_auto: {
-    margin: 'auto',
-  },
-  mx_0: {
-    marginLeft: 0,
-    marginRight: 0,
-  },
   mx_2xs: {
     marginLeft: tokens.space._2xs,
     marginRight: tokens.space._2xs,
@@ -644,14 +591,6 @@ export const atoms = {
     marginLeft: tokens.space._5xl,
     marginRight: tokens.space._5xl,
   },
-  mx_auto: {
-    marginLeft: 'auto',
-    marginRight: 'auto',
-  },
-  my_0: {
-    marginTop: 0,
-    marginBottom: 0,
-  },
   my_2xs: {
     marginTop: tokens.space._2xs,
     marginBottom: tokens.space._2xs,
@@ -692,13 +631,6 @@ export const atoms = {
     marginTop: tokens.space._5xl,
     marginBottom: tokens.space._5xl,
   },
-  my_auto: {
-    marginTop: 'auto',
-    marginBottom: 'auto',
-  },
-  mt_0: {
-    marginTop: 0,
-  },
   mt_2xs: {
     marginTop: tokens.space._2xs,
   },
@@ -729,12 +661,6 @@ export const atoms = {
   mt_5xl: {
     marginTop: tokens.space._5xl,
   },
-  mt_auto: {
-    marginTop: 'auto',
-  },
-  mb_0: {
-    marginBottom: 0,
-  },
   mb_2xs: {
     marginBottom: tokens.space._2xs,
   },
@@ -765,12 +691,6 @@ export const atoms = {
   mb_5xl: {
     marginBottom: tokens.space._5xl,
   },
-  mb_auto: {
-    marginBottom: 'auto',
-  },
-  ml_0: {
-    marginLeft: 0,
-  },
   ml_2xs: {
     marginLeft: tokens.space._2xs,
   },
@@ -801,12 +721,6 @@ export const atoms = {
   ml_5xl: {
     marginLeft: tokens.space._5xl,
   },
-  ml_auto: {
-    marginLeft: 'auto',
-  },
-  mr_0: {
-    marginRight: 0,
-  },
   mr_2xs: {
     marginRight: tokens.space._2xs,
   },
@@ -837,7 +751,4 @@ export const atoms = {
   mr_5xl: {
     marginRight: tokens.space._5xl,
   },
-  mr_auto: {
-    marginRight: 'auto',
-  },
 } as const

src/alf/index.tsx

@@ -16,7 +16,6 @@ type BreakpointName = keyof typeof breakpoints
 const breakpoints: {
   [key: string]: number
 } = {
-  gtPhone: 500,
   gtMobile: 800,
   gtTablet: 1300,
 }
@@ -27,7 +26,6 @@ function getActiveBreakpoints({width}: {width: number}) {
 
   return {
     active: active[active.length - 1],
-    gtPhone: active.includes('gtPhone'),
     gtMobile: active.includes('gtMobile'),
     gtTablet: active.includes('gtTablet'),
   }
@@ -41,7 +39,6 @@ export const Context = React.createContext<{
   theme: themes.Theme
   breakpoints: {
     active: BreakpointName | undefined
-    gtPhone: boolean
     gtMobile: boolean
     gtTablet: boolean
   }
@@ -50,7 +47,6 @@ export const Context = React.createContext<{
   theme: themes.light,
   breakpoints: {
     active: undefined,
-    gtPhone: false,
     gtMobile: false,
     gtTablet: false,
   },

src/alf/tokens.ts

@@ -1,8 +1,8 @@
 import {
   BLUE_HUE,
-  generateScale,
-  GREEN_HUE,
   RED_HUE,
+  GREEN_HUE,
+  generateScale,
 } from '#/alf/util/colorGeneration'
 
 export const scale = generateScale(6, 100)
@@ -12,9 +12,6 @@ export const dimScale = generateScale(12, 100)
 export const color = {
   trueBlack: '#000000',
 
-  temp_purple: 'rgb(105 0 255)',
-  temp_purple_dark: 'rgb(83 0 202)',
-
   gray_0: `hsl(${BLUE_HUE}, 20%, ${scale[14]}%)`,
   gray_25: `hsl(${BLUE_HUE}, 20%, ${scale[13]}%)`,
   gray_50: `hsl(${BLUE_HUE}, 20%, ${scale[12]}%)`,
@@ -116,8 +113,8 @@ export const borderRadius = {
 
 export const fontWeight = {
   normal: '400',
-  semibold: '500',
-  bold: '600',
+  semibold: '600',
+  bold: '900',
 } as const
 
 export const gradients = {

src/components/Button.tsx

@@ -1,23 +1,20 @@
 import React from 'react'
 import {
-  AccessibilityProps,
   Pressable,
-  PressableProps,
-  StyleProp,
-  StyleSheet,
   Text,
+  PressableProps,
   TextProps,
-  TextStyle,
-  View,
   ViewStyle,
+  AccessibilityProps,
+  View,
+  TextStyle,
+  StyleSheet,
+  StyleProp,
 } from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
-import {Trans} from '@lingui/macro'
 
-import {logger} from '#/logger'
-import {android, atoms as a, flatten, tokens, useTheme} from '#/alf'
+import {useTheme, atoms as a, tokens, android, flatten} from '#/alf'
 import {Props as SVGIconProps} from '#/components/icons/common'
-import {normalizeTextStyles} from '#/components/Typography'
 
 export type ButtonVariant = 'solid' | 'outline' | 'ghost' | 'gradient'
 export type ButtonColor =
@@ -142,7 +139,7 @@ export function Button({
     }))
   }, [setState])
 
-  const {baseStyles, hoverStyles} = React.useMemo(() => {
+  const {baseStyles, hoverStyles, focusStyles} = React.useMemo(() => {
     const baseStyles: ViewStyle[] = []
     const hoverStyles: ViewStyle[] = []
     const light = t.name === 'light'
@@ -194,14 +191,14 @@ export function Button({
       if (variant === 'solid') {
         if (!disabled) {
           baseStyles.push({
-            backgroundColor: t.palette.contrast_25,
+            backgroundColor: t.palette.contrast_50,
           })
           hoverStyles.push({
-            backgroundColor: t.palette.contrast_50,
+            backgroundColor: t.palette.contrast_100,
           })
         } else {
           baseStyles.push({
-            backgroundColor: t.palette.contrast_100,
+            backgroundColor: t.palette.contrast_200,
           })
         }
       } else if (variant === 'outline') {
@@ -311,6 +308,12 @@ export function Button({
     return {
       baseStyles,
       hoverStyles,
+      focusStyles: [
+        ...hoverStyles,
+        {
+          outline: 0,
+        } as ViewStyle,
+      ],
     }
   }, [t, variant, color, size, shape, disabled])
 
@@ -373,8 +376,10 @@ export function Button({
         a.flex_row,
         a.align_center,
         a.justify_center,
+        a.justify_center,
         flattenedBaseStyles,
         ...(state.hovered || state.pressed ? hoverStyles : []),
+        ...(state.focused ? focusStyles : []),
         flatten(style),
       ]}
       onPressIn={onPressIn}
@@ -393,7 +398,7 @@ export function Button({
           ]}>
           <LinearGradient
             colors={
-              state.hovered || state.pressed
+              state.hovered || state.pressed || state.focused
                 ? gradientHoverColors
                 : gradientColors
             }
@@ -405,51 +410,18 @@ export function Button({
         </View>
       )}
       <Context.Provider value={context}>
-        <ButtonTextErrorBoundary>
-          {/* @ts-ignore */}
-          {typeof children === 'string' || children?.type === Trans ? (
-            /* @ts-ignore */
-            <ButtonText>{children}</ButtonText>
-          ) : typeof children === 'function' ? (
-            children(context)
-          ) : (
-            children
-          )}
-        </ButtonTextErrorBoundary>
+        {typeof children === 'string' ? (
+          <ButtonText>{children}</ButtonText>
+        ) : typeof children === 'function' ? (
+          children(context)
+        ) : (
+          children
+        )}
       </Context.Provider>
     </Pressable>
   )
 }
 
-export class ButtonTextErrorBoundary extends React.Component<
-  React.PropsWithChildren<{}>,
-  {hasError: boolean; error: Error | undefined}
-> {
-  public state = {
-    hasError: false,
-    error: undefined,
-  }
-
-  public static getDerivedStateFromError(error: Error) {
-    return {hasError: true, error}
-  }
-
-  public componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
-    logger.error('ButtonTextErrorBoundary caught an error', {
-      message: error.message,
-      errorInfo,
-    })
-  }
-
-  public render() {
-    if (this.state.hasError) {
-      return <ButtonText>ERROR</ButtonText>
-    }
-
-    return this.props.children
-  }
-}
-
 export function useSharedButtonTextStyles() {
   const t = useTheme()
   const {color, variant, disabled, size} = useButtonContext()
@@ -555,14 +527,7 @@ export function ButtonText({children, style, ...rest}: ButtonTextProps) {
   const textStyles = useSharedButtonTextStyles()
 
   return (
-    <Text
-      {...rest}
-      style={normalizeTextStyles([
-        a.font_bold,
-        a.text_center,
-        textStyles,
-        style,
-      ])}>
+    <Text {...rest} style={[a.font_bold, a.text_center, textStyles, style]}>
       {children}
     </Text>
   )

src/components/Dialog/index.tsx

@@ -1,31 +1,30 @@
 import React, {useImperativeHandle} from 'react'
-import {Dimensions, Pressable, View} from 'react-native'
-import Animated, {useAnimatedStyle} from 'react-native-reanimated'
-import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import {View, Dimensions, Keyboard, Pressable} from 'react-native'
 import BottomSheet, {
   BottomSheetBackdropProps,
   BottomSheetScrollView,
-  BottomSheetScrollViewMethods,
   BottomSheetTextInput,
   BottomSheetView,
   useBottomSheet,
   WINDOW_HEIGHT,
-} from '@discord/bottom-sheet/src'
+} from '@gorhom/bottom-sheet'
+import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import Animated, {useAnimatedStyle} from 'react-native-reanimated'
 
+import {useTheme, atoms as a, flatten} from '#/alf'
+import {Portal} from '#/components/Portal'
+import {createInput} from '#/components/forms/TextField'
 import {logger} from '#/logger'
 import {useDialogStateControlContext} from '#/state/dialogs'
-import {isNative} from 'platform/detection'
-import {atoms as a, flatten, useTheme} from '#/alf'
-import {Context} from '#/components/Dialog/context'
+
 import {
+  DialogOuterProps,
   DialogControlProps,
   DialogInnerProps,
-  DialogOuterProps,
 } from '#/components/Dialog/types'
-import {createInput} from '#/components/forms/TextField'
-import {Portal} from '#/components/Portal'
+import {Context} from '#/components/Dialog/context'
 
-export {useDialogContext, useDialogControl} from '#/components/Dialog/context'
+export {useDialogControl, useDialogContext} from '#/components/Dialog/context'
 export * from '#/components/Dialog/types'
 // @ts-ignore
 export const Input = createInput(BottomSheetTextInput)
@@ -76,7 +75,6 @@ export function Outer({
   control,
   onClose,
   nativeOptions,
-  testID,
 }: React.PropsWithChildren<DialogOuterProps>) {
   const t = useTheme()
   const sheet = React.useRef<BottomSheet>(null)
@@ -122,6 +120,7 @@ export function Outer({
   )
 
   const onCloseInner = React.useCallback(() => {
+    Keyboard.dismiss()
     try {
       closeCallback.current?.()
     } catch (e: any) {
@@ -146,8 +145,7 @@ export function Outer({
           accessibilityViewIsModal
           // Android
           importantForAccessibility="yes"
-          style={[a.absolute, a.inset_0]}
-          testID={testID}>
+          style={[a.absolute, a.inset_0]}>
           <BottomSheet
             enableDynamicSizing={!hasSnapPoints}
             enablePanDownToClose
@@ -205,14 +203,12 @@ export function Inner({children, style}: DialogInnerProps) {
   )
 }
 
-export const ScrollableInner = React.forwardRef<
-  BottomSheetScrollViewMethods,
-  DialogInnerProps
->(function ScrollableInner({children, style}, ref) {
+export function ScrollableInner({children, style}: DialogInnerProps) {
   const insets = useSafeAreaInsets()
   return (
     <BottomSheetScrollView
       keyboardShouldPersistTaps="handled"
+      keyboardDismissMode="on-drag"
       style={[
         a.flex_1, // main diff is this
         a.p_xl,
@@ -223,20 +219,24 @@ export const ScrollableInner = React.forwardRef<
           borderTopRightRadius: 40,
         },
         flatten(style),
-      ]}
-      contentContainerStyle={isNative ? a.pb_4xl : undefined}
-      ref={ref}>
+      ]}>
       {children}
       <View style={{height: insets.bottom + a.pt_5xl.paddingTop}} />
     </BottomSheetScrollView>
   )
-})
+}
 
 export function Handle() {
   const t = useTheme()
 
+  const onTouchStart = React.useCallback(() => {
+    Keyboard.dismiss()
+  }, [])
+
   return (
-    <View style={[a.absolute, a.w_full, a.align_center, a.z_10, {height: 40}]}>
+    <View
+      style={[a.absolute, a.w_full, a.align_center, a.z_10, {height: 40}]}
+      onTouchStart={onTouchStart}>
       <View
         style={[
           a.rounded_sm,

src/components/Dialog/index.web.tsx

@@ -99,7 +99,7 @@ export function Outer({
                     style={[
                       web(a.fixed),
                       a.inset_0,
-                      {opacity: 0.8, backgroundColor: t.palette.black},
+                      {opacity: 0.5, backgroundColor: t.palette.black},
                     ]}
                   />
                 )}

src/components/Dialog/types.ts

@@ -1,10 +1,6 @@
 import React from 'react'
-import type {
-  AccessibilityProps,
-  GestureResponderEvent,
-  ScrollViewProps,
-} from 'react-native'
-import {BottomSheetProps} from '@discord/bottom-sheet/src'
+import type {AccessibilityProps} from 'react-native'
+import {BottomSheetProps} from '@gorhom/bottom-sheet'
 
 import {ViewStyleProp} from '#/alf'
 
@@ -14,15 +10,9 @@ type A11yProps = Required<AccessibilityProps>
  * Mutated by useImperativeHandle to provide a public API for controlling the
  * dialog. The methods here will actually become the handlers defined within
  * the `Dialog.Outer` component.
- *
- * `Partial<GestureResponderEvent>` here allows us to add this directly to the
- * `onPress` prop of a button, for example. If this type was not added, we
- * would need to create a function to wrap `.open()` with.
  */
 export type DialogControlRefProps = {
-  open: (
-    options?: DialogControlOpenOptions & Partial<GestureResponderEvent>,
-  ) => void
+  open: (options?: DialogControlOpenOptions) => void
   close: (callback?: () => void) => void
 }
 
@@ -56,7 +46,6 @@ export type DialogOuterProps = {
     sheet?: Omit<BottomSheetProps, 'children'>
   }
   webOptions?: {}
-  testID?: string
 }
 
 type DialogInnerPropsBase<T> = React.PropsWithChildren<ViewStyleProp> & T
@@ -65,11 +54,9 @@ export type DialogInnerProps =
       label?: undefined
       accessibilityLabelledBy: A11yProps['aria-labelledby']
       accessibilityDescribedBy: string
-      keyboardDismissMode?: ScrollViewProps['keyboardDismissMode']
     }>
   | DialogInnerPropsBase<{
       label: string
       accessibilityLabelledBy?: undefined
       accessibilityDescribedBy?: undefined
-      keyboardDismissMode?: ScrollViewProps['keyboardDismissMode']
     }>

src/components/Error.tsx

@@ -1,90 +0,0 @@
-import React from 'react'
-
-import {CenteredView} from 'view/com/util/Views'
-import {atoms as a, useBreakpoints, useTheme} from '#/alf'
-import {Text} from '#/components/Typography'
-import {View} from 'react-native'
-import {Button} from '#/components/Button'
-import {useNavigation} from '@react-navigation/core'
-import {NavigationProp} from 'lib/routes/types'
-import {StackActions} from '@react-navigation/native'
-import {router} from '#/routes'
-
-export function Error({
-  title,
-  message,
-  onRetry,
-}: {
-  title?: string
-  message?: string
-  onRetry?: () => unknown
-}) {
-  const navigation = useNavigation<NavigationProp>()
-  const t = useTheme()
-  const {gtMobile} = useBreakpoints()
-
-  const canGoBack = navigation.canGoBack()
-  const onGoBack = React.useCallback(() => {
-    if (canGoBack) {
-      navigation.goBack()
-    } else {
-      navigation.navigate('HomeTab')
-
-      // Checking the state for routes ensures that web doesn't encounter errors while going back
-      if (navigation.getState()?.routes) {
-        navigation.dispatch(StackActions.push(...router.matchPath('/')))
-      } else {
-        navigation.navigate('HomeTab')
-        navigation.dispatch(StackActions.popToTop())
-      }
-    }
-  }, [navigation, canGoBack])
-
-  return (
-    <CenteredView
-      style={[
-        a.flex_1,
-        a.align_center,
-        !gtMobile ? a.justify_between : a.gap_5xl,
-        t.atoms.border_contrast_low,
-        {paddingTop: 175, paddingBottom: 110},
-      ]}
-      sideBorders>
-      <View style={[a.w_full, a.align_center, a.gap_lg]}>
-        <Text style={[a.font_bold, a.text_3xl]}>{title}</Text>
-        <Text
-          style={[
-            a.text_md,
-            a.text_center,
-            t.atoms.text_contrast_high,
-            {lineHeight: 1.4},
-            gtMobile && {width: 450},
-          ]}>
-          {message}
-        </Text>
-      </View>
-      <View style={[a.gap_md, gtMobile ? {width: 350} : [a.w_full, a.px_lg]]}>
-        {onRetry && (
-          <Button
-            variant="solid"
-            color="primary"
-            label="Click here"
-            onPress={onRetry}
-            size="large"
-            style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]}>
-            Retry
-          </Button>
-        )}
-        <Button
-          variant="solid"
-          color={onRetry ? 'secondary' : 'primary'}
-          label="Click here"
-          onPress={onGoBack}
-          size="large"
-          style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]}>
-          Go Back
-        </Button>
-      </View>
-    </CenteredView>
-  )
-}

src/components/GradientFill.tsx

@@ -1,27 +0,0 @@
-import React from 'react'
-import LinearGradient from 'react-native-linear-gradient'
-
-import {atoms as a, tokens} from '#/alf'
-
-export function GradientFill({
-  gradient,
-}: {
-  gradient:
-    | typeof tokens.gradients.sky
-    | typeof tokens.gradients.midnight
-    | typeof tokens.gradients.sunrise
-    | typeof tokens.gradients.sunset
-    | typeof tokens.gradients.bonfire
-    | typeof tokens.gradients.summer
-    | typeof tokens.gradients.nordic
-}) {
-  return (
-    <LinearGradient
-      colors={gradient.values.map(c => c[1])}
-      locations={gradient.values.map(c => c[0])}
-      start={{x: 0, y: 0}}
-      end={{x: 1, y: 1}}
-      style={[a.absolute, a.inset_0]}
-    />
-  )
-}

src/components/LabelingServiceCard/index.tsx

@@ -1,182 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {AppBskyLabelerDefs} from '@atproto/api'
-
-import {getLabelingServiceTitle} from '#/lib/moderation'
-import {Link as InternalLink, LinkProps} from '#/components/Link'
-import {Text} from '#/components/Typography'
-import {useLabelerInfoQuery} from '#/state/queries/labeler'
-import {atoms as a, useTheme, ViewStyleProp} from '#/alf'
-import {RichText} from '#/components/RichText'
-import {ChevronRight_Stroke2_Corner0_Rounded as ChevronRight} from '../icons/Chevron'
-import {UserAvatar} from '#/view/com/util/UserAvatar'
-import {sanitizeHandle} from '#/lib/strings/handles'
-import {pluralize} from '#/lib/strings/helpers'
-
-type LabelingServiceProps = {
-  labeler: AppBskyLabelerDefs.LabelerViewDetailed
-}
-
-export function Outer({
-  children,
-  style,
-}: React.PropsWithChildren<ViewStyleProp>) {
-  return (
-    <View
-      style={[
-        a.flex_row,
-        a.gap_md,
-        a.w_full,
-        a.p_lg,
-        a.pr_md,
-        a.overflow_hidden,
-        style,
-      ]}>
-      {children}
-    </View>
-  )
-}
-
-export function Avatar({avatar}: {avatar?: string}) {
-  return <UserAvatar type="labeler" size={40} avatar={avatar} />
-}
-
-export function Title({value}: {value: string}) {
-  return <Text style={[a.text_md, a.font_bold]}>{value}</Text>
-}
-
-export function Description({value, handle}: {value?: string; handle: string}) {
-  return value ? (
-    <Text numberOfLines={2}>
-      <RichText value={value} style={[]} />
-    </Text>
-  ) : (
-    <Text>
-      <Trans>By {sanitizeHandle(handle, '@')}</Trans>
-    </Text>
-  )
-}
-
-export function LikeCount({count}: {count: number}) {
-  const t = useTheme()
-  return (
-    <Text
-      style={[
-        a.mt_sm,
-        a.text_sm,
-        t.atoms.text_contrast_medium,
-        {fontWeight: '500'},
-      ]}>
-      <Trans>
-        Liked by {count} {pluralize(count, 'user')}
-      </Trans>
-    </Text>
-  )
-}
-
-export function Content({children}: React.PropsWithChildren<{}>) {
-  const t = useTheme()
-
-  return (
-    <View
-      style={[
-        a.flex_1,
-        a.flex_row,
-        a.gap_md,
-        a.align_center,
-        a.justify_between,
-      ]}>
-      <View style={[a.gap_xs, a.flex_1]}>{children}</View>
-
-      <ChevronRight size="md" style={[a.z_10, t.atoms.text_contrast_low]} />
-    </View>
-  )
-}
-
-/**
- * The canonical view for a labeling service. Use this or compose your own.
- */
-export function Default({
-  labeler,
-  style,
-}: LabelingServiceProps & ViewStyleProp) {
-  return (
-    <Outer style={style}>
-      <Avatar avatar={labeler.creator.avatar} />
-      <Content>
-        <Title
-          value={getLabelingServiceTitle({
-            displayName: labeler.creator.displayName,
-            handle: labeler.creator.handle,
-          })}
-        />
-        <Description
-          value={labeler.creator.description}
-          handle={labeler.creator.handle}
-        />
-        {labeler.likeCount ? <LikeCount count={labeler.likeCount} /> : null}
-      </Content>
-    </Outer>
-  )
-}
-
-export function Link({
-  children,
-  labeler,
-}: LabelingServiceProps & Pick<LinkProps, 'children'>) {
-  const {_} = useLingui()
-
-  return (
-    <InternalLink
-      to={{
-        screen: 'Profile',
-        params: {
-          name: labeler.creator.handle,
-        },
-      }}
-      label={_(
-        msg`View the labeling service provided by @${labeler.creator.handle}`,
-      )}>
-      {children}
-    </InternalLink>
-  )
-}
-
-// TODO not finished yet
-export function DefaultSkeleton() {
-  return (
-    <View>
-      <Text>Loading</Text>
-    </View>
-  )
-}
-
-export function Loader({
-  did,
-  loading: LoadingComponent = DefaultSkeleton,
-  error: ErrorComponent,
-  component: Component,
-}: {
-  did: string
-  loading?: React.ComponentType<{}>
-  error?: React.ComponentType<{error: string}>
-  component: React.ComponentType<{
-    labeler: AppBskyLabelerDefs.LabelerViewDetailed
-  }>
-}) {
-  const {isLoading, data, error} = useLabelerInfoQuery({did})
-
-  return isLoading ? (
-    LoadingComponent ? (
-      <LoadingComponent />
-    ) : null
-  ) : error || !data ? (
-    ErrorComponent ? (
-      <ErrorComponent error={error?.message || 'Unknown error'} />
-    ) : null
-  ) : (
-    <Component labeler={data} />
-  )
-}

src/components/LikedByList.tsx

@@ -1,109 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-import {AppBskyFeedGetLikes as GetLikes} from '@atproto/api'
-import {Trans} from '@lingui/macro'
-
-import {logger} from '#/logger'
-import {List} from '#/view/com/util/List'
-import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard'
-import {useResolveUriQuery} from '#/state/queries/resolve-uri'
-import {useLikedByQuery} from '#/state/queries/post-liked-by'
-import {useInitialNumToRender} from 'lib/hooks/useInitialNumToRender'
-import {ListFooter} from '#/components/Lists'
-
-import {atoms as a, useTheme} from '#/alf'
-import {Loader} from '#/components/Loader'
-import {Text} from '#/components/Typography'
-
-export function LikedByList({uri}: {uri: string}) {
-  const t = useTheme()
-  const [isPTRing, setIsPTRing] = React.useState(false)
-  const {
-    data: resolvedUri,
-    error: resolveError,
-    isFetching: isFetchingResolvedUri,
-  } = useResolveUriQuery(uri)
-  const {
-    data,
-    isFetching,
-    isFetched,
-    isRefetching,
-    hasNextPage,
-    fetchNextPage,
-    isError,
-    error: likedByError,
-    refetch,
-  } = useLikedByQuery(resolvedUri?.uri)
-  const likes = React.useMemo(() => {
-    if (data?.pages) {
-      return data.pages.flatMap(page => page.likes)
-    }
-    return []
-  }, [data])
-  const initialNumToRender = useInitialNumToRender()
-  const error = resolveError || likedByError
-
-  const onRefresh = React.useCallback(async () => {
-    setIsPTRing(true)
-    try {
-      await refetch()
-    } catch (err) {
-      logger.error('Failed to refresh likes', {message: err})
-    }
-    setIsPTRing(false)
-  }, [refetch, setIsPTRing])
-
-  const onEndReached = React.useCallback(async () => {
-    if (isFetching || !hasNextPage || isError) return
-    try {
-      await fetchNextPage()
-    } catch (err) {
-      logger.error('Failed to load more likes', {message: err})
-    }
-  }, [isFetching, hasNextPage, isError, fetchNextPage])
-
-  const renderItem = React.useCallback(({item}: {item: GetLikes.Like}) => {
-    return (
-      <ProfileCardWithFollowBtn key={item.actor.did} profile={item.actor} />
-    )
-  }, [])
-
-  if (isFetchingResolvedUri || !isFetched) {
-    return (
-      <View style={[a.w_full, a.align_center, a.p_lg]}>
-        <Loader size="xl" />
-      </View>
-    )
-  }
-
-  return likes.length ? (
-    <List
-      data={likes}
-      keyExtractor={item => item.actor.did}
-      refreshing={isPTRing}
-      onRefresh={onRefresh}
-      onEndReached={onEndReached}
-      onEndReachedThreshold={3}
-      renderItem={renderItem}
-      initialNumToRender={initialNumToRender}
-      ListFooterComponent={() => (
-        <ListFooter
-          isFetching={isFetching && !isRefetching}
-          isError={isError}
-          error={error ? error.toString() : undefined}
-          onRetry={fetchNextPage}
-        />
-      )}
-    />
-  ) : (
-    <View style={[a.p_lg]}>
-      <View style={[a.p_lg, a.rounded_sm, t.atoms.bg_contrast_25]}>
-        <Text style={[a.text_md, a.leading_snug]}>
-          <Trans>
-            Nobody has liked this yet. Maybe you should be the first!
-          </Trans>
-        </Text>
-      </View>
-    </View>
-  )
-}

src/components/LikesDialog.tsx

@@ -1,131 +0,0 @@
-import React, {useMemo, useCallback} from 'react'
-import {ActivityIndicator, FlatList, View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {AppBskyFeedGetLikes as GetLikes} from '@atproto/api'
-
-import {useResolveUriQuery} from '#/state/queries/resolve-uri'
-import {useLikedByQuery} from '#/state/queries/post-liked-by'
-import {cleanError} from '#/lib/strings/errors'
-import {logger} from '#/logger'
-
-import {atoms as a, useTheme} from '#/alf'
-import {Text} from '#/components/Typography'
-import * as Dialog from '#/components/Dialog'
-import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
-import {ProfileCardWithFollowBtn} from '#/view/com/profile/ProfileCard'
-import {Loader} from '#/components/Loader'
-
-interface LikesDialogProps {
-  control: Dialog.DialogOuterProps['control']
-  uri: string
-}
-
-export function LikesDialog(props: LikesDialogProps) {
-  return (
-    <Dialog.Outer control={props.control}>
-      <Dialog.Handle />
-
-      <LikesDialogInner {...props} />
-    </Dialog.Outer>
-  )
-}
-
-export function LikesDialogInner({control, uri}: LikesDialogProps) {
-  const {_} = useLingui()
-  const t = useTheme()
-
-  const {
-    data: resolvedUri,
-    error: resolveError,
-    isFetched: hasFetchedResolvedUri,
-  } = useResolveUriQuery(uri)
-  const {
-    data,
-    isFetching: isFetchingLikedBy,
-    isFetched: hasFetchedLikedBy,
-    isFetchingNextPage,
-    hasNextPage,
-    fetchNextPage,
-    isError,
-    error: likedByError,
-  } = useLikedByQuery(resolvedUri?.uri)
-
-  const isLoading = !hasFetchedResolvedUri || !hasFetchedLikedBy
-  const likes = useMemo(() => {
-    if (data?.pages) {
-      return data.pages.flatMap(page => page.likes)
-    }
-    return []
-  }, [data])
-
-  const onEndReached = useCallback(async () => {
-    if (isFetchingLikedBy || !hasNextPage || isError) return
-    try {
-      await fetchNextPage()
-    } catch (err) {
-      logger.error('Failed to load more likes', {message: err})
-    }
-  }, [isFetchingLikedBy, hasNextPage, isError, fetchNextPage])
-
-  const renderItem = useCallback(
-    ({item}: {item: GetLikes.Like}) => {
-      return (
-        <ProfileCardWithFollowBtn
-          key={item.actor.did}
-          profile={item.actor}
-          onPress={() => control.close()}
-        />
-      )
-    },
-    [control],
-  )
-
-  return (
-    <Dialog.Inner label={_(msg`Users that have liked this content or profile`)}>
-      <Text style={[a.text_2xl, a.font_bold, a.leading_tight, a.pb_lg]}>
-        <Trans>Liked by</Trans>
-      </Text>
-
-      {isLoading ? (
-        <View style={{minHeight: 300}}>
-          <Loader size="xl" />
-        </View>
-      ) : resolveError || likedByError || !data ? (
-        <ErrorMessage message={cleanError(resolveError || likedByError)} />
-      ) : likes.length === 0 ? (
-        <View style={[t.atoms.bg_contrast_50, a.px_md, a.py_xl, a.rounded_md]}>
-          <Text style={[a.text_center]}>
-            <Trans>
-              Nobody has liked this yet. Maybe you should be the first!
-            </Trans>
-          </Text>
-        </View>
-      ) : (
-        <FlatList
-          data={likes}
-          keyExtractor={item => item.actor.did}
-          onEndReached={onEndReached}
-          renderItem={renderItem}
-          initialNumToRender={15}
-          ListFooterComponent={
-            <ListFooterComponent isFetching={isFetchingNextPage} />
-          }
-        />
-      )}
-
-      <Dialog.Close />
-    </Dialog.Inner>
-  )
-}
-
-function ListFooterComponent({isFetching}: {isFetching: boolean}) {
-  if (isFetching) {
-    return (
-      <View style={a.pt_lg}>
-        <ActivityIndicator />
-      </View>
-    )
-  }
-  return null
-}

src/components/Link.tsx

@@ -251,7 +251,7 @@ export function InlineLink({
     onIn: onPressIn,
     onOut: onPressOut,
   } = useInteractionState()
-  const flattenedStyle = flatten(style) || {}
+  const flattenedStyle = flatten(style)
 
   return (
     <Text

src/components/Lists.tsx

@@ -1,28 +1,26 @@
 import React from 'react'
 import {atoms as a, useBreakpoints, useTheme} from '#/alf'
 import {View} from 'react-native'
-import {useLingui} from '@lingui/react'
-import {Trans, msg} from '@lingui/macro'
-
 import {CenteredView} from 'view/com/util/Views'
 import {Loader} from '#/components/Loader'
+import {Trans} from '@lingui/macro'
 import {cleanError} from 'lib/strings/errors'
 import {Button} from '#/components/Button'
 import {Text} from '#/components/Typography'
-import {Error} from '#/components/Error'
+import {StackActions} from '@react-navigation/native'
+import {router} from '#/routes'
+import {useNavigationDeduped} from 'lib/hooks/useNavigationDeduped'
 
 export function ListFooter({
   isFetching,
   isError,
   error,
   onRetry,
-  height,
 }: {
-  isFetching?: boolean
-  isError?: boolean
+  isFetching: boolean
+  isError: boolean
   error?: string
   onRetry?: () => Promise<unknown>
-  height?: number
 }) {
   const t = useTheme()
 
@@ -31,10 +29,11 @@ export function ListFooter({
       style={[
         a.w_full,
         a.align_center,
+        a.justify_center,
         a.border_t,
         a.pb_lg,
         t.atoms.border_contrast_low,
-        {height: height ?? 180, paddingTop: 30},
+        {height: 100},
       ]}>
       {isFetching ? (
         <Loader size="xl" />
@@ -54,12 +53,11 @@ function ListFooterMaybeError({
   error,
   onRetry,
 }: {
-  isError?: boolean
+  isError: boolean
   error?: string
   onRetry?: () => Promise<unknown>
 }) {
   const t = useTheme()
-  const {_} = useLingui()
 
   if (!isError) return null
 
@@ -85,7 +83,7 @@ function ListFooterMaybeError({
         </Text>
         <Button
           variant="gradient"
-          label={_(msg`Press to retry`)}
+          label="Press to retry"
           style={[
             a.align_center,
             a.justify_center,
@@ -95,7 +93,7 @@ function ListFooterMaybeError({
             a.py_sm,
           ]}
           onPress={onRetry}>
-          <Trans>Retry</Trans>
+          Retry
         </Button>
       </View>
     </View>
@@ -130,71 +128,121 @@ export function ListMaybePlaceholder({
   isLoading,
   isEmpty,
   isError,
-  emptyTitle,
-  emptyMessage,
-  errorTitle,
-  errorMessage,
-  emptyType = 'page',
+  empty,
+  error,
+  notFoundType = 'page',
   onRetry,
 }: {
   isLoading: boolean
-  isEmpty?: boolean
-  isError?: boolean
-  emptyTitle?: string
-  emptyMessage?: string
-  errorTitle?: string
-  errorMessage?: string
-  emptyType?: 'page' | 'results'
+  isEmpty: boolean
+  isError: boolean
+  empty?: string
+  error?: string
+  notFoundType?: 'page' | 'results'
   onRetry?: () => Promise<unknown>
 }) {
+  const navigation = useNavigationDeduped()
   const t = useTheme()
-  const {_} = useLingui()
   const {gtMobile, gtTablet} = useBreakpoints()
 
-  if (!isLoading && isError) {
-    return (
-      <Error
-        title={errorTitle ?? _(msg`Oops!`)}
-        message={errorMessage ?? _(`Something went wrong!`)}
-        onRetry={onRetry}
-      />
-    )
-  }
+  const canGoBack = navigation.canGoBack()
+  const onGoBack = React.useCallback(() => {
+    if (canGoBack) {
+      navigation.goBack()
+    } else {
+      navigation.navigate('HomeTab')
 
-  if (isLoading) {
-    return (
-      <CenteredView
-        style={[
-          a.flex_1,
-          a.align_center,
-          !gtMobile ? a.justify_between : a.gap_5xl,
-          t.atoms.border_contrast_low,
-          {paddingTop: 175, paddingBottom: 110},
-        ]}
-        sideBorders={gtMobile}
-        topBorder={!gtTablet}>
+      // Checking the state for routes ensures that web doesn't encounter errors while going back
+      if (navigation.getState()?.routes) {
+        navigation.dispatch(StackActions.push(...router.matchPath('/')))
+      } else {
+        navigation.navigate('HomeTab')
+        navigation.dispatch(StackActions.popToTop())
+      }
+    }
+  }, [navigation, canGoBack])
+
+  if (!isEmpty) return null
+
+  return (
+    <CenteredView
+      style={[
+        a.flex_1,
+        a.align_center,
+        !gtMobile ? a.justify_between : a.gap_5xl,
+        t.atoms.border_contrast_low,
+        {paddingTop: 175, paddingBottom: 110},
+      ]}
+      sideBorders={gtMobile}
+      topBorder={!gtTablet}>
+      {isLoading ? (
         <View style={[a.w_full, a.align_center, {top: 100}]}>
           <Loader size="xl" />
         </View>
-      </CenteredView>
-    )
-  }
+      ) : (
+        <>
+          <View style={[a.w_full, a.align_center, a.gap_lg]}>
+            <Text style={[a.font_bold, a.text_3xl]}>
+              {isError ? (
+                <Trans>Oops!</Trans>
+              ) : isEmpty ? (
+                <>
+                  {notFoundType === 'results' ? (
+                    <Trans>No results found</Trans>
+                  ) : (
+                    <Trans>Page not found</Trans>
+                  )}
+                </>
+              ) : undefined}
+            </Text>
 
-  if (isEmpty) {
-    return (
-      <Error
-        title={
-          emptyTitle ??
-          (emptyType === 'results'
-            ? _(msg`No results found`)
-            : _(msg`Page not found`))
-        }
-        message={
-          emptyMessage ??
-          _(msg`We're sorry! We can't find the page you were looking for.`)
-        }
-        onRetry={onRetry}
-      />
-    )
-  }
+            {isError ? (
+              <Text
+                style={[a.text_md, a.text_center, t.atoms.text_contrast_high]}>
+                {error ? error : <Trans>Something went wrong!</Trans>}
+              </Text>
+            ) : isEmpty ? (
+              <Text
+                style={[a.text_md, a.text_center, t.atoms.text_contrast_high]}>
+                {empty ? (
+                  empty
+                ) : (
+                  <Trans>
+                    We're sorry! We can't find the page you were looking for.
+                  </Trans>
+                )}
+              </Text>
+            ) : undefined}
+          </View>
+          <View
+            style={[a.gap_md, !gtMobile ? [a.w_full, a.px_lg] : {width: 350}]}>
+            {isError && onRetry && (
+              <Button
+                variant="solid"
+                color="primary"
+                label="Click here"
+                onPress={onRetry}
+                size="large"
+                style={[
+                  a.rounded_sm,
+                  a.overflow_hidden,
+                  {paddingVertical: 10},
+                ]}>
+                Retry
+              </Button>
+            )}
+            <Button
+              variant="solid"
+              color={isError && onRetry ? 'secondary' : 'primary'}
+              label="Click here"
+              onPress={onGoBack}
+              size="large"
+              style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]}>
+              Go Back
+            </Button>
+          </View>
+        </>
+      )}
+    </CenteredView>
+  )
 }

src/components/Menu/index.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import {View, Pressable, ViewStyle, StyleProp} from 'react-native'
+import {View, Pressable} from 'react-native'
 import flattenReactChildren from 'react-keyed-flatten-children'
 
 import {atoms as a, useTheme} from '#/alf'
@@ -17,7 +17,7 @@ import {
   ItemIconProps,
 } from '#/components/Menu/types'
 import {Button, ButtonText} from '#/components/Button'
-import {Trans, msg} from '@lingui/macro'
+import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {isNative} from 'platform/detection'
 
@@ -75,10 +75,7 @@ export function Trigger({children, label}: TriggerProps) {
 export function Outer({
   children,
   showCancel,
-}: React.PropsWithChildren<{
-  showCancel?: boolean
-  style?: StyleProp<ViewStyle>
-}>) {
+}: React.PropsWithChildren<{showCancel?: boolean}>) {
   const context = React.useContext(Context)
 
   return (
@@ -209,9 +206,7 @@ function Cancel() {
       variant="ghost"
       color="secondary"
       onPress={() => control.close()}>
-      <ButtonText>
-        <Trans>Cancel</Trans>
-      </ButtonText>
+      <ButtonText>Cancel</ButtonText>
     </Button>
   )
 }

src/components/Menu/index.web.tsx

@@ -1,10 +1,8 @@
 /* eslint-disable react/prop-types */
 
 import React from 'react'
-import {View, Pressable, ViewStyle, StyleProp} from 'react-native'
+import {View, Pressable} from 'react-native'
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
-import {msg} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
 
 import * as Dialog from '#/components/Dialog'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
@@ -21,7 +19,6 @@ import {
   RadixPassThroughTriggerProps,
 } from '#/components/Menu/types'
 import {Context} from '#/components/Menu/context'
-import {Portal} from '#/components/Portal'
 
 export function useMenuControl(): Dialog.DialogControlProps {
   const id = React.useId()
@@ -53,7 +50,6 @@ export function Root({
 }: React.PropsWithChildren<{
   control?: Dialog.DialogOuterProps['control']
 }>) {
-  const {_} = useLingui()
   const defaultControl = useMenuControl()
   const context = React.useMemo<ContextType>(
     () => ({
@@ -74,18 +70,6 @@ export function Root({
 
   return (
     <Context.Provider value={context}>
-      {context.control.isOpen && (
-        <Portal>
-          <Pressable
-            style={[a.fixed, a.inset_0, a.z_50]}
-            onPress={() => context.control.close()}
-            accessibilityHint=""
-            accessibilityLabel={_(
-              msg`Context menu backdrop, click to close the menu.`,
-            )}
-          />
-        </Portal>
-      )}
       <DropdownMenu.Root
         open={context.control.isOpen}
         onOpenChange={onOpenChange}>
@@ -135,10 +119,6 @@ export function Trigger({children, label}: TriggerProps) {
             },
             props: {
               ...props,
-              // disable on web, use `onPress`
-              onPointerDown: () => false,
-              onPress: () =>
-                control.isOpen ? control.close() : control.open(),
               onFocus: onFocus,
               onBlur: onBlur,
               onMouseEnter,
@@ -152,13 +132,7 @@ export function Trigger({children, label}: TriggerProps) {
   )
 }
 
-export function Outer({
-  children,
-  style,
-}: React.PropsWithChildren<{
-  showCancel?: boolean
-  style?: StyleProp<ViewStyle>
-}>) {
+export function Outer({children}: React.PropsWithChildren<{}>) {
   const t = useTheme()
 
   return (
@@ -170,7 +144,6 @@ export function Outer({
             a.p_xs,
             t.name === 'light' ? t.atoms.bg : t.atoms.bg_contrast_25,
             t.atoms.shadow_md,
-            style,
           ]}>
           {children}
         </View>
@@ -223,7 +196,7 @@ export function Item({children, label, onPress, ...rest}: ItemProps) {
         style={flatten([
           a.flex_row,
           a.align_center,
-          a.gap_lg,
+          a.gap_sm,
           a.py_sm,
           a.rounded_xs,
           {minHeight: 32, paddingHorizontal: 10},

src/components/Menu/types.ts

@@ -23,10 +23,6 @@ export type RadixPassThroughTriggerProps = {
   ['aria-haspopup']?: boolean
   ['aria-expanded']?: AccessibilityProps['aria-expanded']
   onKeyDown: (e: React.KeyboardEvent) => void
-  /**
-   * Radix provides this, but we override on web to use `onPress` instead,
-   * which is less sensitive while scrolling.
-   */
   onPointerDown: PressableProps['onPointerDown']
 }
 export type TriggerProps = {
@@ -73,7 +69,6 @@ export type TriggerChildProps =
         pressed: false
       }
       props: RadixPassThroughTriggerProps & {
-        onPress: () => void
         onFocus: () => void
         onBlur: () => void
         onMouseEnter: () => void

src/components/Prompt.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
-import {View} from 'react-native'
+import {View, PressableProps} from 'react-native'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
 import {useTheme, atoms as a, useBreakpoints} from '#/alf'
 import {Text} from '#/components/Typography'
-import {Button, ButtonColor, ButtonText} from '#/components/Button'
+import {Button} from '#/components/Button'
 
 import * as Dialog from '#/components/Dialog'
 
@@ -22,10 +22,8 @@ const Context = React.createContext<{
 export function Outer({
   children,
   control,
-  testID,
 }: React.PropsWithChildren<{
   control: Dialog.DialogOuterProps['control']
-  testID?: string
 }>) {
   const {gtMobile} = useBreakpoints()
   const titleId = React.useId()
@@ -37,7 +35,7 @@ export function Outer({
   )
 
   return (
-    <Dialog.Outer control={control} testID={testID}>
+    <Dialog.Outer control={control}>
       <Context.Provider value={context}>
         <Dialog.Handle />
 
@@ -82,9 +80,7 @@ export function Actions({children}: React.PropsWithChildren<{}>) {
         a.w_full,
         a.gap_sm,
         a.justify_end,
-        gtMobile
-          ? [a.flex_row, a.flex_row_reverse, a.justify_start]
-          : [a.flex_col],
+        gtMobile ? [a.flex_row] : [a.flex_col, a.pt_md, a.pb_4xl],
       ]}>
       {children}
     </View>
@@ -93,29 +89,18 @@ export function Actions({children}: React.PropsWithChildren<{}>) {
 
 export function Cancel({
   children,
-  cta,
-}: React.PropsWithChildren<{
-  /**
-   * Optional i18n string, used in lieu of `children` for simple buttons. If
-   * undefined (and `children` is undefined), it will default to "Cancel".
-   */
-  cta?: string
-}>) {
+}: React.PropsWithChildren<{onPress?: PressableProps['onPress']}>) {
   const {_} = useLingui()
   const {gtMobile} = useBreakpoints()
   const {close} = Dialog.useDialogContext()
-  const onPress = React.useCallback(() => {
-    close()
-  }, [close])
-
   return (
     <Button
       variant="solid"
       color="secondary"
       size={gtMobile ? 'small' : 'medium'}
-      label={cta || _(msg`Cancel`)}
-      onPress={onPress}>
-      {children ? children : <ButtonText>{cta || _(msg`Cancel`)}</ButtonText>}
+      label={_(msg`Cancel`)}
+      onPress={() => close()}>
+      {children}
     </Button>
   )
 }
@@ -123,70 +108,22 @@ export function Cancel({
 export function Action({
   children,
   onPress,
-  color = 'primary',
-  cta,
-  testID,
-}: React.PropsWithChildren<{
-  onPress: () => void
-  color?: ButtonColor
-  /**
-   * Optional i18n string, used in lieu of `children` for simple buttons. If
-   * undefined (and `children` is undefined), it will default to "Confirm".
-   */
-  cta?: string
-  testID?: string
-}>) {
+}: React.PropsWithChildren<{onPress?: () => void}>) {
   const {_} = useLingui()
   const {gtMobile} = useBreakpoints()
   const {close} = Dialog.useDialogContext()
   const handleOnPress = React.useCallback(() => {
     close()
-    onPress()
+    onPress?.()
   }, [close, onPress])
-
   return (
     <Button
       variant="solid"
-      color={color}
+      color="primary"
       size={gtMobile ? 'small' : 'medium'}
-      label={cta || _(msg`Confirm`)}
-      onPress={handleOnPress}
-      testID={testID}>
-      {children ? children : <ButtonText>{cta || _(msg`Confirm`)}</ButtonText>}
+      label={_(msg`Confirm`)}
+      onPress={handleOnPress}>
+      {children}
     </Button>
   )
 }
-
-export function Basic({
-  control,
-  title,
-  description,
-  cancelButtonCta,
-  confirmButtonCta,
-  onConfirm,
-  confirmButtonColor,
-}: React.PropsWithChildren<{
-  control: Dialog.DialogOuterProps['control']
-  title: string
-  description: string
-  cancelButtonCta?: string
-  confirmButtonCta?: string
-  onConfirm: () => void
-  confirmButtonColor?: ButtonColor
-}>) {
-  return (
-    <Outer control={control} testID="confirmModal">
-      <Title>{title}</Title>
-      <Description>{description}</Description>
-      <Actions>
-        <Action
-          cta={confirmButtonCta}
-          onPress={onConfirm}
-          color={confirmButtonColor}
-          testID="confirmBtn"
-        />
-        <Cancel cta={cancelButtonCta} />
-      </Actions>
-    </Outer>
-  )
-}

src/components/ReportDialog/SelectLabelerView.tsx

@@ -1,89 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {AppBskyLabelerDefs} from '@atproto/api'
-
-export {useDialogControl as useReportDialogControl} from '#/components/Dialog'
-import {getLabelingServiceTitle} from '#/lib/moderation'
-
-import {atoms as a, useTheme, useBreakpoints} from '#/alf'
-import {Text} from '#/components/Typography'
-import {Button, useButtonContext} from '#/components/Button'
-import {Divider} from '#/components/Divider'
-import * as LabelingServiceCard from '#/components/LabelingServiceCard'
-
-import {ReportDialogProps} from './types'
-
-export function SelectLabelerView({
-  ...props
-}: ReportDialogProps & {
-  labelers: AppBskyLabelerDefs.LabelerViewDetailed[]
-  onSelectLabeler: (v: string) => void
-}) {
-  const t = useTheme()
-  const {_} = useLingui()
-  const {gtMobile} = useBreakpoints()
-
-  return (
-    <View style={[a.gap_lg]}>
-      <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}>
-        <Text style={[a.text_2xl, a.font_bold]}>
-          <Trans>Select moderator</Trans>
-        </Text>
-        <Text style={[a.text_md, t.atoms.text_contrast_medium]}>
-          <Trans>To whom would you like to send this report?</Trans>
-        </Text>
-      </View>
-
-      <Divider />
-
-      <View style={[a.gap_sm]}>
-        {props.labelers.map(labeler => {
-          return (
-            <Button
-              key={labeler.creator.did}
-              label={_(msg`Send report to ${labeler.creator.displayName}`)}
-              onPress={() => props.onSelectLabeler(labeler.creator.did)}>
-              <LabelerButton labeler={labeler} />
-            </Button>
-          )
-        })}
-      </View>
-    </View>
-  )
-}
-
-function LabelerButton({
-  labeler,
-}: {
-  labeler: AppBskyLabelerDefs.LabelerViewDetailed
-}) {
-  const t = useTheme()
-  const {hovered, pressed} = useButtonContext()
-  const interacted = hovered || pressed
-
-  return (
-    <LabelingServiceCard.Outer
-      style={[
-        a.p_md,
-        a.rounded_sm,
-        t.atoms.bg_contrast_25,
-        interacted && t.atoms.bg_contrast_50,
-      ]}>
-      <LabelingServiceCard.Avatar avatar={labeler.creator.avatar} />
-      <LabelingServiceCard.Content>
-        <LabelingServiceCard.Title
-          value={getLabelingServiceTitle({
-            displayName: labeler.creator.displayName,
-            handle: labeler.creator.handle,
-          })}
-        />
-        <Text
-          style={[t.atoms.text_contrast_medium, a.text_sm, a.font_semibold]}>
-          @{labeler.creator.handle}
-        </Text>
-      </LabelingServiceCard.Content>
-    </LabelingServiceCard.Outer>
-  )
-}

src/components/ReportDialog/SelectReportOptionView.tsx

@@ -1,186 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {AppBskyLabelerDefs} from '@atproto/api'
-
-import {useReportOptions, ReportOption} from '#/lib/moderation/useReportOptions'
-import {DMCA_LINK} from '#/components/ReportDialog/const'
-import {Link} from '#/components/Link'
-export {useDialogControl as useReportDialogControl} from '#/components/Dialog'
-
-import {atoms as a, useTheme, useBreakpoints} from '#/alf'
-import {Text} from '#/components/Typography'
-import {
-  Button,
-  ButtonIcon,
-  ButtonText,
-  useButtonContext,
-} from '#/components/Button'
-import {Divider} from '#/components/Divider'
-import {
-  ChevronRight_Stroke2_Corner0_Rounded as ChevronRight,
-  ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft,
-} from '#/components/icons/Chevron'
-import {SquareArrowTopRight_Stroke2_Corner0_Rounded as SquareArrowTopRight} from '#/components/icons/SquareArrowTopRight'
-
-import {ReportDialogProps} from './types'
-
-export function SelectReportOptionView({
-  ...props
-}: ReportDialogProps & {
-  labelers: AppBskyLabelerDefs.LabelerViewDetailed[]
-  onSelectReportOption: (reportOption: ReportOption) => void
-  goBack: () => void
-}) {
-  const t = useTheme()
-  const {_} = useLingui()
-  const {gtMobile} = useBreakpoints()
-  const allReportOptions = useReportOptions()
-  const reportOptions = allReportOptions[props.params.type]
-
-  const i18n = React.useMemo(() => {
-    let title = _(msg`Report this content`)
-    let description = _(msg`Why should this content be reviewed?`)
-
-    if (props.params.type === 'account') {
-      title = _(msg`Report this user`)
-      description = _(msg`Why should this user be reviewed?`)
-    } else if (props.params.type === 'post') {
-      title = _(msg`Report this post`)
-      description = _(msg`Why should this post be reviewed?`)
-    } else if (props.params.type === 'list') {
-      title = _(msg`Report this list`)
-      description = _(msg`Why should this list be reviewed?`)
-    } else if (props.params.type === 'feedgen') {
-      title = _(msg`Report this feed`)
-      description = _(msg`Why should this feed be reviewed?`)
-    }
-
-    return {
-      title,
-      description,
-    }
-  }, [_, props.params.type])
-
-  return (
-    <View style={[a.gap_lg]}>
-      {props.labelers?.length > 1 ? (
-        <Button
-          size="small"
-          variant="solid"
-          color="secondary"
-          shape="round"
-          label={_(msg`Go back to previous step`)}
-          onPress={props.goBack}>
-          <ButtonIcon icon={ChevronLeft} />
-        </Button>
-      ) : null}
-
-      <View style={[a.justify_center, gtMobile ? a.gap_sm : a.gap_xs]}>
-        <Text style={[a.text_2xl, a.font_bold]}>{i18n.title}</Text>
-        <Text style={[a.text_md, t.atoms.text_contrast_medium]}>
-          {i18n.description}
-        </Text>
-      </View>
-
-      <Divider />
-
-      <View style={[a.gap_sm]}>
-        {reportOptions.map(reportOption => {
-          return (
-            <Button
-              key={reportOption.reason}
-              label={_(msg`Create report for ${reportOption.title}`)}
-              onPress={() => props.onSelectReportOption(reportOption)}>
-              <ReportOptionButton
-                title={reportOption.title}
-                description={reportOption.description}
-              />
-            </Button>
-          )
-        })}
-
-        {(props.params.type === 'post' || props.params.type === 'account') && (
-          <View
-            style={[
-              a.flex_row,
-              a.align_center,
-              a.justify_between,
-              a.gap_lg,
-              a.p_md,
-              a.pl_lg,
-              a.rounded_md,
-              t.atoms.bg_contrast_900,
-            ]}>
-            <Text
-              style={[
-                a.flex_1,
-                t.atoms.text_inverted,
-                a.italic,
-                a.leading_snug,
-              ]}>
-              <Trans>Need to report a copyright violation?</Trans>
-            </Text>
-            <Link
-              to={DMCA_LINK}
-              label={_(msg`View details for reporting a copyright violation`)}
-              size="small"
-              variant="solid"
-              color="secondary">
-              <ButtonText>
-                <Trans>View details</Trans>
-              </ButtonText>
-              <ButtonIcon position="right" icon={SquareArrowTopRight} />
-            </Link>
-          </View>
-        )}
-      </View>
-    </View>
-  )
-}
-
-function ReportOptionButton({
-  title,
-  description,
-}: {
-  title: string
-  description: string
-}) {
-  const t = useTheme()
-  const {hovered, pressed} = useButtonContext()
-  const interacted = hovered || pressed
-
-  return (
-    <View
-      style={[
-        a.w_full,
-        a.flex_row,
-        a.align_center,
-        a.justify_between,
-        a.p_md,
-        a.rounded_md,
-        {paddingRight: 70},
-        t.atoms.bg_contrast_25,
-        interacted && t.atoms.bg_contrast_50,
-      ]}>
-      <View style={[a.flex_1, a.gap_xs]}>
-        <Text style={[a.text_md, a.font_bold, t.atoms.text_contrast_medium]}>
-          {title}
-        </Text>
-        <Text style={[a.leading_tight, {maxWidth: 400}]}>{description}</Text>
-      </View>
-
-      <View
-        style={[
-          a.absolute,
-          a.inset_0,
-          a.justify_center,
-          a.pr_md,
-          {left: 'auto'},
-        ]}>
-        <ChevronRight size="md" fill={t.atoms.text_contrast_low.color} />
-      </View>
-    </View>
-  )
-}

src/components/ReportDialog/SubmitView.tsx

@@ -1,264 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-import {AppBskyLabelerDefs} from '@atproto/api'
-
-import {getLabelingServiceTitle} from '#/lib/moderation'
-import {ReportOption} from '#/lib/moderation/useReportOptions'
-
-import {atoms as a, useTheme, native} from '#/alf'
-import {Text} from '#/components/Typography'
-import * as Dialog from '#/components/Dialog'
-import {Button, ButtonIcon, ButtonText} from '#/components/Button'
-import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron'
-import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check'
-import * as Toggle from '#/components/forms/Toggle'
-import {CharProgress} from '#/view/com/composer/char-progress/CharProgress'
-import {Loader} from '#/components/Loader'
-import * as Toast from '#/view/com/util/Toast'
-
-import {ReportDialogProps} from './types'
-import {getAgent} from '#/state/session'
-
-export function SubmitView({
-  params,
-  labelers,
-  selectedLabeler,
-  selectedReportOption,
-  goBack,
-  onSubmitComplete,
-}: ReportDialogProps & {
-  labelers: AppBskyLabelerDefs.LabelerViewDetailed[]
-  selectedLabeler: string
-  selectedReportOption: ReportOption
-  goBack: () => void
-  onSubmitComplete: () => void
-}) {
-  const t = useTheme()
-  const {_} = useLingui()
-  const [details, setDetails] = React.useState<string>('')
-  const [submitting, setSubmitting] = React.useState<boolean>(false)
-  const [selectedServices, setSelectedServices] = React.useState<string[]>([
-    selectedLabeler,
-  ])
-  const [error, setError] = React.useState('')
-
-  const submit = React.useCallback(async () => {
-    setSubmitting(true)
-    setError('')
-
-    const $type =
-      params.type === 'account'
-        ? 'com.atproto.admin.defs#repoRef'
-        : 'com.atproto.repo.strongRef'
-    const report = {
-      reasonType: selectedReportOption.reason,
-      subject: {
-        $type,
-        ...params,
-      },
-      reason: details,
-    }
-    const results = await Promise.all(
-      selectedServices.map(did =>
-        getAgent()
-          .withProxy('atproto_labeler', did)
-          .createModerationReport(report)
-          .then(
-            _ => true,
-            _ => false,
-          ),
-      ),
-    )
-
-    setSubmitting(false)
-
-    if (results.includes(true)) {
-      Toast.show(_(msg`Thank you. Your report has been sent.`))
-      onSubmitComplete()
-    } else {
-      setError(
-        _(
-          msg`There was an issue sending your report. Please check your internet connection.`,
-        ),
-      )
-    }
-  }, [
-    _,
-    params,
-    details,
-    selectedReportOption,
-    selectedServices,
-    onSubmitComplete,
-    setError,
-  ])
-
-  return (
-    <View style={[a.gap_2xl]}>
-      <Button
-        size="small"
-        variant="solid"
-        color="secondary"
-        shape="round"
-        label={_(msg`Go back to previous step`)}
-        onPress={goBack}>
-        <ButtonIcon icon={ChevronLeft} />
-      </Button>
-
-      <View
-        style={[
-          a.w_full,
-          a.flex_row,
-          a.align_center,
-          a.justify_between,
-          a.gap_lg,
-          a.p_md,
-          a.rounded_md,
-          a.border,
-          t.atoms.border_contrast_low,
-        ]}>
-        <View style={[a.flex_1, a.gap_xs]}>
-          <Text style={[a.text_md, a.font_bold]}>
-            {selectedReportOption.title}
-          </Text>
-          <Text style={[a.leading_tight, {maxWidth: 400}]}>
-            {selectedReportOption.description}
-          </Text>
-        </View>
-
-        <Check size="md" style={[a.pr_sm, t.atoms.text_contrast_low]} />
-      </View>
-
-      <View style={[a.gap_md]}>
-        <Text style={[t.atoms.text_contrast_medium]}>
-          <Trans>Select the moderation service(s) to report to</Trans>
-        </Text>
-
-        <Toggle.Group
-          label="Select mod services"
-          values={selectedServices}
-          onChange={setSelectedServices}>
-          <View style={[a.flex_row, a.gap_md, a.flex_wrap]}>
-            {labelers.map(labeler => {
-              const title = getLabelingServiceTitle({
-                displayName: labeler.creator.displayName,
-                handle: labeler.creator.handle,
-              })
-              return (
-                <Toggle.Item
-                  key={labeler.creator.did}
-                  name={labeler.creator.did}
-                  label={title}>
-                  <LabelerToggle title={title} />
-                </Toggle.Item>
-              )
-            })}
-          </View>
-        </Toggle.Group>
-      </View>
-      <View style={[a.gap_md]}>
-        <Text style={[t.atoms.text_contrast_medium]}>
-          <Trans>Optionally provide additional information below:</Trans>
-        </Text>
-
-        <View style={[a.relative, a.w_full]}>
-          <Dialog.Input
-            multiline
-            value={details}
-            onChangeText={setDetails}
-            label="Text field"
-            style={{paddingRight: 60}}
-            numberOfLines={6}
-          />
-
-          <View
-            style={[
-              a.absolute,
-              a.flex_row,
-              a.align_center,
-              a.pr_md,
-              a.pb_sm,
-              {
-                bottom: 0,
-                right: 0,
-              },
-            ]}>
-            <CharProgress count={details?.length || 0} />
-          </View>
-        </View>
-      </View>
-
-      <View style={[a.flex_row, a.align_center, a.justify_end, a.gap_lg]}>
-        {!selectedServices.length ||
-          (error && (
-            <Text
-              style={[
-                a.flex_1,
-                a.italic,
-                a.leading_snug,
-                t.atoms.text_contrast_medium,
-              ]}>
-              {error ? (
-                error
-              ) : (
-                <Trans>You must select at least one labeler for a report</Trans>
-              )}
-            </Text>
-          ))}
-
-        <Button
-          size="large"
-          variant="solid"
-          color="negative"
-          label={_(msg`Send report`)}
-          onPress={submit}
-          disabled={!selectedServices.length}>
-          <ButtonText>
-            <Trans>Send report</Trans>
-          </ButtonText>
-          {submitting && <ButtonIcon icon={Loader} />}
-        </Button>
-      </View>
-    </View>
-  )
-}
-
-function LabelerToggle({title}: {title: string}) {
-  const t = useTheme()
-  const ctx = Toggle.useItemContext()
-
-  return (
-    <View
-      style={[
-        a.flex_row,
-        a.align_center,
-        a.gap_md,
-        a.p_md,
-        a.pr_lg,
-        a.rounded_sm,
-        a.overflow_hidden,
-        t.atoms.bg_contrast_25,
-        ctx.selected && [t.atoms.bg_contrast_50],
-      ]}>
-      <Toggle.Checkbox />
-      <View
-        style={[
-          a.flex_row,
-          a.align_center,
-          a.justify_between,
-          a.gap_lg,
-          a.z_10,
-        ]}>
-        <Text
-          style={[
-            native({marginTop: 2}),
-            t.atoms.text_contrast_medium,
-            ctx.selected && t.atoms.text,
-          ]}>
-          {title}
-        </Text>
-      </View>
-    </View>
-  )
-}

src/components/ReportDialog/const.ts

@@ -1 +0,0 @@
-export const DMCA_LINK = 'https://bsky.social/about/support/copyright'

src/components/ReportDialog/index.tsx

@@ -1,102 +0,0 @@
-import React from 'react'
-import {Pressable, View} from 'react-native'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-
-import {ReportOption} from '#/lib/moderation/useReportOptions'
-import {useMyLabelersQuery} from '#/state/queries/preferences'
-export {useDialogControl as useReportDialogControl} from '#/components/Dialog'
-
-import {AppBskyLabelerDefs} from '@atproto/api'
-import {BottomSheetScrollViewMethods} from '@discord/bottom-sheet/src'
-
-import {atoms as a} from '#/alf'
-import * as Dialog from '#/components/Dialog'
-import {useDelayedLoading} from '#/components/hooks/useDelayedLoading'
-import {useOnKeyboardDidShow} from '#/components/hooks/useOnKeyboard'
-import {Loader} from '#/components/Loader'
-import {Text} from '#/components/Typography'
-import {SelectLabelerView} from './SelectLabelerView'
-import {SelectReportOptionView} from './SelectReportOptionView'
-import {SubmitView} from './SubmitView'
-import {ReportDialogProps} from './types'
-
-export function ReportDialog(props: ReportDialogProps) {
-  return (
-    <Dialog.Outer control={props.control}>
-      <Dialog.Handle />
-
-      <ReportDialogInner {...props} />
-    </Dialog.Outer>
-  )
-}
-
-function ReportDialogInner(props: ReportDialogProps) {
-  const {_} = useLingui()
-  const {
-    isLoading: isLabelerLoading,
-    data: labelers,
-    error,
-  } = useMyLabelersQuery()
-  const isLoading = useDelayedLoading(500, isLabelerLoading)
-
-  const ref = React.useRef<BottomSheetScrollViewMethods>(null)
-  useOnKeyboardDidShow(() => {
-    ref.current?.scrollToEnd({animated: true})
-  })
-
-  return (
-    <Dialog.ScrollableInner label={_(msg`Report dialog`)} ref={ref}>
-      {isLoading ? (
-        <View style={[a.align_center, {height: 100}]}>
-          <Loader size="xl" />
-          {/* Here to capture focus for a hot sec to prevent flash */}
-          <Pressable accessible={false} />
-        </View>
-      ) : error || !labelers ? (
-        <View>
-          <Text style={[a.text_md]}>
-            <Trans>Something went wrong, please try again.</Trans>
-          </Text>
-        </View>
-      ) : (
-        <ReportDialogLoaded labelers={labelers} {...props} />
-      )}
-    </Dialog.ScrollableInner>
-  )
-}
-
-function ReportDialogLoaded(
-  props: ReportDialogProps & {
-    labelers: AppBskyLabelerDefs.LabelerViewDetailed[]
-  },
-) {
-  const [selectedLabeler, setSelectedLabeler] = React.useState<
-    string | undefined
-  >(props.labelers.length === 1 ? props.labelers[0].creator.did : undefined)
-  const [selectedReportOption, setSelectedReportOption] = React.useState<
-    ReportOption | undefined
-  >()
-
-  if (selectedReportOption && selectedLabeler) {
-    return (
-      <SubmitView
-        {...props}
-        selectedLabeler={selectedLabeler}
-        selectedReportOption={selectedReportOption}
-        goBack={() => setSelectedReportOption(undefined)}
-        onSubmitComplete={() => props.control.close()}
-      />
-    )
-  }
-  if (selectedLabeler) {
-    return (
-      <SelectReportOptionView
-        {...props}
-        goBack={() => setSelectedLabeler(undefined)}
-        onSelectReportOption={setSelectedReportOption}
-      />
-    )
-  }
-  return <SelectLabelerView {...props} onSelectLabeler={setSelectedLabeler} />
-}

src/components/ReportDialog/types.ts

@@ -1,15 +0,0 @@
-import * as Dialog from '#/components/Dialog'
-
-export type ReportDialogProps = {
-  control: Dialog.DialogOuterProps['control']
-  params:
-    | {
-        type: 'post' | 'list' | 'feedgen' | 'other'
-        uri: string
-        cid: string
-      }
-    | {
-        type: 'account'
-        did: string
-      }
-}

src/components/TagMenu/index.tsx

@@ -59,7 +59,7 @@ export function TagMenu({
   const displayTag = '#' + tag
 
   const isMuted = Boolean(
-    (preferences?.moderationPrefs.mutedWords?.find(
+    (preferences?.mutedWords?.find(
       m => m.value === tag && m.targets.includes('tag'),
     ) ??
       optimisticUpsert?.find(
@@ -264,9 +264,7 @@ export function TagMenu({
                 variant="ghost"
                 color="secondary"
                 onPress={() => control.close()}>
-                <ButtonText>
-                  <Trans>Cancel</Trans>
-                </ButtonText>
+                <ButtonText>Cancel</ButtonText>
               </Button>
             </>
           )}

src/components/TagMenu/index.web.tsx

@@ -50,7 +50,7 @@ export function TagMenu({
   const {mutateAsync: removeMutedWord, variables: optimisticRemove} =
     useRemoveMutedWordMutation()
   const isMuted = Boolean(
-    (preferences?.moderationPrefs.mutedWords?.find(
+    (preferences?.mutedWords?.find(
       m => m.value === tag && m.targets.includes('tag'),
     ) ??
       optimisticUpsert?.find(
@@ -87,7 +87,7 @@ export function TagMenu({
               author: authorHandle,
             })
           },
-          testID: 'tagMenuSearchByUser',
+          testID: 'tagMenuSeachByUser',
           icon: {
             ios: {
               name: 'magnifyingglass',

src/components/Typography.tsx

@@ -1,10 +1,5 @@
 import React from 'react'
-import {
-  Text as RNText,
-  StyleProp,
-  TextStyle,
-  TextProps as RNTextProps,
-} from 'react-native'
+import {Text as RNText, TextStyle, TextProps as RNTextProps} from 'react-native'
 import {UITextView} from 'react-native-ui-text-view'
 
 import {useTheme, atoms, web, flatten} from '#/alf'
@@ -39,7 +34,7 @@ export function leading<
  * If the `lineHeight` value is > 2, we assume it's an absolute value and
  * returns it as-is.
  */
-export function normalizeTextStyles(styles: StyleProp<TextStyle>) {
+function normalizeTextStyles(styles: TextStyle[]) {
   const s = flatten(styles)
   // should always be defined on these components
   const fontSize = s.fontSize || atoms.text_md.fontSize

src/components/dialogs/BirthDateSettings.tsx

@@ -1,132 +0,0 @@
-import React from 'react'
-import {useLingui} from '@lingui/react'
-import {Trans, msg} from '@lingui/macro'
-import {View} from 'react-native'
-
-import * as Dialog from '#/components/Dialog'
-import {Text} from '../Typography'
-import {DateInput} from '#/view/com/util/forms/DateInput'
-import {logger} from '#/logger'
-import {
-  usePreferencesQuery,
-  usePreferencesSetBirthDateMutation,
-  UsePreferencesQueryResponse,
-} from '#/state/queries/preferences'
-import {Button, ButtonIcon, ButtonText} from '../Button'
-import {atoms as a, useTheme} from '#/alf'
-import {ErrorMessage} from '#/view/com/util/error/ErrorMessage'
-import {cleanError} from '#/lib/strings/errors'
-import {isIOS, isWeb} from '#/platform/detection'
-import {Loader} from '#/components/Loader'
-
-export function BirthDateSettingsDialog({
-  control,
-}: {
-  control: Dialog.DialogControlProps
-}) {
-  const t = useTheme()
-  const {_} = useLingui()
-  const {isLoading, error, data: preferences} = usePreferencesQuery()
-
-  return (
-    <Dialog.Outer control={control}>
-      <Dialog.Handle />
-
-      <Dialog.ScrollableInner label={_(msg`My Birthday`)}>
-        <View style={[a.gap_sm, a.pb_lg]}>
-          <Text style={[a.text_2xl, a.font_bold]}>
-            <Trans>My Birthday</Trans>
-          </Text>
-          <Text style={[a.text_md, t.atoms.text_contrast_medium]}>
-            <Trans>This information is not shared with other users.</Trans>
-          </Text>
-        </View>
-
-        {isLoading ? (
-          <Loader size="xl" />
-        ) : error || !preferences ? (
-          <ErrorMessage
-            message={
-              error?.toString() ||
-              _(
-                msg`We were unable to load your birth date preferences. Please try again.`,
-              )
-            }
-            style={[a.rounded_sm]}
-          />
-        ) : (
-          <BirthdayInner control={control} preferences={preferences} />
-        )}
-
-        <Dialog.Close />
-      </Dialog.ScrollableInner>
-    </Dialog.Outer>
-  )
-}
-
-function BirthdayInner({
-  control,
-  preferences,
-}: {
-  control: Dialog.DialogControlProps
-  preferences: UsePreferencesQueryResponse
-}) {
-  const {_} = useLingui()
-  const [date, setDate] = React.useState(preferences.birthDate || new Date())
-  const {
-    isPending,
-    isError,
-    error,
-    mutateAsync: setBirthDate,
-  } = usePreferencesSetBirthDateMutation()
-  const hasChanged = date !== preferences.birthDate
-
-  const onSave = React.useCallback(async () => {
-    try {
-      // skip if date is the same
-      if (hasChanged) {
-        await setBirthDate({birthDate: date})
-      }
-      control.close()
-    } catch (e: any) {
-      logger.error(`setBirthDate failed`, {message: e.message})
-    }
-  }, [date, setBirthDate, control, hasChanged])
-
-  return (
-    <View style={a.gap_lg} testID="birthDateSettingsDialog">
-      <View style={isIOS && [a.w_full, a.align_center]}>
-        <DateInput
-          handleAsUTC
-          testID="birthdayInput"
-          value={date}
-          onChange={setDate}
-          buttonType="default-light"
-          buttonStyle={[a.rounded_sm]}
-          buttonLabelType="lg"
-          accessibilityLabel={_(msg`Birthday`)}
-          accessibilityHint={_(msg`Enter your birth date`)}
-          accessibilityLabelledBy="birthDate"
-        />
-      </View>
-
-      {isError ? (
-        <ErrorMessage message={cleanError(error)} style={[a.rounded_sm]} />
-      ) : undefined}
-
-      <View style={isWeb && [a.flex_row, a.justify_end]}>
-        <Button
-          label={hasChanged ? _(msg`Save birthday`) : _(msg`Done`)}
-          size="medium"
-          onPress={onSave}
-          variant="solid"
-          color="primary">
-          <ButtonText>
-            {hasChanged ? <Trans>Save</Trans> : <Trans>Done</Trans>}
-          </ButtonText>
-          {isPending && <ButtonIcon icon={Loader} />}
-        </Button>
-      </View>
-    </View>
-  )
-}

src/components/dialogs/Context.tsx

@@ -18,7 +18,7 @@ export function useGlobalDialogsControlContext() {
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const mutedWordsDialogControl = Dialog.useDialogControl()
-  const ctx = React.useMemo<ControlsContext>(
+  const ctx = React.useMemo(
     () => ({mutedWordsDialogControl}),
     [mutedWordsDialogControl],
   )

src/components/dialogs/MutedWords.tsx

@@ -233,8 +233,8 @@ function MutedWordsInner({}: {control: Dialog.DialogOuterProps['control']}) {
                 </Trans>
               </Text>
             </View>
-          ) : preferences.moderationPrefs.mutedWords.length ? (
-            [...preferences.moderationPrefs.mutedWords]
+          ) : preferences.mutedWords.length ? (
+            [...preferences.mutedWords]
               .reverse()
               .map((word, i) => (
                 <MutedWordRow
@@ -277,16 +277,29 @@ function MutedWordRow({
 
   return (
     <>
-      <Prompt.Basic
-        control={control}
-        title={_(msg`Are you sure?`)}
-        description={_(
-          msg`This will delete ${word.value} from your muted words. You can always add it back later.`,
-        )}
-        onConfirm={remove}
-        confirmButtonCta={_(msg`Remove`)}
-        confirmButtonColor="negative"
-      />
+      <Prompt.Outer control={control}>
+        <Prompt.Title>
+          <Trans>Are you sure?</Trans>
+        </Prompt.Title>
+        <Prompt.Description>
+          <Trans>
+            This will delete {word.value} from your muted words. You can always
+            add it back later.
+          </Trans>
+        </Prompt.Description>
+        <Prompt.Actions>
+          <Prompt.Cancel>
+            <ButtonText>
+              <Trans>Nevermind</Trans>
+            </ButtonText>
+          </Prompt.Cancel>
+          <Prompt.Action onPress={remove}>
+            <ButtonText>
+              <Trans>Remove</Trans>
+            </ButtonText>
+          </Prompt.Action>
+        </Prompt.Actions>
+      </Prompt.Outer>
 
       <View
         style={[

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

@@ -1,11 +1,19 @@
 import React from 'react'
-import DatePicker from 'react-native-date-picker'
+import {View, Pressable} from 'react-native'
 
-import {useTheme} from '#/alf'
-import {DateFieldProps} from '#/components/forms/DateField/types'
-import {toSimpleDateString} from '#/components/forms/DateField/utils'
+import {useTheme, atoms} from '#/alf'
+import {Text} from '#/components/Typography'
+import {useInteractionState} from '#/components/hooks/useInteractionState'
 import * as TextField from '#/components/forms/TextField'
-import {DateFieldButton} from './index.shared'
+import {CalendarDays_Stroke2_Corner0_Rounded as CalendarDays} from '#/components/icons/CalendarDays'
+
+import {DateFieldProps} from '#/components/forms/DateField/types'
+import {
+  localizeDate,
+  toSimpleDateString,
+} from '#/components/forms/DateField/utils'
+import DatePicker from 'react-native-date-picker'
+import {isAndroid} from 'platform/detection'
 
 export * as utils from '#/components/forms/DateField/utils'
 export const Label = TextField.Label
@@ -16,10 +24,18 @@ export function DateField({
   label,
   isInvalid,
   testID,
-  accessibilityHint,
 }: DateFieldProps) {
   const t = useTheme()
   const [open, setOpen] = React.useState(false)
+  const {
+    state: pressed,
+    onIn: onPressIn,
+    onOut: onPressOut,
+  } = useInteractionState()
+  const {state: focused, onIn: onFocus, onOut: onBlur} = useInteractionState()
+
+  const {chromeFocus, chromeError, chromeErrorHover} =
+    TextField.useSharedInputStyles()
 
   const onChangeInternal = React.useCallback(
     (date: Date) => {
@@ -31,29 +47,50 @@ export function DateField({
     [onChangeDate, setOpen],
   )
 
-  const onPress = React.useCallback(() => {
-    setOpen(true)
-  }, [])
-
   const onCancel = React.useCallback(() => {
     setOpen(false)
   }, [])
 
   return (
-    <>
-      <DateFieldButton
-        label={label}
-        value={value}
-        onPress={onPress}
-        isInvalid={isInvalid}
-        accessibilityHint={accessibilityHint}
-      />
+    <View style={[atoms.relative, atoms.w_full]}>
+      <Pressable
+        aria-label={label}
+        accessibilityLabel={label}
+        accessibilityHint={undefined}
+        onPress={() => setOpen(true)}
+        onPressIn={onPressIn}
+        onPressOut={onPressOut}
+        onFocus={onFocus}
+        onBlur={onBlur}
+        style={[
+          {
+            paddingTop: 16,
+            paddingBottom: 16,
+            borderColor: 'transparent',
+            borderWidth: 2,
+          },
+          atoms.flex_row,
+          atoms.flex_1,
+          atoms.w_full,
+          atoms.px_lg,
+          atoms.rounded_sm,
+          t.atoms.bg_contrast_50,
+          focused || pressed ? chromeFocus : {},
+          isInvalid ? chromeError : {},
+          isInvalid && (focused || pressed) ? chromeErrorHover : {},
+        ]}>
+        <TextField.Icon icon={CalendarDays} />
+
+        <Text
+          style={[atoms.text_md, atoms.pl_xs, t.atoms.text, {paddingTop: 3}]}>
+          {localizeDate(value)}
+        </Text>
+      </Pressable>
 
       {open && (
         <DatePicker
-          modal
-          open
-          timeZoneOffsetInMinutes={0}
+          modal={isAndroid}
+          open={isAndroid}
           theme={t.name === 'light' ? 'light' : 'dark'}
           date={new Date(value)}
           onConfirm={onChangeInternal}
@@ -62,9 +99,9 @@ export function DateField({
           testID={`${testID}-datepicker`}
           aria-label={label}
           accessibilityLabel={label}
-          accessibilityHint={accessibilityHint}
+          accessibilityHint={undefined}
         />
       )}
-    </>
+    </View>
   )
 }

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

@@ -1,99 +0,0 @@
-import React from 'react'
-import {Pressable, View} from 'react-native'
-
-import {android, atoms as a, useTheme, web} from '#/alf'
-import * as TextField from '#/components/forms/TextField'
-import {useInteractionState} from '#/components/hooks/useInteractionState'
-import {CalendarDays_Stroke2_Corner0_Rounded as CalendarDays} from '#/components/icons/CalendarDays'
-import {Text} from '#/components/Typography'
-import {localizeDate} from './utils'
-
-// looks like a TextField.Input, but is just a button. It'll do something different on each platform on press
-// iOS: open a dialog with an inline date picker
-// Android: open the date picker modal
-
-export function DateFieldButton({
-  label,
-  value,
-  onPress,
-  isInvalid,
-  accessibilityHint,
-}: {
-  label: string
-  value: string
-  onPress: () => void
-  isInvalid?: boolean
-  accessibilityHint?: string
-}) {
-  const t = useTheme()
-
-  const {
-    state: pressed,
-    onIn: onPressIn,
-    onOut: onPressOut,
-  } = useInteractionState()
-  const {
-    state: hovered,
-    onIn: onHoverIn,
-    onOut: onHoverOut,
-  } = useInteractionState()
-  const {state: focused, onIn: onFocus, onOut: onBlur} = useInteractionState()
-
-  const {chromeHover, chromeFocus, chromeError, chromeErrorHover} =
-    TextField.useSharedInputStyles()
-
-  return (
-    <View
-      style={[a.relative, a.w_full]}
-      {...web({
-        onMouseOver: onHoverIn,
-        onMouseOut: onHoverOut,
-      })}>
-      <Pressable
-        aria-label={label}
-        accessibilityLabel={label}
-        accessibilityHint={accessibilityHint}
-        onPress={onPress}
-        onPressIn={onPressIn}
-        onPressOut={onPressOut}
-        onFocus={onFocus}
-        onBlur={onBlur}
-        style={[
-          {
-            paddingTop: 12,
-            paddingBottom: 12,
-            paddingLeft: 14,
-            paddingRight: 14,
-            borderColor: 'transparent',
-            borderWidth: 2,
-          },
-          android({
-            minHeight: 57.5,
-          }),
-          a.flex_row,
-          a.flex_1,
-          a.w_full,
-          a.rounded_sm,
-          t.atoms.bg_contrast_25,
-          a.align_center,
-          hovered ? chromeHover : {},
-          focused || pressed ? chromeFocus : {},
-          isInvalid || isInvalid ? chromeError : {},
-          (isInvalid || isInvalid) && (hovered || focused)
-            ? chromeErrorHover
-            : {},
-        ]}>
-        <TextField.Icon icon={CalendarDays} />
-        <Text
-          style={[
-            a.text_md,
-            a.pl_xs,
-            t.atoms.text,
-            {lineHeight: a.text_md.fontSize * 1.1875},
-          ]}>
-          {localizeDate(value)}
-        </Text>
-      </Pressable>
-    </View>
-  )
-}

src/components/forms/DateField/index.tsx

@@ -1,16 +1,11 @@
 import React from 'react'
 import {View} from 'react-native'
-import DatePicker from 'react-native-date-picker'
-import {msg, Trans} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
 
-import {atoms as a, useTheme} from '#/alf'
-import {Button, ButtonText} from '#/components/Button'
-import * as Dialog from '#/components/Dialog'
-import {DateFieldProps} from '#/components/forms/DateField/types'
-import {toSimpleDateString} from '#/components/forms/DateField/utils'
+import {useTheme, atoms} from '#/alf'
 import * as TextField from '#/components/forms/TextField'
-import {DateFieldButton} from './index.shared'
+import {toSimpleDateString} from '#/components/forms/DateField/utils'
+import {DateFieldProps} from '#/components/forms/DateField/types'
+import DatePicker from 'react-native-date-picker'
 
 export * as utils from '#/components/forms/DateField/utils'
 export const Label = TextField.Label
@@ -27,12 +22,8 @@ export function DateField({
   onChangeDate,
   testID,
   label,
-  isInvalid,
-  accessibilityHint,
 }: DateFieldProps) {
-  const {_} = useLingui()
   const t = useTheme()
-  const control = Dialog.useDialogControl()
 
   const onChangeInternal = React.useCallback(
     (date: Date | undefined) => {
@@ -45,44 +36,17 @@ export function DateField({
   )
 
   return (
-    <>
-      <DateFieldButton
-        label={label}
-        value={value}
-        onPress={control.open}
-        isInvalid={isInvalid}
-        accessibilityHint={accessibilityHint}
+    <View style={[atoms.relative, atoms.w_full]}>
+      <DatePicker
+        theme={t.name === 'light' ? 'light' : 'dark'}
+        date={new Date(value)}
+        onDateChange={onChangeInternal}
+        mode="date"
+        testID={`${testID}-datepicker`}
+        aria-label={label}
+        accessibilityLabel={label}
+        accessibilityHint={undefined}
       />
-      <Dialog.Outer control={control} testID={testID}>
-        <Dialog.Handle />
-        <Dialog.Inner label={label}>
-          <View style={a.gap_lg}>
-            <View style={[a.relative, a.w_full, a.align_center]}>
-              <DatePicker
-                timeZoneOffsetInMinutes={0}
-                theme={t.name === 'light' ? 'light' : 'dark'}
-                date={new Date(value)}
-                onDateChange={onChangeInternal}
-                mode="date"
-                testID={`${testID}-datepicker`}
-                aria-label={label}
-                accessibilityLabel={label}
-                accessibilityHint={accessibilityHint}
-              />
-            </View>
-            <Button
-              label={_(msg`Done`)}
-              onPress={() => control.close()}
-              size="medium"
-              color="primary"
-              variant="solid">
-              <ButtonText>
-                <Trans>Done</Trans>
-              </ButtonText>
-            </Button>
-          </View>
-        </Dialog.Inner>
-      </Dialog.Outer>
-    </>
+    </View>
   )
 }

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

@@ -1,12 +1,11 @@
 import React from 'react'
-import {StyleSheet, TextInput, TextInputProps} from 'react-native'
+import {TextInput, TextInputProps, StyleSheet} from 'react-native'
 // @ts-ignore
 import {unstable_createElement} from 'react-native-web'
 
-import {DateFieldProps} from '#/components/forms/DateField/types'
-import {toSimpleDateString} from '#/components/forms/DateField/utils'
 import * as TextField from '#/components/forms/TextField'
-import {CalendarDays_Stroke2_Corner0_Rounded as CalendarDays} from '#/components/icons/CalendarDays'
+import {toSimpleDateString} from '#/components/forms/DateField/utils'
+import {DateFieldProps} from '#/components/forms/DateField/types'
 
 export * as utils from '#/components/forms/DateField/utils'
 export const Label = TextField.Label
@@ -38,7 +37,6 @@ export function DateField({
   label,
   isInvalid,
   testID,
-  accessibilityHint,
 }: DateFieldProps) {
   const handleOnChange = React.useCallback(
     (e: any) => {
@@ -54,14 +52,12 @@ export function DateField({
 
   return (
     <TextField.Root isInvalid={isInvalid}>
-      <TextField.Icon icon={CalendarDays} />
       <Input
         value={value}
         label={label}
         onChange={handleOnChange}
         onChangeText={() => {}}
         testID={testID}
-        accessibilityHint={accessibilityHint}
       />
     </TextField.Root>
   )

src/components/forms/DateField/types.ts

@@ -4,5 +4,4 @@ export type DateFieldProps = {
   label: string
   isInvalid?: boolean
   testID?: string
-  accessibilityHint?: string
 }

src/components/forms/FormError.tsx

@@ -1,30 +0,0 @@
-import React from 'react'
-import {View} from 'react-native'
-
-import {atoms as a, useTheme} from '#/alf'
-import {Warning_Stroke2_Corner0_Rounded as Warning} from '#/components/icons/Warning'
-import {Text} from '#/components/Typography'
-
-export function FormError({error}: {error?: string}) {
-  const t = useTheme()
-
-  if (!error) return null
-
-  return (
-    <View
-      style={[
-        {backgroundColor: t.palette.negative_400},
-        a.flex_row,
-        a.rounded_sm,
-        a.p_md,
-        a.gap_sm,
-      ]}>
-      <Warning fill={t.palette.white} size="md" />
-      <View style={[a.flex_1]}>
-        <Text style={[{color: t.palette.white}, a.font_bold, a.leading_snug]}>
-          {error}
-        </Text>
-      </View>
-    </View>
-  )
-}

src/components/forms/HostingProvider.tsx

@@ -1,95 +0,0 @@
-import React from 'react'
-import {Keyboard, View} from 'react-native'
-import {msg} from '@lingui/macro'
-import {useLingui} from '@lingui/react'
-
-import {toNiceDomain} from '#/lib/strings/url-helpers'
-import {isAndroid} from '#/platform/detection'
-import {ServerInputDialog} from '#/view/com/auth/server-input'
-import {atoms as a, useTheme} from '#/alf'
-import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe'
-import {PencilLine_Stroke2_Corner0_Rounded as Pencil} from '#/components/icons/Pencil'
-import {Button} from '../Button'
-import {useDialogControl} from '../Dialog'
-import {Text} from '../Typography'
-
-export function HostingProvider({
-  serviceUrl,
-  onSelectServiceUrl,
-  onOpenDialog,
-}: {
-  serviceUrl: string
-  onSelectServiceUrl: (provider: string) => void
-  onOpenDialog?: () => void
-}) {
-  const serverInputControl = useDialogControl()
-  const t = useTheme()
-  const {_} = useLingui()
-
-  const onPressSelectService = React.useCallback(() => {
-    Keyboard.dismiss()
-    serverInputControl.open()
-    if (onOpenDialog) {
-      onOpenDialog()
-    }
-  }, [onOpenDialog, serverInputControl])
-
-  return (
-    <>
-      <ServerInputDialog
-        control={serverInputControl}
-        onSelect={onSelectServiceUrl}
-      />
-      <Button
-        label={toNiceDomain(serviceUrl)}
-        accessibilityHint={_(msg`Press to change hosting provider`)}
-        variant="solid"
-        color="secondary"
-        style={[
-          a.w_full,
-          a.flex_row,
-          a.align_center,
-          a.rounded_sm,
-          a.px_md,
-          a.pr_sm,
-          a.gap_xs,
-          {paddingVertical: isAndroid ? 14 : 9},
-        ]}
-        onPress={onPressSelectService}>
-        {({hovered, pressed}) => {
-          const interacted = hovered || pressed
-          return (
-            <>
-              <View style={a.pr_xs}>
-                <Globe
-                  size="md"
-                  fill={
-                    interacted ? t.palette.contrast_800 : t.palette.contrast_500
-                  }
-                />
-              </View>
-              <Text style={[a.text_md]}>{toNiceDomain(serviceUrl)}</Text>
-              <View
-                style={[
-                  a.rounded_sm,
-                  interacted
-                    ? t.atoms.bg_contrast_300
-                    : t.atoms.bg_contrast_100,
-                  {marginLeft: 'auto', padding: 6},
-                ]}>
-                <Pencil
-                  size="sm"
-                  style={{
-                    color: interacted
-                      ? t.palette.contrast_800
-                      : t.palette.contrast_500,
-                  }}
-                />
-              </View>
-            </>
-          )
-        }}
-      </Button>
-    </>
-  )
-}

src/components/forms/TextField.tsx

@@ -1,20 +1,19 @@
 import React from 'react'
 import {
-  AccessibilityProps,
-  StyleSheet,
+  View,
   TextInput,
   TextInputProps,
   TextStyle,
-  View,
   ViewStyle,
+  StyleSheet,
+  AccessibilityProps,
 } from 'react-native'
 
-import {mergeRefs} from '#/lib/merge-refs'
 import {HITSLOP_20} from 'lib/constants'
-import {android, atoms as a, useTheme, web} from '#/alf'
+import {useTheme, atoms as a, web, android} from '#/alf'
+import {Text} from '#/components/Typography'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 import {Props as SVGIconProps} from '#/components/icons/common'
-import {Text} from '#/components/Typography'
 
 const Context = React.createContext<{
   inputRef: React.RefObject<TextInput> | null
@@ -126,10 +125,9 @@ export function useSharedInputStyles() {
 
 export type InputProps = Omit<TextInputProps, 'value' | 'onChangeText'> & {
   label: string
-  value?: string
-  onChangeText?: (value: string) => void
+  value: string
+  onChangeText: (value: string) => void
   isInvalid?: boolean
-  inputRef?: React.RefObject<TextInput>
 }
 
 export function createInput(Component: typeof TextInput) {
@@ -139,7 +137,6 @@ export function createInput(Component: typeof TextInput) {
     value,
     onChangeText,
     isInvalid,
-    inputRef,
     ...rest
   }: InputProps) {
     const t = useTheme()
@@ -164,22 +161,19 @@ export function createInput(Component: typeof TextInput) {
       )
     }
 
-    const refs = mergeRefs([ctx.inputRef, inputRef!].filter(Boolean))
-
     return (
       <>
         <Component
           accessibilityHint={undefined}
           {...rest}
           accessibilityLabel={label}
-          ref={refs}
+          ref={ctx.inputRef}
           value={value}
           onChangeText={onChangeText}
           onFocus={ctx.onFocus}
           onBlur={ctx.onBlur}
           placeholder={placeholder || label}
           placeholderTextColor={t.palette.contrast_500}
-          keyboardAppearance={t.name === 'light' ? 'light' : 'dark'}
           hitSlop={HITSLOP_20}
           style={[
             a.relative,
@@ -277,7 +271,7 @@ export function Icon({icon: Comp}: {icon: React.ComponentType<SVGIconProps>}) {
       <Comp
         size="md"
         style={[
-          {color: t.palette.contrast_500, pointerEvents: 'none', flexShrink: 0},
+          {color: t.palette.contrast_500, pointerEvents: 'none'},
           ctx.hovered ? hover : {},
           ctx.focused ? focus : {},
           ctx.isInvalid && ctx.hovered ? errorHover : {},

src/components/forms/Toggle.tsx

@@ -2,14 +2,7 @@ import React from 'react'
 import {Pressable, View, ViewStyle} from 'react-native'
 
 import {HITSLOP_10} from 'lib/constants'
-import {
-  useTheme,
-  atoms as a,
-  native,
-  flatten,
-  ViewStyleProp,
-  TextStyleProp,
-} from '#/alf'
+import {useTheme, atoms as a, web, native, flatten, ViewStyleProp} from '#/alf'
 import {Text} from '#/components/Typography'
 import {useInteractionState} from '#/components/hooks/useInteractionState'
 import {CheckThick_Stroke2_Corner0_Rounded as Checkmark} from '#/components/icons/Check'
@@ -227,17 +220,20 @@ export function Item({
         onPressOut={onPressOut}
         onFocus={onFocus}
         onBlur={onBlur}
-        style={[a.flex_row, a.align_center, a.gap_sm, flatten(style)]}>
+        style={[
+          a.flex_row,
+          a.align_center,
+          a.gap_sm,
+          focused ? web({outline: 'none'}) : {},
+          flatten(style),
+        ]}>
         {typeof children === 'function' ? children(state) : children}
       </Pressable>
     </ItemContext.Provider>
   )
 }
 
-export function Label({
-  children,
-  style,
-}: React.PropsWithChildren<TextStyleProp>) {
+export function Label({children}: React.PropsWithChildren<{}>) {
   const t = useTheme()
   const {disabled} = useItemContext()
   return (
@@ -246,14 +242,11 @@ export function Label({
         a.font_bold,
         {
           userSelect: 'none',
-          color: disabled
-            ? t.atoms.text_contrast_low.color
-            : t.atoms.text_contrast_high.color,
+          color: disabled ? t.palette.contrast_400 : t.palette.contrast_600,
         },
         native({
           paddingTop: 3,
         }),
-        flatten(style),
       ]}>
       {children}
     </Text>
@@ -264,6 +257,7 @@ export function Label({
 export function createSharedToggleStyles({
   theme: t,
   hovered,
+  focused,
   selected,
   disabled,
   isInvalid,
@@ -286,7 +280,7 @@ export function createSharedToggleStyles({
       borderColor: t.palette.primary_500,
     })
 
-    if (hovered) {
+    if (hovered || focused) {
       baseHover.push({
         backgroundColor:
           t.name === 'light' ? t.palette.primary_100 : t.palette.primary_800,
@@ -295,7 +289,7 @@ export function createSharedToggleStyles({
       })
     }
   } else {
-    if (hovered) {
+    if (hovered || focused) {
       baseHover.push({
         backgroundColor:
           t.name === 'light' ? t.palette.contrast_50 : t.palette.contrast_100,
@@ -312,7 +306,7 @@ export function createSharedToggleStyles({
         t.name === 'light' ? t.palette.negative_300 : t.palette.negative_800,
     })
 
-    if (hovered) {
+    if (hovered || focused) {
       baseHover.push({
         backgroundColor:
           t.name === 'light' ? t.palette.negative_25 : t.palette.negative_900,
@@ -359,7 +353,7 @@ export function Checkbox() {
           width: 20,
         },
         baseStyles,
-        hovered ? baseHoverStyles : {},
+        hovered || focused ? baseHoverStyles : {},
       ]}>
       {selected ? <Checkmark size="xs" fill={t.palette.primary_500} /> : null}
     </View>
@@ -391,7 +385,7 @@ export function Switch() {
           width: 30,
         },
         baseStyles,
-        hovered ? baseHoverStyles : {},
+        hovered || focused ? baseHoverStyles : {},
       ]}>
       <View
         style={[
@@ -443,7 +437,7 @@ export function Radio() {
           width: 20,
         },
         baseStyles,
-        hovered ? baseHoverStyles : {},
+        hovered || focused ? baseHoverStyles : {},
       ]}>
       {selected ? (
         <View

src/components/forms/ToggleButton.tsx

@@ -8,9 +8,7 @@ import * as Toggle from '#/components/forms/Toggle'
 
 export type ItemProps = Omit<Toggle.ItemProps, 'style' | 'role' | 'children'> &
   AccessibilityProps &
-  React.PropsWithChildren<{
-    testID?: string
-  }>
+  React.PropsWithChildren<{testID?: string}>
 
 export type GroupProps = Omit<Toggle.GroupProps, 'style' | 'type'> & {
   multiple?: boolean
@@ -103,12 +101,12 @@ function ButtonInner({children}: React.PropsWithChildren<{}>) {
         native({
           paddingBottom: 10,
         }),
-        a.px_md,
+        a.px_sm,
         t.atoms.bg,
         t.atoms.border_contrast_low,
         baseStyles,
         activeStyles,
-        (state.hovered || state.pressed) && hoverStyles,
+        (state.hovered || state.focused || state.pressed) && hoverStyles,
       ]}>
       {typeof children === 'string' ? (
         <Text

src/components/hooks/useDelayedLoading.ts

@@ -1,15 +0,0 @@
-import React from 'react'
-
-export function useDelayedLoading(delay: number, initialState: boolean = true) {
-  const [isLoading, setIsLoading] = React.useState(initialState)
-
-  React.useEffect(() => {
-    let timeout: NodeJS.Timeout
-    // on initial load, show a loading spinner for a hot sec to prevent flash
-    if (isLoading) timeout = setTimeout(() => setIsLoading(false), delay)
-
-    return () => timeout && clearTimeout(timeout)
-  }, [isLoading, delay])
-
-  return isLoading
-}

src/components/hooks/useOnKeyboard.ts

@@ -1,12 +0,0 @@
-import React from 'react'
-import {Keyboard} from 'react-native'
-
-export function useOnKeyboardDidShow(cb: () => unknown) {
-  React.useEffect(() => {
-    const subscription = Keyboard.addListener('keyboardDidShow', cb)
-
-    return () => {
-      subscription.remove()
-    }
-  }, [cb])
-}

src/components/icons/ArrowTriangle.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const ArrowTriangleBottom_Stroke2_Corner1_Rounded = createSinglePathSVG({
-  path: 'M4.213 6.886c-.673-1.35.334-2.889 1.806-2.889H17.98c1.472 0 2.479 1.539 1.806 2.89l-5.982 11.997c-.74 1.484-2.87 1.484-3.61 0L4.213 6.886Z',
-})

src/components/icons/Bars.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const Bars3_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M3 5a1 1 0 0 0 0 2h18a1 1 0 1 0 0-2H3Zm-1 7a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Zm0 6a1 1 0 0 1 1-1h18a1 1 0 1 1 0 2H3a1 1 0 0 1-1-1Z',
-})

src/components/icons/Calendar.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const Calendar_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M8 2a1 1 0 0 1 1 1v1h6V3a1 1 0 1 1 2 0v1h2a2 2 0 0 1 2 2v13a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 1-1ZM5 6v3h14V6H5Zm14 5H5v8h14v-8Z',
-})

src/components/icons/Chevron.tsx

@@ -7,11 +7,3 @@ export const ChevronLeft_Stroke2_Corner0_Rounded = createSinglePathSVG({
 export const ChevronRight_Stroke2_Corner0_Rounded = createSinglePathSVG({
   path: 'M8.293 3.293a1 1 0 0 1 1.414 0l8 8a1 1 0 0 1 0 1.414l-8 8a1 1 0 0 1-1.414-1.414L15.586 12 8.293 4.707a1 1 0 0 1 0-1.414Z',
 })
-
-export const ChevronTop_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M12 6a1 1 0 0 1 .707.293l8 8a1 1 0 0 1-1.414 1.414L12 8.414l-7.293 7.293a1 1 0 0 1-1.414-1.414l8-8A1 1 0 0 1 12 6Z',
-})
-
-export const ChevronBottom_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M3.293 8.293a1 1 0 0 1 1.414 0L12 15.586l7.293-7.293a1 1 0 1 1 1.414 1.414l-8 8a1 1 0 0 1-1.414 0l-8-8a1 1 0 0 1 0-1.414Z',
-})

src/components/icons/CircleBanSign.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const CircleBanSign_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M12 4a8 8 0 0 0-6.32 12.906L16.906 5.68A7.962 7.962 0 0 0 12 4Zm6.32 3.094L7.094 18.32A8 8 0 0 0 18.32 7.094ZM2 12C2 6.477 6.477 2 12 2a9.972 9.972 0 0 1 7.071 2.929A9.972 9.972 0 0 1 22 12c0 5.523-4.477 10-10 10a9.972 9.972 0 0 1-7.071-2.929A9.972 9.972 0 0 1 2 12Z',
-})

src/components/icons/Envelope.tsx

@@ -1,5 +0,0 @@
-import {createSinglePathSVG} from './TEMPLATE'
-
-export const Envelope_Stroke2_Corner0_Rounded = createSinglePathSVG({
-  path: 'M4.568 4h14.864c.252 0 .498 0 .706.017.229.019.499.063.77.201a2 2 0 0 1 .874.874c.138.271.182.541.201.77.017.208.017.454.017.706v10.864c0 .252 0 .498-.017.706a2.022 2.022 0 0 1-.201.77 2 2 0 0 1-.874.874 2.022 2.022 0 0 1-.77.201c-.208.017-.454.017-.706.017H4.568c-.252 0-.498 0-.706-.017a2.022 2.022 0 0 1-.77-.201 2 2 0 0 1-.874-.874 2.022 2.022 0 0 1-.201-.77C2 17.93 2 17.684 2 17.432V6.568c0-.252 0-.498.017-.706.019-.229.063-.499.201-.77a2 2 0 0 1 .874-.874c.271-.138.541-.182.77-.201C4.07 4 4.316 4 4.568 4Zm.456 2L12 11.708 18.976 6H5.024ZM20 7.747l-6.733 5.509a2 2 0 0 1-2.534 0L4 7.746V17.4a8.187 8.187 0 0 0 .011.589h.014c.116.01.278.011.575.011h14.8a8.207 8.207 0 0 0 .589-.012v-.013c.01-.116.011-.279.011-.575V7.747Z',
-})