Merge pull request #1367 from linkwarden/dev

v2.12.0
2026-03-03 03:47:02 +00:00 · 2025-08-27 11:19:44 -04:00
parent 5f3bfa4bda 9ed374c4c3
commit cf71bb8a8a
154 changed files with 4050 additions and 6623 deletions
--- a/apps/mobile/.gitignore
+++ b/apps/mobile/.gitignore
@@ -36,4 +36,7 @@ yarn-error.*
 *.tsbuildinfo

 app-example
-.env
+.env
+
+ios/
+android/
--- a/apps/mobile/android/.gitignore
+++ b/apps/mobile/android/.gitignore
@@ -1,16 +0,0 @@
-# OSX
-#
-.DS_Store
-
-# Android/IntelliJ
-#
-build/
-.idea
-.gradle
-local.properties
-*.iml
-*.hprof
-.cxx/
-
-# Bundle artifacts
-*.jsbundle
--- a/apps/mobile/android/app/build.gradle
+++ b/apps/mobile/android/app/build.gradle
@@ -1,176 +0,0 @@
-apply plugin: "com.android.application"
-apply plugin: "org.jetbrains.kotlin.android"
-apply plugin: "com.facebook.react"
-
-def projectRoot = rootDir.getAbsoluteFile().getParentFile().getAbsolutePath()
-
-/**
- * This is the configuration block to customize your React Native Android app.
- * By default you don't need to apply any configuration, just uncomment the lines you need.
- */
-react {
-    entryFile = file(["node", "-e", "require('expo/scripts/resolveAppEntry')", projectRoot, "android", "absolute"].execute(null, rootDir).text.trim())
-    reactNativeDir = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
-    hermesCommand = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/sdks/hermesc/%OS-BIN%/hermesc"
-    codegenDir = new File(["node", "--print", "require.resolve('@react-native/codegen/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
-
-    // Use Expo CLI to bundle the app, this ensures the Metro config
-    // works correctly with Expo projects.
-    cliFile = new File(["node", "--print", "require.resolve('@expo/cli', { paths: [require.resolve('expo/package.json')] })"].execute(null, rootDir).text.trim())
-    bundleCommand = "export:embed"
-
-    /* Folders */
-     //   The root of your project, i.e. where "package.json" lives. Default is '../..'
-    // root = file("../../")
-    //   The folder where the react-native NPM package is. Default is ../../node_modules/react-native
-    // reactNativeDir = file("../../node_modules/react-native")
-    //   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen
-    // codegenDir = file("../../node_modules/@react-native/codegen")
-
-    /* Variants */
-    //   The list of variants to that are debuggable. For those we're going to
-    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.
-    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
-    // debuggableVariants = ["liteDebug", "prodDebug"]
-
-    /* Bundling */
-    //   A list containing the node command and its flags. Default is just 'node'.
-    // nodeExecutableAndArgs = ["node"]
-
-    //
-    //   The path to the CLI configuration file. Default is empty.
-    // bundleConfig = file(../rn-cli.config.js)
-    //
-    //   The name of the generated asset file containing your JS bundle
-    // bundleAssetName = "MyApplication.android.bundle"
-    //
-    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
-    // entryFile = file("../js/MyApplication.android.js")
-    //
-    //   A list of extra flags to pass to the 'bundle' commands.
-    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
-    // extraPackagerArgs = []
-
-    /* Hermes Commands */
-    //   The hermes compiler command to run. By default it is 'hermesc'
-    // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
-    //
-    //   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
-    // hermesFlags = ["-O", "-output-source-map"]
-
-    /* Autolinking */
-    autolinkLibrariesWithApp()
-}
-
-/**
- * Set this to true to Run Proguard on Release builds to minify the Java bytecode.
- */
-def enableProguardInReleaseBuilds = (findProperty('android.enableProguardInReleaseBuilds') ?: false).toBoolean()
-
-/**
- * The preferred build flavor of JavaScriptCore (JSC)
- *
- * For example, to use the international variant, you can use:
- * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
- *
- * The international variant includes ICU i18n library and necessary data
- * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
- * give correct results when using with locales other than en-US. Note that
- * this variant is about 6MiB larger per architecture than default.
- */
-def jscFlavor = 'org.webkit:android-jsc:+'
-
-android {
-    ndkVersion rootProject.ext.ndkVersion
-
-    buildToolsVersion rootProject.ext.buildToolsVersion
-    compileSdk rootProject.ext.compileSdkVersion
-
-    namespace 'com.anonymous.mobileapp'
-    defaultConfig {
-        applicationId 'com.anonymous.mobileapp'
-        minSdkVersion rootProject.ext.minSdkVersion
-        targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 1
-        versionName "1.0.0"
-    }
-    signingConfigs {
-        debug {
-            storeFile file('debug.keystore')
-            storePassword 'android'
-            keyAlias 'androiddebugkey'
-            keyPassword 'android'
-        }
-    }
-    buildTypes {
-        debug {
-            signingConfig signingConfigs.debug
-        }
-        release {
-            // Caution! In production, you need to generate your own keystore file.
-            // see https://reactnative.dev/docs/signed-apk-android.
-            signingConfig signingConfigs.debug
-            shrinkResources (findProperty('android.enableShrinkResourcesInReleaseBuilds')?.toBoolean() ?: false)
-            minifyEnabled enableProguardInReleaseBuilds
-            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
-            crunchPngs (findProperty('android.enablePngCrunchInReleaseBuilds')?.toBoolean() ?: true)
-        }
-    }
-    packagingOptions {
-        jniLibs {
-            useLegacyPackaging (findProperty('expo.useLegacyPackaging')?.toBoolean() ?: false)
-        }
-    }
-    androidResources {
-        ignoreAssetsPattern '!.svn:!.git:!.ds_store:!*.scc:!CVS:!thumbs.db:!picasa.ini:!*~'
-    }
-}
-
-// Apply static values from `gradle.properties` to the `android.packagingOptions`
-// Accepts values in comma delimited lists, example:
-// android.packagingOptions.pickFirsts=/LICENSE,**/picasa.ini
-["pickFirsts", "excludes", "merges", "doNotStrip"].each { prop ->
-    // Split option: 'foo,bar' -> ['foo', 'bar']
-    def options = (findProperty("android.packagingOptions.$prop") ?: "").split(",");
-    // Trim all elements in place.
-    for (i in 0..<options.size()) options[i] = options[i].trim();
-    // `[] - ""` is essentially `[""].filter(Boolean)` removing all empty strings.
-    options -= ""
-
-    if (options.length > 0) {
-        println "android.packagingOptions.$prop += $options ($options.length)"
-        // Ex: android.packagingOptions.pickFirsts += '**/SCCS/**'
-        options.each {
-            android.packagingOptions[prop] += it
-        }
-    }
-}
-
-dependencies {
-    // The version of react-native is set by the React Native Gradle Plugin
-    implementation("com.facebook.react:react-android")
-
-    def isGifEnabled = (findProperty('expo.gif.enabled') ?: "") == "true";
-    def isWebpEnabled = (findProperty('expo.webp.enabled') ?: "") == "true";
-    def isWebpAnimatedEnabled = (findProperty('expo.webp.animated') ?: "") == "true";
-
-    if (isGifEnabled) {
-        // For animated gif support
-        implementation("com.facebook.fresco:animated-gif:${reactAndroidLibs.versions.fresco.get()}")
-    }
-
-    if (isWebpEnabled) {
-        // For webp support
-        implementation("com.facebook.fresco:webpsupport:${reactAndroidLibs.versions.fresco.get()}")
-        if (isWebpAnimatedEnabled) {
-            // Animated webp support
-            implementation("com.facebook.fresco:animated-webp:${reactAndroidLibs.versions.fresco.get()}")
-        }
-    }
-
-    if (hermesEnabled.toBoolean()) {
-        implementation("com.facebook.react:hermes-android")
-    } else {
-        implementation jscFlavor
-    }
-}
--- a/apps/mobile/android/app/debug.keystore
+++ b/apps/mobile/android/app/debug.keystore
--- a/apps/mobile/android/app/proguard-rules.pro
+++ b/apps/mobile/android/app/proguard-rules.pro
@@ -1,14 +0,0 @@
-# Add project specific ProGuard rules here.
-# By default, the flags in this file are appended to flags specified
-# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
-# You can edit the include path and order by changing the proguardFiles
-# directive in build.gradle.
-#
-# For more details, see
-#   http://developer.android.com/guide/developing/tools/proguard.html
-
-# react-native-reanimated
-keep class com.swmansion.reanimated.** { *; }
-keep class com.facebook.react.turbomodule.** { *; }
-
-# Add any project specific keep options here:
--- a/apps/mobile/android/app/src/debug/AndroidManifest.xml
+++ b/apps/mobile/android/app/src/debug/AndroidManifest.xml
@@ -1,7 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android"
-    xmlns:tools="http://schemas.android.com/tools">
-
-    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
-
-    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" tools:replace="android:usesCleartextTraffic" />
-</manifest>
--- a/apps/mobile/android/app/src/main/AndroidManifest.xml
+++ b/apps/mobile/android/app/src/main/AndroidManifest.xml
@@ -1,33 +0,0 @@
-<manifest xmlns:android="http://schemas.android.com/apk/res/android">
-  <uses-permission android:name="android.permission.INTERNET"/>
-  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
-  <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
-  <uses-permission android:name="android.permission.VIBRATE"/>
-  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
-  <queries>
-    <intent>
-      <action android:name="android.intent.action.VIEW"/>
-      <category android:name="android.intent.category.BROWSABLE"/>
-      <data android:scheme="https"/>
-    </intent>
-  </queries>
-  <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true" android:fullBackupContent="@xml/secure_store_backup_rules" android:dataExtractionRules="@xml/secure_store_data_extraction_rules">
-    <meta-data android:name="expo.modules.updates.ENABLED" android:value="false"/>
-    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH" android:value="ALWAYS"/>
-    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS" android:value="0"/>
-    <activity android:name=".MainActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout|uiMode" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:exported="true" android:screenOrientation="portrait">
-      <intent-filter>
-        <action android:name="android.intent.action.MAIN"/>
-        <category android:name="android.intent.category.LAUNCHER"/>
-      </intent-filter>
-      <intent-filter>
-        <action android:name="android.intent.action.VIEW"/>
-        <category android:name="android.intent.category.DEFAULT"/>
-        <category android:name="android.intent.category.BROWSABLE"/>
-        <data android:scheme="myapp"/>
-        <data android:scheme="com.anonymous.mobileapp"/>
-        <data android:scheme="exp+mobile-app"/>
-      </intent-filter>
-    </activity>
-  </application>
-</manifest>
--- a/apps/mobile/android/app/src/main/java/com/anonymous/mobileapp/MainActivity.kt
+++ b/apps/mobile/android/app/src/main/java/com/anonymous/mobileapp/MainActivity.kt
@@ -1,65 +0,0 @@
-package com.anonymous.mobileapp
-import expo.modules.splashscreen.SplashScreenManager
-
-import android.os.Build
-import android.os.Bundle
-
-import com.facebook.react.ReactActivity
-import com.facebook.react.ReactActivityDelegate
-import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled
-import com.facebook.react.defaults.DefaultReactActivityDelegate
-
-import expo.modules.ReactActivityDelegateWrapper
-
-class MainActivity : ReactActivity() {
-  override fun onCreate(savedInstanceState: Bundle?) {
-    // Set the theme to AppTheme BEFORE onCreate to support
-    // coloring the background, status bar, and navigation bar.
-    // This is required for expo-splash-screen.
-    // setTheme(R.style.AppTheme);
-    // @generated begin expo-splashscreen - expo prebuild (DO NOT MODIFY) sync-f3ff59a738c56c9a6119210cb55f0b613eb8b6af
-    SplashScreenManager.registerOnActivity(this)
-    // @generated end expo-splashscreen
-    super.onCreate(null)
-  }
-
-  /**
-   * Returns the name of the main component registered from JavaScript. This is used to schedule
-   * rendering of the component.
-   */
-  override fun getMainComponentName(): String = "main"
-
-  /**
-   * Returns the instance of the [ReactActivityDelegate]. We use [DefaultReactActivityDelegate]
-   * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]
-   */
-  override fun createReactActivityDelegate(): ReactActivityDelegate {
-    return ReactActivityDelegateWrapper(
-          this,
-          BuildConfig.IS_NEW_ARCHITECTURE_ENABLED,
-          object : DefaultReactActivityDelegate(
-              this,
-              mainComponentName,
-              fabricEnabled
-          ){})
-  }
-
-  /**
-    * Align the back button behavior with Android S
-    * where moving root activities to background instead of finishing activities.
-    * @see <a href="https://developer.android.com/reference/android/app/Activity#onBackPressed()">onBackPressed</a>
-    */
-  override fun invokeDefaultOnBackPressed() {
-      if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.R) {
-          if (!moveTaskToBack(false)) {
-              // For non-root activities, use the default implementation to finish them.
-              super.invokeDefaultOnBackPressed()
-          }
-          return
-      }
-
-      // Use the default back button implementation on Android S
-      // because it's doing more than [Activity.moveTaskToBack] in fact.
-      super.invokeDefaultOnBackPressed()
-  }
-}
--- a/apps/mobile/android/app/src/main/java/com/anonymous/mobileapp/MainApplication.kt
+++ b/apps/mobile/android/app/src/main/java/com/anonymous/mobileapp/MainApplication.kt
@@ -1,57 +0,0 @@
-package com.anonymous.mobileapp
-
-import android.app.Application
-import android.content.res.Configuration
-
-import com.facebook.react.PackageList
-import com.facebook.react.ReactApplication
-import com.facebook.react.ReactNativeHost
-import com.facebook.react.ReactPackage
-import com.facebook.react.ReactHost
-import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load
-import com.facebook.react.defaults.DefaultReactNativeHost
-import com.facebook.react.soloader.OpenSourceMergedSoMapping
-import com.facebook.soloader.SoLoader
-
-import expo.modules.ApplicationLifecycleDispatcher
-import expo.modules.ReactNativeHostWrapper
-
-class MainApplication : Application(), ReactApplication {
-
-  override val reactNativeHost: ReactNativeHost = ReactNativeHostWrapper(
-        this,
-        object : DefaultReactNativeHost(this) {
-          override fun getPackages(): List<ReactPackage> {
-            val packages = PackageList(this).packages
-            // Packages that cannot be autolinked yet can be added manually here, for example:
-            // packages.add(new MyReactNativePackage());
-            return packages
-          }
-
-          override fun getJSMainModuleName(): String = ".expo/.virtual-metro-entry"
-
-          override fun getUseDeveloperSupport(): Boolean = BuildConfig.DEBUG
-
-          override val isNewArchEnabled: Boolean = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED
-          override val isHermesEnabled: Boolean = BuildConfig.IS_HERMES_ENABLED
-      }
-  )
-
-  override val reactHost: ReactHost
-    get() = ReactNativeHostWrapper.createReactHost(applicationContext, reactNativeHost)
-
-  override fun onCreate() {
-    super.onCreate()
-    SoLoader.init(this, OpenSourceMergedSoMapping)
-    if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-      // If you opted-in for the New Architecture, we load the native entry point for this app.
-      load()
-    }
-    ApplicationLifecycleDispatcher.onApplicationCreate(this)
-  }
-
-  override fun onConfigurationChanged(newConfig: Configuration) {
-    super.onConfigurationChanged(newConfig)
-    ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
-  }
-}
--- a/apps/mobile/android/app/src/main/res/drawable-hdpi/splashscreen_logo.png
+++ b/apps/mobile/android/app/src/main/res/drawable-hdpi/splashscreen_logo.png
--- a/apps/mobile/android/app/src/main/res/drawable-mdpi/splashscreen_logo.png
+++ b/apps/mobile/android/app/src/main/res/drawable-mdpi/splashscreen_logo.png
--- a/apps/mobile/android/app/src/main/res/drawable-xhdpi/splashscreen_logo.png
+++ b/apps/mobile/android/app/src/main/res/drawable-xhdpi/splashscreen_logo.png
--- a/apps/mobile/android/app/src/main/res/drawable-xxhdpi/splashscreen_logo.png
+++ b/apps/mobile/android/app/src/main/res/drawable-xxhdpi/splashscreen_logo.png
--- a/apps/mobile/android/app/src/main/res/drawable-xxxhdpi/splashscreen_logo.png
+++ b/apps/mobile/android/app/src/main/res/drawable-xxxhdpi/splashscreen_logo.png
--- a/apps/mobile/android/app/src/main/res/drawable/ic_launcher_background.xml
+++ b/apps/mobile/android/app/src/main/res/drawable/ic_launcher_background.xml
@@ -1,6 +0,0 @@
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
-  <item android:drawable="@color/splashscreen_background"/>
-  <item>
-    <bitmap android:gravity="center" android:src="@drawable/splashscreen_logo"/>
-  </item>
-</layer-list>
--- a/apps/mobile/android/app/src/main/res/drawable/rn_edit_text_material.xml
+++ b/apps/mobile/android/app/src/main/res/drawable/rn_edit_text_material.xml
@@ -1,37 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Copyright (C) 2014 The Android Open Source Project
-
-     Licensed under the Apache License, Version 2.0 (the "License");
-     you may not use this file except in compliance with the License.
-     You may obtain a copy of the License at
-
-          http://www.apache.org/licenses/LICENSE-2.0
-
-     Unless required by applicable law or agreed to in writing, software
-     distributed under the License is distributed on an "AS IS" BASIS,
-     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-     See the License for the specific language governing permissions and
-     limitations under the License.
-->
-<inset xmlns:android="http://schemas.android.com/apk/res/android"
-       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
-       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
-       android:insetTop="@dimen/abc_edit_text_inset_top_material"
-       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material"
-       >
-
-    <selector>
-        <!--
-          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
-          The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
-          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'
-
-          <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
-
-          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.
-        -->
-        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
-        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
-    </selector>
-
-</inset>
--- a/apps/mobile/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
+++ b/apps/mobile/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
-    <background android:drawable="@color/iconBackground"/>
-    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
-</adaptive-icon>
--- a/apps/mobile/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
+++ b/apps/mobile/android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
-    <background android:drawable="@color/iconBackground"/>
-    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
-</adaptive-icon>
--- a/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher_foreground.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher_foreground.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher_foreground.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_foreground.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_foreground.webp
--- a/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp
+++ b/apps/mobile/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp
--- a/apps/mobile/android/app/src/main/res/values-night/colors.xml
+++ b/apps/mobile/android/app/src/main/res/values-night/colors.xml
@@ -1 +0,0 @@
-<resources/>
--- a/apps/mobile/android/app/src/main/res/values/colors.xml
+++ b/apps/mobile/android/app/src/main/res/values/colors.xml
@@ -1,6 +0,0 @@
-<resources>
-  <color name="splashscreen_background">#ffffff</color>
-  <color name="iconBackground">#ffffff</color>
-  <color name="colorPrimary">#023c69</color>
-  <color name="colorPrimaryDark">#ffffff</color>
-</resources>
--- a/apps/mobile/android/app/src/main/res/values/strings.xml
+++ b/apps/mobile/android/app/src/main/res/values/strings.xml
@@ -1,6 +0,0 @@
-<resources>
-  <string name="app_name">mobile-app</string>
-  <string name="expo_system_ui_user_interface_style" translatable="false">automatic</string>
-  <string name="expo_splash_screen_resize_mode" translatable="false">contain</string>
-  <string name="expo_splash_screen_status_bar_translucent" translatable="false">false</string>
-</resources>
--- a/apps/mobile/android/app/src/main/res/values/styles.xml
+++ b/apps/mobile/android/app/src/main/res/values/styles.xml
@@ -1,19 +0,0 @@
-<resources xmlns:tools="http://schemas.android.com/tools">
-  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
-    <item name="android:textColor">@android:color/black</item>
-    <item name="android:editTextStyle">@style/ResetEditText</item>
-    <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
-    <item name="colorPrimary">@color/colorPrimary</item>
-    <item name="android:statusBarColor">#ffffff</item>
-  </style>
-  <style name="ResetEditText" parent="@android:style/Widget.EditText">
-    <item name="android:padding">0dp</item>
-    <item name="android:textColorHint">#c8c8c8</item>
-    <item name="android:textColor">@android:color/black</item>
-  </style>
-  <style name="Theme.App.SplashScreen" parent="Theme.SplashScreen">
-    <item name="windowSplashScreenBackground">@color/splashscreen_background</item>
-    <item name="windowSplashScreenAnimatedIcon">@drawable/splashscreen_logo</item>
-    <item name="postSplashScreenTheme">@style/AppTheme</item>
-  </style>
-</resources>
--- a/apps/mobile/android/build.gradle
+++ b/apps/mobile/android/build.gradle
@@ -1,41 +0,0 @@
-// Top-level build file where you can add configuration options common to all sub-projects/modules.
-
-buildscript {
-    ext {
-        buildToolsVersion = findProperty('android.buildToolsVersion') ?: '35.0.0'
-        minSdkVersion = Integer.parseInt(findProperty('android.minSdkVersion') ?: '24')
-        compileSdkVersion = Integer.parseInt(findProperty('android.compileSdkVersion') ?: '35')
-        targetSdkVersion = Integer.parseInt(findProperty('android.targetSdkVersion') ?: '34')
-        kotlinVersion = findProperty('android.kotlinVersion') ?: '1.9.25'
-
-        ndkVersion = "26.1.10909125"
-    }
-    repositories {
-        google()
-        mavenCentral()
-    }
-    dependencies {
-        classpath('com.android.tools.build:gradle')
-        classpath('com.facebook.react:react-native-gradle-plugin')
-        classpath('org.jetbrains.kotlin:kotlin-gradle-plugin')
-    }
-}
-
-apply plugin: "com.facebook.react.rootproject"
-
-allprojects {
-    repositories {
-        maven {
-            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
-            url(new File(['node', '--print', "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), '../android'))
-        }
-        maven {
-            // Android JSC is installed from npm
-            url(new File(['node', '--print', "require.resolve('jsc-android/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim(), '../dist'))
-        }
-
-        google()
-        mavenCentral()
-        maven { url 'https://www.jitpack.io' }
-    }
-}
--- a/apps/mobile/android/gradle.properties
+++ b/apps/mobile/android/gradle.properties
@@ -1,56 +0,0 @@
-# Project-wide Gradle settings.
-
-# IDE (e.g. Android Studio) users:
-# Gradle settings configured through the IDE *will override*
-# any settings specified in this file.
-
-# For more details on how to configure your build environment visit
-# http://www.gradle.org/docs/current/userguide/build_environment.html
-
-# Specifies the JVM arguments used for the daemon process.
-# The setting is particularly useful for tweaking memory settings.
-# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
-org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
-
-# When configured, Gradle will run in incubating parallel mode.
-# This option should only be used with decoupled projects. More details, visit
-# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
-# org.gradle.parallel=true
-
-# AndroidX package structure to make it clearer which packages are bundled with the
-# Android operating system, and which are packaged with your app's APK
-# https://developer.android.com/topic/libraries/support-library/androidx-rn
-android.useAndroidX=true
-
-# Enable AAPT2 PNG crunching
-android.enablePngCrunchInReleaseBuilds=true
-
-# Use this property to specify which architecture you want to build.
-# You can also override it from the CLI using
-# ./gradlew <task> -PreactNativeArchitectures=x86_64
-reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
-
-# Use this property to enable support to the new architecture.
-# This will allow you to use TurboModules and the Fabric render in
-# your application. You should enable this flag either if you want
-# to write custom TurboModules/Fabric components OR use libraries that
-# are providing them.
-newArchEnabled=true
-
-# Use this property to enable or disable the Hermes JS engine.
-# If set to false, you will be using JSC instead.
-hermesEnabled=true
-
-# Enable GIF support in React Native images (~200 B increase)
-expo.gif.enabled=true
-# Enable webp support in React Native images (~85 KB increase)
-expo.webp.enabled=true
-# Enable animated webp support (~3.4 MB increase)
-# Disabled by default because iOS doesn't support animated webp
-expo.webp.animated=false
-
-# Enable network inspector
-EX_DEV_CLIENT_NETWORK_INSPECTOR=true
-
-# Use legacy packaging to compress native libraries in the resulting APK.
-expo.useLegacyPackaging=false
--- a/apps/mobile/android/gradle/wrapper/gradle-wrapper.jar
+++ b/apps/mobile/android/gradle/wrapper/gradle-wrapper.jar
--- a/apps/mobile/android/gradle/wrapper/gradle-wrapper.properties
+++ b/apps/mobile/android/gradle/wrapper/gradle-wrapper.properties
@@ -1,7 +0,0 @@
-distributionBase=GRADLE_USER_HOME
-distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.10.2-all.zip
-networkTimeout=10000
-validateDistributionUrl=true
-zipStoreBase=GRADLE_USER_HOME
-zipStorePath=wrapper/dists
--- a/apps/mobile/android/gradlew
+++ b/apps/mobile/android/gradlew
@@ -1,252 +0,0 @@
-#!/bin/sh
-
-#
-# Copyright © 2015-2021 the original authors.
-#
-# Licensed under the Apache License, Version 2.0 (the "License");
-# you may not use this file except in compliance with the License.
-# You may obtain a copy of the License at
-#
-#      https://www.apache.org/licenses/LICENSE-2.0
-#
-# Unless required by applicable law or agreed to in writing, software
-# distributed under the License is distributed on an "AS IS" BASIS,
-# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-# See the License for the specific language governing permissions and
-# limitations under the License.
-#
-# SPDX-License-Identifier: Apache-2.0
-#
-
-##############################################################################
-#
-#   Gradle start up script for POSIX generated by Gradle.
-#
-#   Important for running:
-#
-#   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
-#       noncompliant, but you have some other compliant shell such as ksh or
-#       bash, then to run this script, type that shell name before the whole
-#       command line, like:
-#
-#           ksh Gradle
-#
-#       Busybox and similar reduced shells will NOT work, because this script
-#       requires all of these POSIX shell features:
-#         * functions;
-#         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
-#           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
-#         * compound commands having a testable exit status, especially «case»;
-#         * various built-in commands including «command», «set», and «ulimit».
-#
-#   Important for patching:
-#
-#   (2) This script targets any POSIX shell, so it avoids extensions provided
-#       by Bash, Ksh, etc; in particular arrays are avoided.
-#
-#       The "traditional" practice of packing multiple parameters into a
-#       space-separated string is a well documented source of bugs and security
-#       problems, so this is (mostly) avoided, by progressively accumulating
-#       options in "$@", and eventually passing that to Java.
-#
-#       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
-#       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
-#       see the in-line comments for details.
-#
-#       There are tweaks for specific operating systems such as AIX, CygWin,
-#       Darwin, MinGW, and NonStop.
-#
-#   (3) This script is generated from the Groovy template
-#       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
-#       within the Gradle project.
-#
-#       You can find Gradle at https://github.com/gradle/gradle/.
-#
-##############################################################################
-
-# Attempt to set APP_HOME
-
-# Resolve links: $0 may be a link
-app_path=$0
-
-# Need this for daisy-chained symlinks.
-while
-    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
-    [ -h "$app_path" ]
-do
-    ls=$( ls -ld "$app_path" )
-    link=${ls#*' -> '}
-    case $link in             #(
-      /*)   app_path=$link ;; #(
-      *)    app_path=$APP_HOME$link ;;
-    esac
-done
-
-# This is normally unused
-# shellcheck disable=SC2034
-APP_BASE_NAME=${0##*/}
-# Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
-APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
-' "$PWD" ) || exit
-
-# Use the maximum available, or set MAX_FD != -1 to use that value.
-MAX_FD=maximum
-
-warn () {
-    echo "$*"
-} >&2
-
-die () {
-    echo
-    echo "$*"
-    echo
-    exit 1
-} >&2
-
-# OS specific support (must be 'true' or 'false').
-cygwin=false
-msys=false
-darwin=false
-nonstop=false
-case "$( uname )" in                #(
-  CYGWIN* )         cygwin=true  ;; #(
-  Darwin* )         darwin=true  ;; #(
-  MSYS* | MINGW* )  msys=true    ;; #(
-  NONSTOP* )        nonstop=true ;;
-esac
-
-CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
-
-
-# Determine the Java command to use to start the JVM.
-if [ -n "$JAVA_HOME" ] ; then
-    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
-        # IBM's JDK on AIX uses strange locations for the executables
-        JAVACMD=$JAVA_HOME/jre/sh/java
-    else
-        JAVACMD=$JAVA_HOME/bin/java
-    fi
-    if [ ! -x "$JAVACMD" ] ; then
-        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
-
-Please set the JAVA_HOME variable in your environment to match the
-location of your Java installation."
-    fi
-else
-    JAVACMD=java
-    if ! command -v java >/dev/null 2>&1
-    then
-        die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
-
-Please set the JAVA_HOME variable in your environment to match the
-location of your Java installation."
-    fi
-fi
-
-# Increase the maximum file descriptors if we can.
-if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
-    case $MAX_FD in #(
-      max*)
-        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
-        # shellcheck disable=SC2039,SC3045
-        MAX_FD=$( ulimit -H -n ) ||
-            warn "Could not query maximum file descriptor limit"
-    esac
-    case $MAX_FD in  #(
-      '' | soft) :;; #(
-      *)
-        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
-        # shellcheck disable=SC2039,SC3045
-        ulimit -n "$MAX_FD" ||
-            warn "Could not set maximum file descriptor limit to $MAX_FD"
-    esac
-fi
-
-# Collect all arguments for the java command, stacking in reverse order:
-#   * args from the command line
-#   * the main class name
-#   * -classpath
-#   * -D...appname settings
-#   * --module-path (only if needed)
-#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
-
-# For Cygwin or MSYS, switch paths to Windows format before running java
-if "$cygwin" || "$msys" ; then
-    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
-    CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" )
-
-    JAVACMD=$( cygpath --unix "$JAVACMD" )
-
-    # Now convert the arguments - kludge to limit ourselves to /bin/sh
-    for arg do
-        if
-            case $arg in                                #(
-              -*)   false ;;                            # don't mess with options #(
-              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
-                    [ -e "$t" ] ;;                      #(
-              *)    false ;;
-            esac
-        then
-            arg=$( cygpath --path --ignore --mixed "$arg" )
-        fi
-        # Roll the args list around exactly as many times as the number of
-        # args, so each arg winds up back in the position where it started, but
-        # possibly modified.
-        #
-        # NB: a `for` loop captures its iteration list before it begins, so
-        # changing the positional parameters here affects neither the number of
-        # iterations, nor the values presented in `arg`.
-        shift                   # remove old arg
-        set -- "$@" "$arg"      # push replacement arg
-    done
-fi
-
-
-# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
-
-# Collect all arguments for the java command:
-#   * DEFAULT_JVM_OPTS, JAVA_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
-#     and any embedded shellness will be escaped.
-#   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
-#     treated as '${Hostname}' itself on the command line.
-
-set -- \
-        "-Dorg.gradle.appname=$APP_BASE_NAME" \
-        -classpath "$CLASSPATH" \
-        org.gradle.wrapper.GradleWrapperMain \
-        "$@"
-
-# Stop when "xargs" is not available.
-if ! command -v xargs >/dev/null 2>&1
-then
-    die "xargs is not available"
-fi
-
-# Use "xargs" to parse quoted args.
-#
-# With -n1 it outputs one arg per line, with the quotes and backslashes removed.
-#
-# In Bash we could simply go:
-#
-#   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
-#   set -- "${ARGS[@]}" "$@"
-#
-# but POSIX shell has neither arrays nor command substitution, so instead we
-# post-process each arg (as a line of input to sed) to backslash-escape any
-# character that might be a shell metacharacter, then use eval to reverse
-# that process (while maintaining the separation between arguments), and wrap
-# the whole thing up as a single "set" statement.
-#
-# This will of course break if any of these variables contains a newline or
-# an unmatched quote.
-#
-
-eval "set -- $(
-        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
-        xargs -n1 |
-        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
-        tr '\n' ' '
-    )" '"$@"'
-
-exec "$JAVACMD" "$@"
--- a/apps/mobile/android/gradlew.bat
+++ b/apps/mobile/android/gradlew.bat
@@ -1,94 +0,0 @@
-@rem
-@rem Copyright 2015 the original author or authors.
-@rem
-@rem Licensed under the Apache License, Version 2.0 (the "License");
-@rem you may not use this file except in compliance with the License.
-@rem You may obtain a copy of the License at
-@rem
-@rem      https://www.apache.org/licenses/LICENSE-2.0
-@rem
-@rem Unless required by applicable law or agreed to in writing, software
-@rem distributed under the License is distributed on an "AS IS" BASIS,
-@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-@rem See the License for the specific language governing permissions and
-@rem limitations under the License.
-@rem
-@rem SPDX-License-Identifier: Apache-2.0
-@rem
-
-@if "%DEBUG%"=="" @echo off
-@rem ##########################################################################
-@rem
-@rem  Gradle startup script for Windows
-@rem
-@rem ##########################################################################
-
-@rem Set local scope for the variables with windows NT shell
-if "%OS%"=="Windows_NT" setlocal
-
-set DIRNAME=%~dp0
-if "%DIRNAME%"=="" set DIRNAME=.
-@rem This is normally unused
-set APP_BASE_NAME=%~n0
-set APP_HOME=%DIRNAME%
-
-@rem Resolve any "." and ".." in APP_HOME to make it shorter.
-for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
-
-@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
-set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
-
-@rem Find java.exe
-if defined JAVA_HOME goto findJavaFromJavaHome
-
-set JAVA_EXE=java.exe
-%JAVA_EXE% -version >NUL 2>&1
-if %ERRORLEVEL% equ 0 goto execute
-
-echo. 1>&2
-echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
-echo. 1>&2
-echo Please set the JAVA_HOME variable in your environment to match the 1>&2
-echo location of your Java installation. 1>&2
-
-goto fail
-
-:findJavaFromJavaHome
-set JAVA_HOME=%JAVA_HOME:"=%
-set JAVA_EXE=%JAVA_HOME%/bin/java.exe
-
-if exist "%JAVA_EXE%" goto execute
-
-echo. 1>&2
-echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
-echo. 1>&2
-echo Please set the JAVA_HOME variable in your environment to match the 1>&2
-echo location of your Java installation. 1>&2
-
-goto fail
-
-:execute
-@rem Setup the command line
-
-set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
-
-
-@rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
-
-:end
-@rem End local scope for the variables with windows NT shell
-if %ERRORLEVEL% equ 0 goto mainEnd
-
-:fail
-rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
-rem the _cmd.exe /c_ return code!
-set EXIT_CODE=%ERRORLEVEL%
-if %EXIT_CODE% equ 0 set EXIT_CODE=1
-if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
-exit /b %EXIT_CODE%
-
-:mainEnd
-if "%OS%"=="Windows_NT" endlocal
-
-:omega
--- a/apps/mobile/android/settings.gradle
+++ b/apps/mobile/android/settings.gradle
@@ -1,38 +0,0 @@
-pluginManagement {
-    includeBuild(new File(["node", "--print", "require.resolve('@react-native/gradle-plugin/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().toString())
-}
-plugins { id("com.facebook.react.settings") }
-
-extensions.configure(com.facebook.react.ReactSettingsExtension) { ex ->
-  if (System.getenv('EXPO_USE_COMMUNITY_AUTOLINKING') == '1') {
-    ex.autolinkLibrariesFromCommand()
-  } else {
-    def command = [
-      'node',
-      '--no-warnings',
-      '--eval',
-      'require(require.resolve(\'expo-modules-autolinking\', { paths: [require.resolve(\'expo/package.json\')] }))(process.argv.slice(1))',
-      'react-native-config',
-      '--json',
-      '--platform',
-      'android'
-    ].toList()
-    ex.autolinkLibrariesFromCommand(command)
-  }
-}
-
-rootProject.name = 'mobile-app'
-
-dependencyResolutionManagement {
-  versionCatalogs {
-    reactAndroidLibs {
-      from(files(new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim(), "../gradle/libs.versions.toml")))
-    }
-  }
-}
-
-apply from: new File(["node", "--print", "require.resolve('expo/package.json')"].execute(null, rootDir).text.trim(), "../scripts/autolinking.gradle");
-useExpoModules()
-
-include ':app'
-includeBuild(new File(["node", "--print", "require.resolve('@react-native/gradle-plugin/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile())
--- a/apps/mobile/app.json
+++ b/apps/mobile/app.json
@@ -1,23 +1,23 @@
 {
  "expo": {
-    "name": "mobile-app",
-    "slug": "mobile-app",
+    "name": "Linkwarden",
+    "slug": "linkwarden",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/images/icon.png",
-    "scheme": "myapp",
+    "scheme": "linkwarden",
    "userInterfaceStyle": "automatic",
    "newArchEnabled": true,
    "ios": {
      "supportsTablet": true,
-      "bundleIdentifier": "com.anonymous.mobile-app"
+      "bundleIdentifier": "com.anonymous.linkwarden"
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/images/adaptive-icon.png",
        "backgroundColor": "#ffffff"
      },
-      "package": "com.anonymous.mobileapp"
+      "package": "com.anonymous.linkwarden"
    },
    "web": {
      "bundler": "metro",
@@ -35,10 +35,21 @@
          "backgroundColor": "#ffffff"
        }
      ],
-      "expo-secure-store"
+      "expo-secure-store",
+      "expo-share-intent",
+      "./plugins/with-daynight-transparent-nav"
    ],
    "experiments": {
      "typedRoutes": true
+    },
+    "androidStatusBar": {
+      "backgroundColor": "#ffffff",
+      "barStyle": "dark-content",
+      "translucent": false
+    },
+    "androidNavigationBar": {
+      "backgroundColor": "#ffffff",
+      "barStyle": "dark-content"
    }
  }
 }
--- a/apps/mobile/app/(tabs)/_layout.tsx
+++ b/apps/mobile/app/(tabs)/_layout.tsx
@@ -1,26 +1,34 @@
 import { Tabs } from "expo-router";
 import React from "react";
-import { Platform, TouchableOpacity, useColorScheme } from "react-native";
+import { Platform } from "react-native";
 import HapticTab from "@/components/HapticTab";
-import { IconSymbol } from "@/components/ui/IconSymbol";
-// import "react-native-reanimated";
 import TabBarBackground from "@/components/ui/TabBarBackground";
+import { useColorScheme } from "nativewind";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { House, Link, Settings } from "lucide-react-native";

 export default function TabLayout() {
-  const colorScheme = useColorScheme();
+  const { colorScheme } = useColorScheme();

  return (
    <Tabs
      screenOptions={{
        tabBarBackground: TabBarBackground,
-        tabBarActiveTintColor: colorScheme === "dark" ? "white" : "black",
+        tabBarActiveTintColor: rawTheme[colorScheme as ThemeName].primary,
+        tabBarInactiveTintColor: rawTheme[colorScheme as ThemeName].neutral,
        tabBarButton: HapticTab,
-        // headerShown: false,
        tabBarStyle: Platform.select({
          ios: {
            position: "absolute",
+            borderTopWidth: 0,
+            elevation: 0,
+            backgroundColor: rawTheme[colorScheme as ThemeName]["base-200"],
+          },
+          default: {
+            borderTopWidth: 0,
+            backgroundColor: rawTheme[colorScheme as ThemeName]["base-200"],
+            elevation: 0,
          },
-          default: {},
        }),
      }}
    >
@@ -29,9 +37,7 @@ export default function TabLayout() {
        options={{
          title: "Dashboard",
          headerShown: false,
-          tabBarIcon: ({ color }) => (
-            <IconSymbol size={28} name="house.fill" color={color} />
-          ),
+          tabBarIcon: ({ color }) => <House size={26} color={color} />,
        }}
      />
      <Tabs.Screen
@@ -39,9 +45,7 @@ export default function TabLayout() {
        options={{
          title: "Links",
          headerShown: false,
-          tabBarIcon: ({ color }) => (
-            <IconSymbol size={28} name="link" color={color} />
-          ),
+          tabBarIcon: ({ color }) => <Link size={26} color={color} />,
        }}
      />
      <Tabs.Screen
@@ -49,9 +53,7 @@ export default function TabLayout() {
        options={{
          title: "Settings",
          headerShown: false,
-          tabBarIcon: ({ color }) => (
-            <IconSymbol size={28} name="gearshape.fill" color={color} />
-          ),
+          tabBarIcon: ({ color }) => <Settings size={26} color={color} />,
        }}
      />
    </Tabs>
--- a/apps/mobile/app/(tabs)/dashboard/[section].tsx
+++ b/apps/mobile/app/(tabs)/dashboard/[section].tsx
@@ -49,7 +49,12 @@ export default function LinksScreen() {
  );

  return (
-    <View style={styles.container} className="h-full">
+    <View
+      style={styles.container}
+      className="h-full bg-base-100"
+      collapsable={false}
+      collapsableChildren={false}
+    >
      <FlatList
        contentInsetAdjustmentBehavior="automatic"
        ListHeaderComponent={() => <></>}
@@ -63,9 +68,7 @@ export default function LinksScreen() {
        )}
        onEndReached={() => data.fetchNextPage()}
        onEndReachedThreshold={0.5}
-        ItemSeparatorComponent={() => (
-          <View className="bg-[#eee] h-[1px] w-[100px]" />
-        )}
+        ItemSeparatorComponent={() => <View className="bg-base-200 h-px" />}
      />
    </View>
  );
--- a/apps/mobile/app/(tabs)/dashboard/_layout.tsx
+++ b/apps/mobile/app/(tabs)/dashboard/_layout.tsx
@@ -1,32 +1,49 @@
-import { IconSymbol } from "@/components/ui/IconSymbol";
+import { rawTheme, ThemeName } from "@/lib/colors";
 import { Stack, useRouter } from "expo-router";
-import { TouchableOpacity } from "react-native";
+import { Plus } from "lucide-react-native";
+import { useColorScheme } from "nativewind";
+import { Platform, TouchableOpacity } from "react-native";
 import { SheetManager } from "react-native-actions-sheet";
 import * as DropdownMenu from "zeego/dropdown-menu";

 export default function RootLayout() {
  const router = useRouter();
+  const { colorScheme } = useColorScheme();

  return (
    <Stack
      screenOptions={{
        headerLargeTitle: true,
-        headerTransparent: true,
-        headerBlurEffect: "systemUltraThinMaterial",
+        headerTransparent: Platform.OS === "ios" ? true : false,
+        headerShadowVisible: false,
+        headerBlurEffect:
+          colorScheme === "dark" ? "systemMaterialDark" : "systemMaterial",
+        headerTintColor: colorScheme === "dark" ? "white" : "black",
+        headerLargeStyle: {
+          backgroundColor: rawTheme[colorScheme as ThemeName]["base-100"],
+        },
+        headerStyle: {
+          backgroundColor:
+            Platform.OS === "ios"
+              ? "transparent"
+              : colorScheme === "dark"
+                ? rawTheme["dark"]["base-100"]
+                : "white",
+        },
      }}
    >
      <Stack.Screen
        name="index"
        options={{
          headerTitle: "Dashboard",
-          headerLargeStyle: {
-            backgroundColor: "#f2f2f2",
-          },
          headerRight: () => (
            <DropdownMenu.Root>
              <DropdownMenu.Trigger>
                <TouchableOpacity>
-                  <IconSymbol size={20} name="plus" color={"#3478f6"} />
+                  <Plus
+                    size={21}
+                    color={rawTheme[colorScheme as ThemeName].primary}
+                  />
                </TouchableOpacity>
              </DropdownMenu.Trigger>

@@ -37,20 +54,11 @@ export default function RootLayout() {
                >
                  <DropdownMenu.ItemTitle>New Link</DropdownMenu.ItemTitle>
                </DropdownMenu.Item>
-                <DropdownMenu.Item
-                  key="new-collection"
-                  onSelect={() => alert("Item 2 selected")}
-                >
+                <DropdownMenu.Item key="more-options" disabled>
                  <DropdownMenu.ItemTitle>
-                    New Collection
+                    More Coming Soon!
                  </DropdownMenu.ItemTitle>
                </DropdownMenu.Item>
-                {/* <DropdownMenu.Item
-                key="upload-file"
-                onSelect={() => alert("Item 3 selected")}
-              >
-                <DropdownMenu.ItemTitle>Upload File</DropdownMenu.ItemTitle>
-              </DropdownMenu.Item> */}
              </DropdownMenu.Content>
            </DropdownMenu.Root>
          ),
@@ -61,12 +69,10 @@ export default function RootLayout() {
        options={{
          headerTitle: "Links",
          headerBackTitle: "Back",
-          headerLargeStyle: {
-            backgroundColor: "white",
-          },
          headerSearchBarOptions: {
            placeholder: "Search",
            autoCapitalize: "none",
+            headerIconColor: colorScheme === "dark" ? "white" : "black",
            onChangeText: (e) => {
              router.setParams({
                search: encodeURIComponent(e.nativeEvent.text),
--- a/apps/mobile/app/(tabs)/dashboard/index.tsx
+++ b/apps/mobile/app/(tabs)/dashboard/index.tsx
@@ -8,7 +8,6 @@ import {
  TouchableOpacity,
  View,
 } from "react-native";
-import { IconSymbol } from "@/components/ui/IconSymbol";
 import { SafeAreaView } from "react-native-safe-area-context";
 import { useDashboardData } from "@linkwarden/router/dashboardData";
 import useAuthStore from "@/store/auth";
@@ -22,6 +21,16 @@ import DashboardItem from "@/components/DashboardItem";
 import { LinkIncludingShortenedCollectionAndTags } from "@linkwarden/types";
 import LinkListing from "@/components/LinkListing";
 import { useRouter } from "expo-router";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useColorScheme } from "nativewind";
+import {
+  Clock8,
+  ChevronRight,
+  Pin,
+  Folder,
+  Hash,
+  Link,
+} from "lucide-react-native";

 export default function DashboardScreen() {
  const { auth } = useAuthStore();
@@ -31,10 +40,14 @@ export default function DashboardScreen() {
    },
    ...dashboardData
  } = useDashboardData(auth);
-  const { data: user } = useUser(auth);
+  const { data: user, ...userData } = useUser(auth);
  const { data: collections = [] } = useCollections(auth);
  const { data: tags = [] } = useTags(auth);

+  const { colorScheme } = useColorScheme();
+
+  const router = useRouter();
+
  const [dashboardSections, setDashboardSections] = useState<
    DashboardSection[]
  >(user?.dashboardSections || []);
@@ -47,7 +60,7 @@ export default function DashboardScreen() {

  useEffect(() => {
    setNumberOfLinks(
-      collections.reduce(
+      collections?.reduce?.(
        (accumulator, collection) =>
          accumulator + (collection._count as any).links,
        0
@@ -63,13 +76,284 @@ export default function DashboardScreen() {
    });
  }, [dashboardSections]);

+  interface SectionProps {
+    sectionData: { type: DashboardSectionType };
+    collection?: any;
+    links?: any[];
+    tagsLength: number;
+    numberOfLinks: number;
+    collectionsLength: number;
+    numberOfPinnedLinks: number;
+    dashboardData: { isLoading: boolean };
+    collectionLinks?: any[];
+  }
+
+  const Section: React.FC<SectionProps> = ({
+    sectionData,
+    collection,
+    links = [],
+    tagsLength,
+    numberOfLinks,
+    collectionsLength,
+    numberOfPinnedLinks,
+    dashboardData,
+    collectionLinks = [],
+  }) => {
+    switch (sectionData.type) {
+      case DashboardSectionType.STATS:
+        return (
+          <View className="flex-col gap-4 max-w-full px-5">
+            <View className="flex-row gap-4">
+              <DashboardItem
+                name={numberOfLinks === 1 ? "Link" : "Links"}
+                value={numberOfLinks}
+                icon={<Link size={23} color="white" />}
+                color="#9c00cc"
+              />
+              <DashboardItem
+                name={collectionsLength === 1 ? "Collection" : "Collections"}
+                value={collectionsLength}
+                icon={<Folder size={23} color="white" fill="white" />}
+                color="#0096cc"
+              />
+            </View>
+            <View className="flex-row gap-4">
+              <DashboardItem
+                name={tagsLength === 1 ? "Tag" : "Tags"}
+                value={tagsLength}
+                icon={<Hash size={23} color="white" />}
+                color="#00cc99"
+              />
+              <DashboardItem
+                name={"Pinned Links"}
+                value={numberOfPinnedLinks}
+                icon={<Pin size={23} color="white" fill="white" />}
+                color="#cc6d00"
+              />
+            </View>
+          </View>
+        );
+
+      case DashboardSectionType.RECENT_LINKS:
+        return (
+          <>
+            <View className="flex-row justify-between items-center px-5">
+              <View className="flex-row gap-2 items-center">
+                <View className={"flex-row items-center gap-2"}>
+                  <Clock8
+                    size={30}
+                    color={rawTheme[colorScheme as ThemeName].primary}
+                  />
+                  <Text className="text-2xl capitalize text-base-content">
+                    Recent Links
+                  </Text>
+                </View>
+              </View>
+              <TouchableOpacity
+                className="flex-row items-center text-sm gap-1"
+                onPress={() =>
+                  router.navigate("/(tabs)/dashboard/recent-links")
+                }
+              >
+                <Text className="text-primary">View All</Text>
+                <ChevronRight
+                  size={15}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              </TouchableOpacity>
+            </View>
+
+            {dashboardData.isLoading ||
+            (links.length > 0 && !dashboardData.isLoading) ? (
+              <FlatList
+                horizontal
+                showsHorizontalScrollIndicator={false}
+                directionalLockEnabled
+                data={links || []}
+                refreshing={dashboardData.isLoading}
+                initialNumToRender={2}
+                keyExtractor={(item) => item.id?.toString() || ""}
+                renderItem={({ item }) => (
+                  <RenderItem item={item} key={item.id?.toString()} />
+                )}
+                ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
+                contentContainerStyle={{
+                  paddingHorizontal: 20,
+                }}
+              />
+            ) : (
+              <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">
+                <Clock8
+                  size={40}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+                <Text className="text-center text-xl text-neutral">
+                  No Recent Links
+                </Text>
+
+                {/* <View className="text-center w-full mt-4 flex-row flex-wrap gap-4 justify-center">
+                <Button onPress={() => setNewLinkModal(true)} variant="accent">
+                  <Icon name="bi-plus-lg" className="text-xl" />
+                  <Text>{t("add_link")}</Text>
+                </Button>
+                <ImportDropdown />
+              </View> */}
+              </View>
+            )}
+          </>
+        );
+
+      case DashboardSectionType.PINNED_LINKS:
+        return (
+          <>
+            <View className="flex-row justify-between items-center px-5">
+              <View className="flex-row gap-2 items-center">
+                <View className={"flex-row items-center gap-2"}>
+                  <Pin
+                    size={30}
+                    color={rawTheme[colorScheme as ThemeName].primary}
+                  />
+                  <Text className="text-2xl capitalize text-base-content">
+                    Pinned Links
+                  </Text>
+                </View>
+              </View>
+              <TouchableOpacity
+                className="flex-row items-center text-sm gap-1"
+                onPress={() =>
+                  router.navigate("/(tabs)/dashboard/pinned-links")
+                }
+              >
+                <Text className="text-primary">View All</Text>
+                <ChevronRight
+                  size={15}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              </TouchableOpacity>
+            </View>
+
+            {dashboardData.isLoading ||
+            links?.some((e: any) => e.pinnedBy && e.pinnedBy[0]) ? (
+              <FlatList
+                horizontal
+                showsHorizontalScrollIndicator={false}
+                data={
+                  links.filter((e: any) => e.pinnedBy && e.pinnedBy[0]) || []
+                }
+                // onRefresh={() => data.refetch()}
+                refreshing={dashboardData.isLoading}
+                initialNumToRender={2}
+                keyExtractor={(item) => item.id?.toString() || ""}
+                renderItem={({ item }) => (
+                  <RenderItem item={item} key={item.id?.toString()} />
+                )}
+                ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
+                contentContainerStyle={{
+                  paddingHorizontal: 20,
+                }}
+              />
+            ) : (
+              <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">
+                <Pin
+                  size={40}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+                <Text className="text-center text-xl text-neutral">
+                  No Pinned Links
+                </Text>
+              </View>
+            )}
+          </>
+        );
+
+      case DashboardSectionType.COLLECTION:
+        return collection?.id ? (
+          <>
+            <View className="flex-row justify-between items-center px-5">
+              <View className="flex-row gap-2 items-center max-w-[60%]">
+                <View className={clsx("flex-row items-center gap-2")}>
+                  <Folder
+                    size={30}
+                    fill={collection.color || "#0ea5e9"}
+                    color={collection.color || "#0ea5e9"}
+                  />
+                  <Text
+                    className="text-2xl capitalize w-full text-base-content"
+                    numberOfLines={1}
+                  >
+                    {collection.name}
+                  </Text>
+                </View>
+              </View>
+              <TouchableOpacity
+                className="flex-row items-center text-sm gap-1 whitespace-nowrap"
+                onPress={() =>
+                  router.navigate(
+                    `/(tabs)/dashboard/collection?collectionId=${collection.id}`
+                  )
+                }
+              >
+                <Text className="text-primary">View All</Text>
+                <ChevronRight
+                  size={15}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              </TouchableOpacity>
+            </View>
+
+            {dashboardData.isLoading || collectionLinks.length > 0 ? (
+              <FlatList
+                horizontal
+                showsHorizontalScrollIndicator={false}
+                data={collectionLinks || []}
+                // onRefresh={() => data.refetch()}
+                refreshing={dashboardData.isLoading}
+                initialNumToRender={2}
+                keyExtractor={(item) => item.id?.toString() || ""}
+                renderItem={({ item }) => (
+                  <RenderItem item={item} key={item.id?.toString()} />
+                )}
+                ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
+                contentContainerStyle={{
+                  paddingHorizontal: 20,
+                }}
+              />
+            ) : (
+              <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">
+                <Text className="text-center text-xl text-neutral">
+                  Empty Collection
+                </Text>
+              </View>
+            )}
+          </>
+        ) : null;
+
+      default:
+        return null;
+    }
+  };
+
+  const RenderItem = React.memo(
+    ({ item }: { item: LinkIncludingShortenedCollectionAndTags }) => {
+      return <LinkListing link={item} dashboard />;
+    }
+  );
+
  return (
-    <SafeAreaView style={styles.container}>
+    <SafeAreaView
+      style={styles.container}
+      collapsable={false}
+      collapsableChildren={false}
+      className="bg-base-100 h-full"
+    >
      <ScrollView
        refreshControl={
          <RefreshControl
-            refreshing={dashboardData.isLoading}
-            onRefresh={dashboardData.refetch}
+            refreshing={dashboardData.isLoading || userData.isLoading}
+            onRefresh={() => {
+              dashboardData.refetch();
+              userData.refetch();
+            }}
          />
        }
        contentContainerStyle={{
@@ -77,29 +361,28 @@ export default function DashboardScreen() {
          gap: 15,
          paddingVertical: 20,
        }}
+        className="bg-base-100"
        contentInsetAdjustmentBehavior="automatic"
      >
        {orderedSections.map((sectionData) => {
-          const collection = collections.find(
-            (c) => c.id === sectionData.collectionId
-          );
-
          return (
            <Section
              key={sectionData.id}
              sectionData={sectionData}
-              collection={collection}
+              collection={collections.find(
+                (c) => c.id === sectionData.collectionId
+              )}
+              collectionLinks={
+                sectionData.collectionId
+                  ? collectionLinks[sectionData.collectionId]
+                  : []
+              }
              links={links}
              tagsLength={tags.length}
              numberOfLinks={numberOfLinks}
              collectionsLength={collections.length}
              numberOfPinnedLinks={numberOfPinnedLinks}
              dashboardData={dashboardData}
-              collectionLinks={
-                sectionData.collectionId
-                  ? collectionLinks[sectionData.collectionId]
-                  : []
-              }
            />
          );
        })}
@@ -108,237 +391,6 @@ export default function DashboardScreen() {
  );
 }

-interface SectionProps {
-  sectionData: { type: DashboardSectionType };
-  collection?: any;
-  links?: any[];
-  tagsLength: number;
-  numberOfLinks: number;
-  collectionsLength: number;
-  numberOfPinnedLinks: number;
-  dashboardData: { isLoading: boolean };
-  collectionLinks?: any[];
-}
-
-const Section: React.FC<SectionProps> = ({
-  sectionData,
-  collection,
-  links = [],
-  tagsLength,
-  numberOfLinks,
-  collectionsLength,
-  numberOfPinnedLinks,
-  dashboardData,
-  collectionLinks = [],
-}) => {
-  const router = useRouter();
-
-  switch (sectionData.type) {
-    case DashboardSectionType.STATS:
-      return (
-        <View className="flex-col gap-4 max-w-full px-5">
-          <View className="flex-row gap-4">
-            <DashboardItem
-              name={numberOfLinks === 1 ? "Link" : "Links"}
-              value={numberOfLinks}
-              icon="link.circle.fill"
-              color="#9c00cc"
-            />
-            <DashboardItem
-              name={collectionsLength === 1 ? "Collection" : "Collections"}
-              value={collectionsLength}
-              icon="folder.circle.fill"
-              color="#0096cc"
-            />
-          </View>
-          <View className="flex-row gap-4">
-            <DashboardItem
-              name={tagsLength === 1 ? "Tag" : "Tags"}
-              value={tagsLength}
-              icon="tag.circle.fill"
-              color="#00cc99"
-            />
-            <DashboardItem
-              name={"Pinned Links"}
-              value={numberOfPinnedLinks}
-              icon="pin.circle.fill"
-              color="#cc6d00"
-            />
-          </View>
-        </View>
-      );
-
-    case DashboardSectionType.RECENT_LINKS:
-      return (
-        <>
-          <View className="flex-row justify-between items-center px-5">
-            <View className="flex-row gap-2 items-center">
-              <View className={"flex-row items-center gap-2"}>
-                <IconSymbol size={30} name="clock" color={""} />
-                <Text className="text-2xl capitalize">Recent Links</Text>
-              </View>
-            </View>
-            <TouchableOpacity
-              className="flex-row items-center text-sm gap-1"
-              onPress={() => router.navigate("/(tabs)/dashboard/recent-links")}
-            >
-              <Text className="text-[#3478f6]">View All</Text>
-              <IconSymbol size={15} name="chevron.right" color={"#3478f6"} />
-            </TouchableOpacity>
-          </View>
-
-          {dashboardData.isLoading ||
-          (links.length > 0 && !dashboardData.isLoading) ? (
-            <FlatList
-              horizontal
-              showsHorizontalScrollIndicator={false}
-              directionalLockEnabled
-              data={links || []}
-              refreshing={dashboardData.isLoading}
-              initialNumToRender={2}
-              keyExtractor={(item) => item.id?.toString() || ""}
-              renderItem={({ item }) => (
-                <RenderItem item={item} key={item.id?.toString()} />
-              )}
-              ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
-              contentContainerStyle={{
-                paddingHorizontal: 20,
-              }}
-            />
-          ) : (
-            <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 bg-white mx-5">
-              <IconSymbol size={40} name="clock" color={""} />
-              <Text className="text-center text-xl text-gray-500">
-                No Recent Links
-              </Text>
-
-              {/* <View className="text-center w-full mt-4 flex-row flex-wrap gap-4 justify-center">
-                <Button onPress={() => setNewLinkModal(true)} variant="accent">
-                  <Icon name="bi-plus-lg" className="text-xl" />
-                  <Text>{t("add_link")}</Text>
-                </Button>
-                <ImportDropdown />
-              </View> */}
-            </View>
-          )}
-        </>
-      );
-
-    case DashboardSectionType.PINNED_LINKS:
-      return (
-        <>
-          <View className="flex-row justify-between items-center px-5">
-            <View className="flex-row gap-2 items-center">
-              <View className={"flex-row items-center gap-2"}>
-                <IconSymbol size={30} name="pin" color={""} />
-                <Text className="text-2xl capitalize">Pinned Links</Text>
-              </View>
-            </View>
-            <TouchableOpacity
-              className="flex-row items-center text-sm gap-1"
-              onPress={() => router.navigate("/(tabs)/dashboard/pinned-links")}
-            >
-              <Text className="text-[#3478f6]">View All</Text>
-              <IconSymbol size={15} name="chevron.right" color={"#3478f6"} />
-            </TouchableOpacity>
-          </View>
-
-          {dashboardData.isLoading ||
-          links?.some((e: any) => e.pinnedBy && e.pinnedBy[0]) ? (
-            <FlatList
-              horizontal
-              showsHorizontalScrollIndicator={false}
-              data={links.filter((e: any) => e.pinnedBy && e.pinnedBy[0]) || []}
-              // onRefresh={() => data.refetch()}
-              refreshing={dashboardData.isLoading}
-              initialNumToRender={2}
-              keyExtractor={(item) => item.id?.toString() || ""}
-              renderItem={({ item }) => (
-                <RenderItem item={item} key={item.id?.toString()} />
-              )}
-              ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
-              contentContainerStyle={{
-                paddingHorizontal: 20,
-              }}
-            />
-          ) : (
-            <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 bg-white mx-5">
-              <IconSymbol size={40} name="pin" color={""} />
-              <Text className="text-center text-xl text-gray-500">
-                No Pinned Links
-              </Text>
-            </View>
-          )}
-        </>
-      );
-
-    case DashboardSectionType.COLLECTION:
-      return collection?.id ? (
-        <>
-          <View className="flex-row justify-between items-center px-5">
-            <View className="flex-row gap-2 items-center max-w-[60%]">
-              <View className={clsx("flex-row items-center gap-2")}>
-                <IconSymbol
-                  size={30}
-                  name="folder.fill"
-                  color={collection.color || "#0ea5e9"}
-                />
-                <Text className="text-2xl capitalize w-full" numberOfLines={1}>
-                  {collection.name}
-                </Text>
-              </View>
-            </View>
-            <TouchableOpacity
-              className="flex-row items-center text-sm gap-1 whitespace-nowrap"
-              onPress={() =>
-                router.navigate(
-                  `/(tabs)/dashboard/collection?collectionId=${collection.id}`
-                )
-              }
-            >
-              <Text className="text-[#3478f6]">View All</Text>
-              <IconSymbol size={15} name="chevron.right" color={"#3478f6"} />
-            </TouchableOpacity>
-          </View>
-
-          {dashboardData.isLoading || collectionLinks.length > 0 ? (
-            <FlatList
-              horizontal
-              showsHorizontalScrollIndicator={false}
-              data={collectionLinks || []}
-              // onRefresh={() => data.refetch()}
-              refreshing={dashboardData.isLoading}
-              initialNumToRender={2}
-              keyExtractor={(item) => item.id?.toString() || ""}
-              renderItem={({ item }) => (
-                <RenderItem item={item} key={item.id?.toString()} />
-              )}
-              ItemSeparatorComponent={() => <View style={{ width: 10 }} />}
-              contentContainerStyle={{
-                paddingHorizontal: 20,
-              }}
-            />
-          ) : (
-            <View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 bg-white mx-5">
-              <Text className="text-center text-xl text-gray-500">
-                Empty Collection
-              </Text>
-            </View>
-          )}
-        </>
-      ) : null;
-
-    default:
-      return null;
-  }
-};
-
-const RenderItem = React.memo(
-  ({ item }: { item: LinkIncludingShortenedCollectionAndTags }) => {
-    return <LinkListing link={item} dashboard />;
-  }
-);
-
 const styles = StyleSheet.create({
  container: Platform.select({
    ios: {
--- a/apps/mobile/app/(tabs)/links/_layout.tsx
+++ b/apps/mobile/app/(tabs)/links/_layout.tsx
@@ -1,15 +1,22 @@
 import { Stack, useRouter } from "expo-router";
+import { useColorScheme } from "nativewind";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { Platform } from "react-native";

 export default function RootLayout() {
  const router = useRouter();
+  const { colorScheme } = useColorScheme();

  return (
    <Stack
      screenOptions={{
        headerTitle: "Links",
        headerLargeTitle: true,
-        headerTransparent: true,
-        headerBlurEffect: "systemUltraThinMaterial",
+        headerTransparent: Platform.OS === "ios" ? true : false,
+        headerShadowVisible: false,
+        headerBlurEffect:
+          colorScheme === "dark" ? "systemMaterialDark" : "systemMaterial",
+        headerTintColor: colorScheme === "dark" ? "white" : "black",
        headerSearchBarOptions: {
          placeholder: "Search",
          autoCapitalize: "none",
@@ -18,9 +25,18 @@ export default function RootLayout() {
              search: encodeURIComponent(e.nativeEvent.text),
            });
          },
+          headerIconColor: colorScheme === "dark" ? "white" : "black",
        },
        headerLargeStyle: {
-          backgroundColor: "white",
+          backgroundColor: rawTheme[colorScheme as ThemeName]["base-100"],
+        },
+        headerStyle: {
+          backgroundColor:
+            Platform.OS === "ios"
+              ? "transparent"
+              : colorScheme === "dark"
+                ? rawTheme["dark"]["base-100"]
+                : "white",
        },
      }}
    />
--- a/apps/mobile/app/(tabs)/links/index.tsx
+++ b/apps/mobile/app/(tabs)/links/index.tsx
@@ -5,7 +5,6 @@ import LinkListing from "@/components/LinkListing";
 import { useLocalSearchParams } from "expo-router";
 import React from "react";
 import { LinkIncludingShortenedCollectionAndTags } from "@linkwarden/types";
-import { useHeaderHeight } from "@react-navigation/elements";

 const RenderItem = React.memo(
  ({ item }: { item: LinkIncludingShortenedCollectionAndTags }) => {
@@ -16,7 +15,6 @@ const RenderItem = React.memo(
 export default function LinksScreen() {
  const { auth } = useAuthStore();
  const { search } = useLocalSearchParams<{ search?: string }>();
-  const headerHeight = useHeaderHeight();

  const { links, data } = useLinks(
    {
@@ -27,7 +25,12 @@ export default function LinksScreen() {
  );

  return (
-    <View style={styles.container} className="h-full">
+    <View
+      style={styles.container}
+      className="h-full bg-base-100"
+      collapsable={false}
+      collapsableChildren={false}
+    >
      <FlatList
        contentInsetAdjustmentBehavior="automatic"
        ListHeaderComponent={() => <></>}
@@ -42,7 +45,7 @@ export default function LinksScreen() {
        onEndReached={() => data.fetchNextPage()}
        onEndReachedThreshold={0.5}
        ItemSeparatorComponent={() => (
-          <View className="bg-[#eee] h-[1px] w-[100px]" />
+          <View className="bg-neutral-content h-px" />
        )}
      />
    </View>
--- a/apps/mobile/app/(tabs)/settings/_layout.tsx
+++ b/apps/mobile/app/(tabs)/settings/_layout.tsx
@@ -1,17 +1,31 @@
-import { Stack, useRouter } from "expo-router";
+import { Stack } from "expo-router";
+import { useColorScheme } from "nativewind";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { Platform } from "react-native";

 export default function RootLayout() {
-  const router = useRouter();
+  const { colorScheme } = useColorScheme();

  return (
    <Stack
      screenOptions={{
        headerTitle: "Settings",
        headerLargeTitle: true,
-        headerTransparent: true,
-        headerBlurEffect: "systemUltraThinMaterial",
+        headerTransparent: Platform.OS === "ios" ? true : false,
+        headerShadowVisible: false,
+        headerBlurEffect:
+          colorScheme === "dark" ? "systemMaterialDark" : "systemMaterial",
+        headerTintColor: colorScheme === "dark" ? "white" : "black",
        headerLargeStyle: {
-          backgroundColor: "white",
+          backgroundColor: rawTheme[colorScheme as ThemeName]["base-100"],
+        },
+        headerStyle: {
+          backgroundColor:
+            Platform.OS === "ios"
+              ? "transparent"
+              : colorScheme === "dark"
+                ? rawTheme["dark"]["base-100"]
+                : "white",
        },
      }}
    />
--- a/apps/mobile/app/(tabs)/settings/index.tsx
+++ b/apps/mobile/app/(tabs)/settings/index.tsx
@@ -1,22 +1,204 @@
 import useAuthStore from "@/store/auth";
-import { View, Text, StyleSheet, Button, ScrollView } from "react-native";
+import { useUser } from "@linkwarden/router/user";
+import {
+  View,
+  Text,
+  StyleSheet,
+  ScrollView,
+  TouchableOpacity,
+  Platform,
+  Alert,
+} from "react-native";
+import { nativeApplicationVersion } from "expo-application";
+import { useColorScheme } from "nativewind";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useEffect, useState } from "react";
+import {
+  Check,
+  FileText,
+  Globe,
+  LogOut,
+  Moon,
+  Smartphone,
+  Sun,
+} from "lucide-react-native";
+import useDataStore from "@/store/data";
+import { ArchivedFormat } from "@/types/global";

 export default function SettingsScreen() {
-  const { signOut } = useAuthStore();
+  const { signOut, auth } = useAuthStore();
+  const { data: user } = useUser(auth);
+  const { colorScheme, setColorScheme } = useColorScheme();
+  const { data, updateData } = useDataStore();
+  const [override, setOverride] = useState<"light" | "dark" | "system">(
+    data.theme || "system"
+  );
+
+  useEffect(() => {
+    setColorScheme(override);
+    updateData({ theme: override });
+  }, [override]);

  return (
-    <View style={styles.container}>
+    <View
+      style={styles.container}
+      collapsable={false}
+      collapsableChildren={false}
+      className="bg-base-100"
+    >
      <ScrollView
        contentContainerStyle={{
-          flexDirection: "column",
-          gap: 15,
-          paddingVertical: 20,
-          alignItems: "center",
+          padding: 20,
        }}
+        contentContainerClassName="flex-col gap-6"
        contentInsetAdjustmentBehavior="automatic"
      >
-        <Text>Settings</Text>
-        <Button title="Sign out" onPress={() => signOut()} />
+        <View className="bg-base-200 rounded-xl px-4 py-3">
+          <Text className="font-semibold text-xl text-base-content">
+            Your account
+          </Text>
+          <Text className="text-neutral mt-2 mb-3">
+            {user?.email || "@" + user?.username}
+          </Text>
+          <View className="h-px bg-neutral-content -mr-4" />
+          <TouchableOpacity
+            className="flex-row items-center mt-3"
+            onPress={() =>
+              Alert.alert("Sign Out", "Are you sure you want to sign out?", [
+                {
+                  text: "Cancel",
+                  style: "cancel",
+                },
+                {
+                  text: "Sign Out",
+                  style: "destructive",
+                  onPress: () => {
+                    signOut();
+                  },
+                },
+              ])
+            }
+          >
+            <Text className="flex-1 text-base text-red-500">Sign Out</Text>
+            <LogOut size={18} color="red" />
+          </TouchableOpacity>
+        </View>
+
+        <View>
+          <Text className="mb-4 mx-4 text-neutral">Theme</Text>
+          <View className="bg-base-200 rounded-xl flex-col">
+            <TouchableOpacity
+              className="flex-row gap-2 items-center justify-between py-3 px-4"
+              onPress={() => setOverride("system")}
+            >
+              <View className="flex-row items-center gap-2">
+                <Smartphone
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].neutral}
+                />
+                <Text className="text-neutral">System Defaults</Text>
+              </View>
+              {override === "system" ? (
+                <Check
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              ) : null}
+            </TouchableOpacity>
+            <View className="h-px bg-neutral-content ml-12" />
+            <TouchableOpacity
+              className="flex-row gap-2 items-center justify-between py-3 px-4"
+              onPress={() => setOverride("light")}
+            >
+              <View className="flex-row items-center gap-2">
+                <Sun size={20} color="orange" />
+                <Text className="text-orange-500 dark:text-orange-400">
+                  Light
+                </Text>
+              </View>
+              {override === "light" ? (
+                <Check
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              ) : null}
+            </TouchableOpacity>
+            <View className="h-px bg-neutral-content ml-12" />
+            <TouchableOpacity
+              className="flex-row gap-2 items-center justify-between py-3 px-4"
+              onPress={() => setOverride("dark")}
+            >
+              <View className="flex-row items-center gap-2">
+                <Moon size={20} color="royalblue" />
+                <Text className="text-blue-600 dark:text-blue-400">Dark</Text>
+              </View>
+              {override === "dark" ? (
+                <Check
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              ) : null}
+            </TouchableOpacity>
+          </View>
+        </View>
+
+        <View>
+          <Text className="mb-4 mx-4 text-neutral">
+            Default Behavior for Opening Links
+          </Text>
+          <View className="bg-base-200 rounded-xl flex-col">
+            <TouchableOpacity
+              className="flex-row gap-2 items-center justify-between py-3 px-4"
+              onPress={() =>
+                updateData({
+                  preferredFormat: null,
+                })
+              }
+            >
+              <View className="flex-row items-center gap-2">
+                <Globe
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].neutral}
+                />
+                <Text className="text-base-content">Open original content</Text>
+              </View>
+              {data.preferredFormat === null ? (
+                <Check
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              ) : null}
+            </TouchableOpacity>
+            <View className="h-px bg-neutral-content ml-12" />
+            <TouchableOpacity
+              className="flex-row gap-2 items-center justify-between py-3 px-4"
+              onPress={() =>
+                updateData({
+                  preferredFormat: ArchivedFormat.readability,
+                })
+              }
+            >
+              <View className="flex-row items-center gap-2">
+                <FileText
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].neutral}
+                />
+                <Text className="text-base-content">Open reader view</Text>
+              </View>
+              {data.preferredFormat === ArchivedFormat.readability ? (
+                <Check
+                  size={20}
+                  color={rawTheme[colorScheme as ThemeName].primary}
+                />
+              ) : null}
+            </TouchableOpacity>
+          </View>
+        </View>
+
+        <Text className="mx-auto text-sm text-neutral">
+          Linkwarden for {Platform.OS === "ios" ? "iOS" : "Android"}{" "}
+          {nativeApplicationVersion}
+        </Text>
      </ScrollView>
    </View>
  );
@@ -25,7 +207,5 @@ export default function SettingsScreen() {
 const styles = StyleSheet.create({
  container: {
    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
  },
 });
--- a/apps/mobile/app/_layout.tsx
+++ b/apps/mobile/app/_layout.tsx
@@ -1,17 +1,30 @@
-import { Stack } from "expo-router";
-import { QueryClient } from "@tanstack/react-query";
+import {
+  Stack,
+  usePathname,
+  useRootNavigationState,
+  useRouter,
+} from "expo-router";
 import { PersistQueryClientProvider } from "@tanstack/react-query-persist-client";
 import { mmkvPersister } from "@/lib/queryPersister";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import "../styles/global.css";
 import { SheetProvider } from "react-native-actions-sheet";
 import "@/components/ActionSheets/Sheets";
+import { useColorScheme } from "nativewind";
+import { lightTheme, darkTheme } from "../lib/theme";
+import { Platform, View } from "react-native";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useShareIntent } from "expo-share-intent";
+import useDataStore from "@/store/data";
+import useAuthStore from "@/store/auth";
+import { QueryClient } from "@tanstack/react-query";
+import * as FileSystem from "expo-file-system";

 const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
-      staleTime: 1000 * 60 * 60 * 24, // never refetch for 24h
-      refetchOnMount: false,
+      staleTime: 1000 * 60 * 60 * 24,
+      refetchOnMount: true,
      refetchOnWindowFocus: false,
      refetchOnReconnect: false,
    },
@@ -20,6 +33,69 @@ const queryClient = new QueryClient({

 export default function RootLayout() {
  const [isLoading, setIsLoading] = useState(true);
+  const { colorScheme } = useColorScheme();
+  const { hasShareIntent, shareIntent, error, resetShareIntent } =
+    useShareIntent();
+  const { updateData, setData, data } = useDataStore();
+
+  const router = useRouter();
+  const pathname = usePathname();
+
+  const { auth, setAuth } = useAuthStore();
+  const rootNavState = useRootNavigationState();
+
+  useEffect(() => {
+    setAuth();
+    setData();
+  }, []);
+
+  useEffect(() => {
+    (async () => {
+      if (auth.status === "unauthenticated") {
+        queryClient.cancelQueries();
+        queryClient.clear();
+        mmkvPersister.removeClient?.();
+
+        const CACHE_DIR =
+          FileSystem.documentDirectory + "archivedData/readable/";
+        await FileSystem.deleteAsync(CACHE_DIR, { idempotent: true });
+      }
+    })();
+  }, [auth.status]);
+
+  useEffect(() => {
+    if (!rootNavState?.key) return;
+
+    if (hasShareIntent && shareIntent.webUrl) {
+      updateData({
+        shareIntent: {
+          hasShareIntent: true,
+          url: shareIntent.webUrl || "",
+        },
+      });
+
+      resetShareIntent();
+    }
+
+    const needsRewrite =
+      ((typeof pathname === "string" && pathname.startsWith("/dataUrl=")) ||
+        hasShareIntent) &&
+      pathname !== "/incoming";
+
+    if (needsRewrite) {
+      router.replace("/incoming");
+    }
+    if (hasShareIntent) {
+      resetShareIntent();
+      router.replace("/incoming");
+    }
+  }, [
+    rootNavState?.key,
+    hasShareIntent,
+    pathname,
+    shareIntent?.webUrl,
+    data.shareIntent,
+  ]);

  return (
    <PersistQueryClientProvider
@@ -27,30 +103,84 @@ export default function RootLayout() {
      persistOptions={{
        persister: mmkvPersister,
        maxAge: Infinity,
+        dehydrateOptions: {
+          shouldDehydrateMutation: () => true,
+          shouldDehydrateQuery: () => true,
+        },
+      }}
+      onSuccess={() => {
+        setIsLoading(false);
+        queryClient.invalidateQueries();
      }}
-      onSuccess={() => setIsLoading(false)}
    >
-      <SheetProvider>
-        {!isLoading && (
-          <Stack
-            screenOptions={{
-              headerShown: false,
-            }}
-          >
-            {/* <Stack.Screen name="(tabs)" /> */}
-            <Stack.Screen
-              name="links/[id]"
-              options={{
-                headerBackTitle: "Back",
-                headerShown: true,
-                headerTitle: "",
+      <View
+        style={[{ flex: 1 }, colorScheme === "dark" ? darkTheme : lightTheme]}
+      >
+        <SheetProvider>
+          {!isLoading && (
+            <Stack
+              screenOptions={{
+                navigationBarColor:
+                  rawTheme[colorScheme as ThemeName]["base-200"],
+                headerShown: false,
+                contentStyle: {
+                  backgroundColor:
+                    rawTheme[colorScheme as ThemeName]["base-100"],
+                },
+                ...Platform.select({
+                  android: {
+                    statusBarStyle: colorScheme === "dark" ? "light" : "dark",
+                    statusBarBackgroundColor:
+                      rawTheme[colorScheme as ThemeName]["base-100"],
+                  },
+                }),
              }}
-            />
-            <Stack.Screen name="login" />
-            <Stack.Screen name="+not-found" />
-          </Stack>
-        )}
-      </SheetProvider>
+            >
+              {/* <Stack.Screen name="(tabs)" /> */}
+              <Stack.Screen
+                name="links/[id]"
+                options={{
+                  headerShown: true,
+                  headerBackTitle: "Back",
+                  headerTitle: "",
+                  headerTintColor: colorScheme === "dark" ? "white" : "black",
+                  navigationBarColor:
+                    rawTheme[colorScheme as ThemeName]["base-100"],
+                  headerStyle: {
+                    backgroundColor:
+                      colorScheme === "dark"
+                        ? rawTheme["dark"]["base-100"]
+                        : "white",
+                  },
+                }}
+              />
+              <Stack.Screen
+                name="login"
+                options={{
+                  navigationBarColor:
+                    rawTheme[colorScheme as ThemeName]["base-100"],
+                  ...Platform.select({
+                    android: {
+                      statusBarStyle:
+                        colorScheme === "light" ? "light" : "dark",
+                      statusBarBackgroundColor:
+                        rawTheme[colorScheme as ThemeName]["primary"],
+                    },
+                  }),
+                }}
+              />
+              <Stack.Screen
+                name="incoming"
+                options={{
+                  navigationBarColor:
+                    rawTheme[colorScheme as ThemeName]["base-100"],
+                }}
+              />
+              <Stack.Screen name="+not-found" />
+            </Stack>
+          )}
+        </SheetProvider>
+      </View>
    </PersistQueryClientProvider>
  );
 }
--- a/apps/mobile/app/incoming.tsx
+++ b/apps/mobile/app/incoming.tsx
@@ -0,0 +1,98 @@
+import React, { useEffect } from "react";
+import {
+  SafeAreaView,
+  View,
+  Text,
+  StyleSheet,
+  ActivityIndicator,
+  Alert,
+} from "react-native";
+import { Redirect, useRouter } from "expo-router";
+import useAuthStore from "@/store/auth";
+import useDataStore from "@/store/data";
+import { Check } from "lucide-react-native";
+import { useAddLink } from "@linkwarden/router/links";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useColorScheme } from "nativewind";
+
+export default function IncomingScreen() {
+  const { auth } = useAuthStore();
+  const router = useRouter();
+  const { data, updateData } = useDataStore();
+  const addLink = useAddLink(auth);
+  const { colorScheme } = useColorScheme();
+
+  useEffect(() => {
+    if (auth.status === "authenticated" && data.shareIntent.url)
+      addLink.mutate(
+        { url: data.shareIntent.url },
+        {
+          onSuccess: () => {
+            setTimeout(() => {
+              updateData({
+                shareIntent: {
+                  hasShareIntent: false,
+                  url: "",
+                },
+              });
+              router.replace("/dashboard");
+            }, 1000);
+          },
+          onError: (error) => {
+            Alert.alert("Error", "There was an error adding the link.");
+            console.error("Error adding link:", error);
+          },
+        }
+      );
+  }, [auth, data.shareIntent.url]);
+
+  if (auth.status === "unauthenticated") return <Redirect href="/login" />;
+
+  return (
+    <SafeAreaView className="flex-1 bg-base-100">
+      {data?.shareIntent.url ? (
+        <View className="flex-1 items-center justify-center">
+          <Check
+            size={140}
+            className="mb-3 text-base-content"
+            color={rawTheme[colorScheme as ThemeName].primary}
+          />
+          <Text className="text-2xl font-semibold text-base-content">
+            Link Saved!
+          </Text>
+        </View>
+      ) : (
+        <View className="flex-1 items-center justify-center">
+          <ActivityIndicator size="large" />
+          <Text className="mt-3 text-base text-base-content opacity-70">
+            One sec… {String(data?.shareIntent.url)}
+          </Text>
+        </View>
+      )}
+    </SafeAreaView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "#fff",
+  },
+  center: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+  },
+  check: {
+    marginBottom: 12,
+  },
+  title: {
+    fontSize: 28,
+    fontWeight: "600",
+  },
+  subtitle: {
+    marginTop: 12,
+    fontSize: 16,
+    opacity: 0.7,
+  },
+});
--- a/apps/mobile/app/index.tsx
+++ b/apps/mobile/app/index.tsx
@@ -1,13 +1,8 @@
 import useAuthStore from "@/store/auth";
 import { Redirect } from "expo-router";
-import { useEffect } from "react";

 export default function HomeScreen() {
-  const { setAuth, auth } = useAuthStore();
-
-  useEffect(() => {
-    setAuth();
-  }, []);
+  const { auth } = useAuthStore();

  if (auth.session) {
    return <Redirect href="/(tabs)/dashboard" />;
--- a/apps/mobile/app/links/[id].tsx
+++ b/apps/mobile/app/links/[id].tsx
@@ -17,8 +17,10 @@ import { useWindowDimensions } from "react-native";
 import RenderHtml from "@linkwarden/react-native-render-html";
 import ElementNotSupported from "@/components/ElementNotSupported";
 import { decode } from "html-entities";
-import { IconSymbol } from "@/components/ui/IconSymbol";
-import { useLinks } from "@linkwarden/router/links";
+import { useGetLink } from "@linkwarden/router/links";
+import { useColorScheme } from "nativewind";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { CalendarDays, Link } from "lucide-react-native";

 const CACHE_DIR = FileSystem.documentDirectory + "archivedData/readable/";
 const htmlPath = (id: string) => `${CACHE_DIR}link_${id}.html`;
@@ -39,16 +41,9 @@ export default function LinkScreen() {
  const [isLoading, setIsLoading] = useState(true);
  const { width } = useWindowDimensions();
  const router = useRouter();
-  const { links } = useLinks(
-    {
-      sort: 0,
-    },
-    auth
-  );
+  const { colorScheme } = useColorScheme();

-  const link = useMemo(() => {
-    return links?.find((link) => link.id === Number(id));
-  }, [links, id]);
+  const { data: link } = useGetLink({ id: Number(id), auth, enabled: true });

  useEffect(() => {
    async function loadCacheOrFetch() {
@@ -69,10 +64,10 @@ export default function LinkScreen() {
      }
    }

-    if (user && user.id && !url) {
+    if (user?.id && link?.id && !url) {
      loadCacheOrFetch();
    }
-  }, [user, url]);
+  }, [user, link]);

  async function fetchLinkData() {
    if (link?.id && format === "3") {
@@ -105,11 +100,11 @@ export default function LinkScreen() {
    <>
      {format === "3" && htmlContent ? (
        <ScrollView
-          className="flex-1 bg-white"
+          className="flex-1 bg-base-100"
          contentContainerClassName="p-4"
          nestedScrollEnabled
        >
-          <Text className="text-2xl font-bold mb-2.5">
+          <Text className="text-2xl font-bold mb-2.5 text-base-content">
            {decode(link?.name || link?.description || link?.url || "")}
          </Text>

@@ -117,15 +112,21 @@ export default function LinkScreen() {
            className="flex-row items-center gap-1 mb-2.5 pr-5"
            onPress={() => router.replace(`/links/${id}`)}
          >
-            <IconSymbol name="link" size={16} color="gray" />
-            <Text className="text-base text-gray-500 flex-1" numberOfLines={1}>
+            <Link
+              size={16}
+              color={rawTheme[colorScheme as ThemeName]["neutral"]}
+            />
+            <Text className="text-base text-neutral flex-1" numberOfLines={1}>
              {link?.url}
            </Text>
          </TouchableOpacity>

          <View className="flex-row items-center gap-1 mb-2.5">
-            <IconSymbol name="calendar" size={16} color="gray" />
-            <Text className="text-base text-gray-500">
+            <CalendarDays
+              size={16}
+              color={rawTheme[colorScheme as ThemeName]["neutral"]}
+            />
+            <Text className="text-base text-neutral">
              {new Date(
                (link?.importDate || link?.createdAt) as string
              ).toLocaleString("en-US", {
@@ -136,7 +137,7 @@ export default function LinkScreen() {
            </Text>
          </View>

-          <View className="border-t border-gray-200 mt-2.5 mb-5" />
+          <View className="border-t border-neutral-content mt-2.5 mb-5" />

          <RenderHtml
            contentWidth={width}
@@ -149,29 +150,35 @@ export default function LinkScreen() {
              ),
            }}
            tagsStyles={{
-              p: { fontSize: 16, lineHeight: 24, marginVertical: 10 },
+              p: { fontSize: 18, lineHeight: 28, marginVertical: 10 },
+            }}
+            baseStyle={{
+              color: rawTheme[colorScheme as ThemeName]["base-content"],
            }}
          />
        </ScrollView>
+      ) : url ? (
+        <WebView
+          className={isLoading ? "opacity-0" : "flex-1"}
+          source={{
+            uri: url,
+            headers: format ? { Authorization: `Bearer ${auth.session}` } : {},
+          }}
+          onLoadEnd={() => setIsLoading(false)}
+        />
      ) : (
-        <View className="flex-1 bg-white">
-          {url && (
-            <WebView
-              className={isLoading ? "opacity-0" : "flex-1"}
-              source={{
-                uri: url,
-                headers: { Authorization: `Bearer ${auth.session}` },
-              }}
-              onLoadEnd={() => setIsLoading(false)}
-            />
-          )}
+        <View className="flex-1 justify-center items-center bg-base-100 p-5">
+          <Text className="text-base text-neutral">
+            No link data available. Please check your network connection or try
+            again later.
+          </Text>
        </View>
      )}

      {isLoading && (
-        <View className="absolute inset-0 flex-1 justify-center items-center bg-white p-5">
-          <ActivityIndicator size="large" color="gray" />
-          <Text className="text-base mt-2.5 text-gray-500">Loading...</Text>
+        <View className="absolute inset-0 flex-1 justify-center items-center bg-base-100 p-5">
+          <ActivityIndicator size="large" />
+          <Text className="text-base mt-2.5 text-neutral">Loading...</Text>
        </View>
      )}
    </>
--- a/apps/mobile/app/login.tsx
+++ b/apps/mobile/app/login.tsx
@@ -1,43 +1,90 @@
 import { Button } from "@/components/ui/Button";
 import Input from "@/components/ui/Input";
+import { rawTheme, ThemeName } from "@/lib/colors";
 import useAuthStore from "@/store/auth";
+import { Redirect } from "expo-router";
+import { useColorScheme } from "nativewind";
 import { useState } from "react";
-import { View, Text, StyleSheet, TouchableOpacity } from "react-native";
+import { View, Text, Dimensions, TouchableOpacity } from "react-native";
+import Svg, { Path } from "react-native-svg";

 export default function HomeScreen() {
-  const { signIn } = useAuthStore();
+  const { auth, signIn } = useAuthStore();
+  const { colorScheme } = useColorScheme();
+  const [method, setMethod] = useState<"password" | "token">("password");
+
  const [form, setForm] = useState({
    user: "",
    password: "",
+    token: "",
    instance: "",
  });

+  if (auth.status === "authenticated") {
+    return <Redirect href="/dashboard" />;
+  }
+
  return (
-    <View style={styles.container}>
-      <Text>Login</Text>
-      <View
-        style={{
-          flexDirection: "column",
-          justifyContent: "space-between",
-          marginVertical: 10,
-          gap: 10,
-        }}
+    <View className="flex-col justify-end h-full bg-primary">
+      <Text className="text-base-100 text-7xl font-bold ml-8">Login</Text>
+      <Svg
+        viewBox="0 0 1440 320"
+        width={Dimensions.get("screen").width}
+        height={100}
      >
-        <Input
-          className="w-72"
-          placeholder="Username"
-          value={form.user}
-          onChangeText={(text) => setForm({ ...form, user: text })}
-        />
-        <Input
-          className="w-72"
-          placeholder="Password"
-          secureTextEntry
-          value={form.password}
-          onChangeText={(text) => setForm({ ...form, password: text })}
+        <Path
+          fill={rawTheme[colorScheme as ThemeName]["base-100"]}
+          fill-opacity="1"
+          d="M0,256L48,234.7C96,213,192,171,288,176C384,181,480,235,576,266.7C672,299,768,309,864,277.3C960,245,1056,171,1152,122.7C1248,75,1344,53,1392,42.7L1440,32L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"
        />
+      </Svg>
+      <View className="flex-col justify-end h-1/3 bg-base-100 -mt-2 pb-10 gap-4 w-full px-4">
+        {method === "password" ? (
+          <>
+            <Input
+              className="w-full text-xl p-3 leading-tight"
+              textAlignVertical="center"
+              placeholder="Email or Username"
+              value={form.user}
+              onChangeText={(text) => setForm({ ...form, user: text })}
+            />
+
+            <Input
+              className="w-full text-xl p-3 leading-tight"
+              textAlignVertical="center"
+              placeholder="Password"
+              secureTextEntry
+              value={form.password}
+              onChangeText={(text) => setForm({ ...form, password: text })}
+            />
+          </>
+        ) : (
+          <Input
+            className="w-full text-xl p-3 leading-tight"
+            textAlignVertical="center"
+            placeholder="Access Token"
+            secureTextEntry
+            value={form.token}
+            onChangeText={(text) => setForm({ ...form, token: text })}
+          />
+        )}
+
+        <TouchableOpacity
+          onPress={() =>
+            setMethod(method === "password" ? "token" : "password")
+          }
+          className="w-fit mx-auto"
+        >
+          <Text className="text-primary w-fit text-center">
+            {method === "password"
+              ? "Login with Access Token instead"
+              : "Login with Username/Password instead"}
+          </Text>
+        </TouchableOpacity>
+
        <Button
          variant="accent"
+          size="lg"
          onPress={() =>
            signIn(
              form.user,
@@ -48,16 +95,10 @@ export default function HomeScreen() {
        >
          <Text className="text-white">Login</Text>
        </Button>
+        <TouchableOpacity className="w-fit mx-auto">
+          <Text className="text-neutral text-center w-fit">Need help?</Text>
+        </TouchableOpacity>
      </View>
    </View>
  );
 }
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    backgroundColor: "#ffffff",
-  },
-});
--- a/apps/mobile/components/ActionSheets/AddLinkSheet.tsx
+++ b/apps/mobile/components/ActionSheets/AddLinkSheet.tsx
@@ -1,23 +1,35 @@
-import { Text, View } from "react-native";
+import { Alert, Text, View } from "react-native";
 import { useRef, useState } from "react";
 import ActionSheet, { ActionSheetRef } from "react-native-actions-sheet";
 import Input from "@/components/ui/Input";
 import { Button } from "@/components/ui/Button";
 import { useAddLink } from "@linkwarden/router/links";
 import useAuthStore from "@/store/auth";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useColorScheme } from "nativewind";

 export default function AddLinkSheet() {
  const actionSheetRef = useRef<ActionSheetRef>(null);
  const { auth } = useAuthStore();
  const addLink = useAddLink(auth);
  const [link, setLink] = useState("");
+  const { colorScheme } = useColorScheme();

  return (
-    <ActionSheet ref={actionSheetRef} gestureEnabled>
+    <ActionSheet
+      ref={actionSheetRef}
+      gestureEnabled
+      indicatorStyle={{
+        backgroundColor: rawTheme[colorScheme as ThemeName]["neutral-content"],
+      }}
+      containerStyle={{
+        backgroundColor: rawTheme[colorScheme as ThemeName]["base-200"],
+      }}
+    >
      <View className="px-8 py-5">
        <Input
          placeholder="e.g. https://example.com"
-          className="mb-4"
+          className="mb-4 bg-base-100"
          value={link}
          onChangeText={setLink}
        />
@@ -32,6 +44,7 @@ export default function AddLinkSheet() {
                  setLink("");
                },
                onError: (error) => {
+                  Alert.alert("Error", "There was an error adding the link.");
                  console.error("Error adding link:", error);
                },
              }
@@ -51,7 +64,7 @@ export default function AddLinkSheet() {
          variant="outline"
          className="mb-2"
        >
-          <Text>Cancel</Text>
+          <Text className="text-base-content">Cancel</Text>
        </Button>
      </View>
    </ActionSheet>
--- a/apps/mobile/components/ActionSheets/EditLinkSheet.tsx
+++ b/apps/mobile/components/ActionSheets/EditLinkSheet.tsx
@@ -1,4 +1,4 @@
-import { View, Text } from "react-native";
+import { View, Text, Alert } from "react-native";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import ActionSheet, {
  FlatList,
@@ -16,8 +16,10 @@ import {
  CollectionIncludingMembersAndLinkCount,
  LinkIncludingShortenedCollectionAndTags,
 } from "@linkwarden/types";
-import { IconSymbol } from "../ui/IconSymbol";
 import { useCollections } from "@linkwarden/router/collections";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useColorScheme } from "nativewind";
+import { Folder, ChevronRight, Check } from "lucide-react-native";

 const Main = (props: SheetProps<"edit-link-sheet">) => {
  const { auth } = useAuthStore();
@@ -29,6 +31,7 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
  >(props.payload?.link);
  const editLink = useUpdateLink(auth);
  const router = useSheetRouter("edit-link-sheet");
+  const { colorScheme } = useColorScheme();

  useEffect(() => {
    if (params?.link) {
@@ -40,7 +43,7 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
    <View className="px-8 py-5">
      <Input
        placeholder="Name"
-        className="mb-4"
+        className="mb-4 bg-base-100"
        value={link?.name || ""}
        onChangeText={(text) => link?.id && setLink({ ...link, name: text })}
      />
@@ -48,7 +51,7 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
      {props.payload?.link?.url && (
        <Input
          placeholder="URL"
-          className="mb-4"
+          className="mb-4 bg-base-100"
          value={link?.url || ""}
          onChangeText={(text) => link?.id && setLink({ ...link, url: text })}
        />
@@ -60,16 +63,19 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
        onPress={() => router?.navigate("collections", { link })}
      >
        <View className="flex-row items-center gap-2 w-[90%]">
-          <IconSymbol
+          <Folder
            size={20}
-            name="folder.fill"
+            fill={link?.collection.color || "gray"}
            color={link?.collection.color || "gray"}
          />
-          <Text numberOfLines={1} className="w-[90%]">
+          <Text numberOfLines={1} className="w-[90%] text-base-content">
            {link?.collection.name}
          </Text>
        </View>
-        <IconSymbol size={16} name="chevron.right" color={"gray"} />
+        <ChevronRight
+          size={16}
+          color={rawTheme[colorScheme as ThemeName]["neutral"]}
+        />
      </Button>

      {/* <Button variant="input" className="mb-4 h-auto">
@@ -87,13 +93,14 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
        ) : (
          <Text className="text-gray-500">No tags</Text>
        )}
-        <IconSymbol size={16} name="chevron.right" color={"gray"} />
+        <ChevronRight size={16} color={"gray"} />
      </Button> */}

      <Input
        multiline
+        textAlignVertical="top"
        placeholder="Description"
-        className="mb-4 h-28"
+        className="mb-4 h-28 bg-base-100"
        value={link?.description || ""}
        onChangeText={(text) =>
          link?.id && setLink({ ...link, description: text })
@@ -107,7 +114,8 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
              SheetManager.hide("edit-link-sheet");
            },
            onError: (error) => {
-              console.error("Error adding link:", error);
+              Alert.alert("Error", "There was an error editing the link.");
+              console.error("Error editing link:", error);
            },
          })
        }
@@ -124,7 +132,7 @@ const Main = (props: SheetProps<"edit-link-sheet">) => {
        variant="outline"
        className="mb-2"
      >
-        <Text>Cancel</Text>
+        <Text className="text-base-content">Cancel</Text>
      </Button>
    </View>
  );
@@ -141,6 +149,7 @@ const Collections = () => {
  >("edit-link-sheet", "collections");
  const params = useSheetRouteParams("edit-link-sheet", "collections");
  const collections = useCollections(auth);
+  const { colorScheme } = useColorScheme();

  const filteredCollections = useMemo(() => {
    if (!collections.data) return [];
@@ -170,20 +179,23 @@ const Collections = () => {
      return (
        <Button variant="input" className="mb-2" onPress={onSelect}>
          <View className="flex-row items-center gap-2 w-[75%]">
-            <IconSymbol
+            <Folder
              size={20}
-              name="folder.fill"
+              fill={collection.color || "gray"}
              color={collection.color || "gray"}
            />
-            <Text numberOfLines={1} className="w-full">
+            <Text numberOfLines={1} className="w-full text-base-content">
              {collection.name}
            </Text>
          </View>
          <View className="flex-row items-center gap-2">
            {params.link?.collection.id === collection.id && (
-              <IconSymbol size={16} name="checkmark" color="" />
+              <Check
+                size={16}
+                color={rawTheme[colorScheme as ThemeName].primary}
+              />
            )}
-            <Text className="text-gray-600">
+            <Text className="text-neutral">
              {collection._count?.links ?? 0}
            </Text>
          </View>
@@ -197,7 +209,7 @@ const Collections = () => {
    <View className="px-8 py-5 max-h-[80vh]">
      <Input
        placeholder="Search collections"
-        className="mb-4"
+        className="mb-4 bg-base-100"
        value={searchQuery}
        onChangeText={setSearchQuery}
      />
@@ -207,7 +219,10 @@ const Collections = () => {
        keyExtractor={(e, i) => i.toString()}
        renderItem={renderItem}
        ListEmptyComponent={
-          <Text style={{ textAlign: "center", color: "#666", marginTop: 20 }}>
+          <Text
+            style={{ textAlign: "center", marginTop: 20 }}
+            className="text-neutral"
+          >
            No collections match “{searchQuery}”
          </Text>
        }
@@ -229,12 +244,20 @@ const routes: Route[] = [
 ];

 export default function EditLinkSheet() {
+  const { colorScheme } = useColorScheme();
+
  return (
    <ActionSheet
      gestureEnabled
+      indicatorStyle={{
+        backgroundColor: rawTheme[colorScheme as ThemeName]["neutral-content"],
+      }}
      enableRouterBackNavigation={true}
      routes={routes}
      initialRoute="main"
+      containerStyle={{
+        backgroundColor: rawTheme[colorScheme as ThemeName]["base-200"],
+      }}
    />
  );
 }
--- a/apps/mobile/components/ActionSheets/Sheets.tsx
+++ b/apps/mobile/components/ActionSheets/Sheets.tsx
@@ -5,10 +5,7 @@ import {
 } from "react-native-actions-sheet";
 import AddLinkSheet from "./AddLinkSheet";
 import EditLinkSheet from "./EditLinkSheet";
-import {
-  CollectionIncludingMembersAndLinkCount,
-  LinkIncludingShortenedCollectionAndTags,
-} from "@linkwarden/types";
+import { LinkIncludingShortenedCollectionAndTags } from "@linkwarden/types";

 registerSheet("add-link-sheet", AddLinkSheet);
 registerSheet("edit-link-sheet", EditLinkSheet);
--- a/apps/mobile/components/DashboardItem.tsx
+++ b/apps/mobile/components/DashboardItem.tsx
@@ -1,6 +1,4 @@
 import { Text, View } from "react-native";
-import { IconSymbol } from "./ui/IconSymbol";
-import { SFSymbols6_0 } from "sf-symbols-typescript";

 export default function DashboardItem({
  name,
@@ -10,23 +8,28 @@ export default function DashboardItem({
 }: {
  name: string;
  value: number;
-  icon: SFSymbols6_0;
+  icon: React.ReactNode;
  color: string;
 }) {
  return (
-    <View className="flex-1 flex-col gap-2 rounded-xl bg-white p-3">
+    <View className="flex-1 flex-col gap-2 rounded-xl bg-base-200 p-3">
      <View className="flex-row justify-between">
-        <View className="flex-col gap-2 items-start">
-          <IconSymbol name={icon} size={40} color={color} />
+        <View
+          className="flex-col gap-2 rounded-full aspect-square flex justify-center items-center"
+          style={{
+            backgroundColor: color,
+          }}
+        >
+          {icon}
        </View>
        <Text
-          className="text-4xl text-primary mt-0.5 text-right max-w-[75%]"
+          className="text-4xl text-base-content mt-0.5 text-right max-w-[75%]"
          numberOfLines={1}
        >
          {value || 0}
        </Text>
      </View>
-      <Text className="font-semibold text-gray-500">{name}</Text>
+      <Text className="font-semibold text-neutral">{name}</Text>
    </View>
  );
 }
--- a/apps/mobile/components/ElementNotSupported.tsx
+++ b/apps/mobile/components/ElementNotSupported.tsx
@@ -10,8 +10,8 @@ export default function ElementNotSupported({
  onPress: () => void;
 }) {
  return (
-    <View className="border-y border-gray-200 my-2 py-5 flex justify-center items-center">
-      <Text>{message}</Text>
+    <View className="border-y border-neutral-content my-2 py-5 flex justify-center items-center">
+      <Text className="text-neutral">{message}</Text>
      <Button onPress={onPress} title={buttonTitle} />
    </View>
  );
--- a/apps/mobile/components/LinkListing.tsx
+++ b/apps/mobile/components/LinkListing.tsx
@@ -1,7 +1,6 @@
 import { View, Text, Image, Pressable, Platform, Alert } from "react-native";
 import { decode } from "html-entities";
 import { LinkIncludingShortenedCollectionAndTags } from "@linkwarden/types";
-import { IconSymbol } from "@/components/ui/IconSymbol";
 import { ArchivedFormat } from "@linkwarden/types";
 import {
  atLeastOneFormatAvailable,
@@ -15,6 +14,10 @@ import { SheetManager } from "react-native-actions-sheet";
 import * as Clipboard from "expo-clipboard";
 import { cn } from "@linkwarden/lib/utils";
 import { useUser } from "@linkwarden/router/user";
+import { rawTheme, ThemeName } from "@/lib/colors";
+import { useColorScheme } from "nativewind";
+import { CalendarDays, Folder } from "lucide-react-native";
+import useDataStore from "@/store/data";

 type Props = {
  link: LinkIncludingShortenedCollectionAndTags;
@@ -26,6 +29,8 @@ const LinkListing = ({ link, dashboard }: Props) => {
  const router = useRouter();
  const updateLink = useUpdateLink(auth);
  const { data: user } = useUser(auth);
+  const { colorScheme } = useColorScheme();
+  const { data } = useDataStore();

  const deleteLink = useDeleteLink(auth);

@@ -44,14 +49,23 @@ const LinkListing = ({ link, dashboard }: Props) => {
      <ContextMenu.Trigger asChild>
        <Pressable
          className={cn(
-            "p-5 flex-row justify-between bg-white",
-            Platform.OS === "android"
-              ? "active:bg-white"
-              : "active:bg-gray-200",
+            "p-5 flex-row justify-between",
+            dashboard ? "bg-base-200" : "bg-base-100",
+            Platform.OS !== "android" && "active:bg-base-200/50",
            dashboard && "rounded-xl"
          )}
-          onPress={() => router.push(`/links/${link.id}`)}
-          android_ripple={{ color: "#ddd", borderless: false }}
+          onLongPress={() => {}}
+          onPress={() =>
+            router.push(
+              data.preferredFormat
+                ? `/links/${link.id}?format=${data.preferredFormat}`
+                : `/links/${link.id}`
+            )
+          }
+          android_ripple={{
+            color: colorScheme === "dark" ? "rgba(255,255,255,0.2)" : "#ddd",
+            borderless: false,
+          }}
        >
          <View
            className={cn(
@@ -60,23 +74,32 @@ const LinkListing = ({ link, dashboard }: Props) => {
            )}
          >
            <View className="w-[65%] flex-col justify-between">
-              <Text numberOfLines={2} className="font-medium text-lg">
+              <Text
+                numberOfLines={2}
+                className="font-medium text-lg text-base-content"
+              >
                {decode(link.name || link.description || link.url)}
              </Text>

              {shortendURL && (
-                <Text numberOfLines={1} className="mt-1.5 font-light text-sm">
+                <Text
+                  numberOfLines={1}
+                  className="mt-1.5 font-light text-sm text-base-content"
+                >
                  {shortendURL}
                </Text>
              )}

              <View className="flex flex-row gap-1 items-center mt-1.5 pr-1.5 self-start rounded-md">
-                <IconSymbol
-                  name="folder.fill"
+                <Folder
                  size={16}
+                  fill={link.collection.color || ""}
                  color={link.collection.color || ""}
                />
-                <Text numberOfLines={1} className="font-light text-xs">
+                <Text
+                  numberOfLines={1}
+                  className="font-light text-xs text-base-content"
+                >
                  {link.collection.name}
                </Text>
              </View>
@@ -99,8 +122,14 @@ const LinkListing = ({ link, dashboard }: Props) => {
                )}
              </View>
              <View className="flex flex-row gap-1 items-center mt-5 self-start">
-                <IconSymbol name="calendar" size={16} color="gray" />
-                <Text numberOfLines={1} className="font-light text-xs">
+                <CalendarDays
+                  size={16}
+                  color={rawTheme[colorScheme as ThemeName]["neutral"]}
+                />
+                <Text
+                  numberOfLines={1}
+                  className="font-light text-xs text-base-content"
+                >
                  {new Date(link.createdAt as string).toLocaleString("en-US", {
                    year: "numeric",
                    month: "short",
--- a/apps/mobile/components/ui/Button.tsx
+++ b/apps/mobile/components/ui/Button.tsx
@@ -15,13 +15,13 @@ const buttonVariants = cva(
    variants: {
      variant: {
        default: "bg-slate-500 text-white",
-        primary: "bg-primary text-primary-foreground",
-        accent: "bg-violet-600 border border-violet-400 text-white",
+        primary: "bg-primary text-base-content",
+        accent: "bg-accent border border-violet-400 text-white",
        destructive: "bg-destructive text-white",
-        outline: "border",
+        outline: "border border-base-content",
        secondary: "bg-secondary text-secondary-foreground",
        input:
-          "bg-gray-100 rounded-lg px-4 justify-between flex-row font-normal",
+          "bg-base-100 rounded-lg px-4 justify-between flex-row font-normal",
        metal: "bg-neutral-content text-base-content border border-neutral/30",
        ghost: "",
        simple: "bg-base-200",
@@ -30,7 +30,7 @@ const buttonVariants = cva(
      size: {
        default: "h-10 px-4 py-2",
        sm: "h-8 px-2 py-1 text-xs",
-        lg: "h-11 px-8",
+        lg: "h-12 px-8",
        full: "w-full px-4 py-2",
        icon: "h-8 w-8",
      },
--- a/apps/mobile/components/ui/Input.tsx
+++ b/apps/mobile/components/ui/Input.tsx
@@ -7,7 +7,10 @@ const Input = forwardRef<TextInput, TextInputProps>(
    return (
      <TextInput
        ref={ref}
-        className={cn("bg-gray-100 rounded-lg px-4 py-2", className)}
+        className={cn(
+          "bg-base-200 text-base-content rounded-lg px-4 py-2",
+          className
+        )}
        {...props}
      />
    );
--- a/apps/mobile/ios/.gitignore
+++ b/apps/mobile/ios/.gitignore
@@ -1,30 +0,0 @@
-# OSX
-#
-.DS_Store
-
-# Xcode
-#
-build/
-*.pbxuser
-!default.pbxuser
-*.mode1v3
-!default.mode1v3
-*.mode2v3
-!default.mode2v3
-*.perspectivev3
-!default.perspectivev3
-xcuserdata
-*.xccheckout
-*.moved-aside
-DerivedData
-*.hmap
-*.ipa
-*.xcuserstate
-project.xcworkspace
-.xcode.env.local
-
-# Bundle artifacts
-*.jsbundle
-
-# CocoaPods
-/Pods/
--- a/apps/mobile/ios/.xcode.env
+++ b/apps/mobile/ios/.xcode.env
@@ -1,11 +0,0 @@
-# This `.xcode.env` file is versioned and is used to source the environment
-# used when running script phases inside Xcode.
-# To customize your local environment, you can create an `.xcode.env.local`
-# file that is not versioned.
-
-# NODE_BINARY variable contains the PATH to the node executable.
-#
-# Customize the NODE_BINARY variable here.
-# For example, to use nvm with brew, add the following line
-# . "$(brew --prefix nvm)/nvm.sh" --no-use
-export NODE_BINARY=$(command -v node)
--- a/apps/mobile/ios/Podfile
+++ b/apps/mobile/ios/Podfile
@@ -1,66 +0,0 @@
-require File.join(File.dirname(`node --print "require.resolve('expo/package.json')"`), "scripts/autolinking")
-require File.join(File.dirname(`node --print "require.resolve('react-native/package.json')"`), "scripts/react_native_pods")
-
-require 'json'
-podfile_properties = JSON.parse(File.read(File.join(__dir__, 'Podfile.properties.json'))) rescue {}
-
-ENV['RCT_NEW_ARCH_ENABLED'] = podfile_properties['newArchEnabled'] == 'true' ? '1' : '0'
-ENV['EX_DEV_CLIENT_NETWORK_INSPECTOR'] = podfile_properties['EX_DEV_CLIENT_NETWORK_INSPECTOR']
-
-platform :ios, podfile_properties['ios.deploymentTarget'] || '15.1'
-install! 'cocoapods',
-  :deterministic_uuids => false
-
-prepare_react_native_project!
-
-target 'mobileapp' do
-  use_expo_modules!
-
-  if ENV['EXPO_USE_COMMUNITY_AUTOLINKING'] == '1'
-    config_command = ['node', '-e', "process.argv=['', '', 'config'];require('@react-native-community/cli').run()"];
-  else
-    config_command = [
-      'node',
-      '--no-warnings',
-      '--eval',
-      'require(require.resolve(\'expo-modules-autolinking\', { paths: [require.resolve(\'expo/package.json\')] }))(process.argv.slice(1))',
-      'react-native-config',
-      '--json',
-      '--platform',
-      'ios'
-    ]
-  end
-
-  config = use_native_modules!(config_command)
-
-  use_frameworks! :linkage => podfile_properties['ios.useFrameworks'].to_sym if podfile_properties['ios.useFrameworks']
-  use_frameworks! :linkage => ENV['USE_FRAMEWORKS'].to_sym if ENV['USE_FRAMEWORKS']
-
-  use_react_native!(
-    :path => config[:reactNativePath],
-    :hermes_enabled => podfile_properties['expo.jsEngine'] == nil || podfile_properties['expo.jsEngine'] == 'hermes',
-    # An absolute path to your application root.
-    :app_path => "#{Pod::Config.instance.installation_root}/..",
-    :privacy_file_aggregation_enabled => podfile_properties['apple.privacyManifestAggregationEnabled'] != 'false',
-  )
-
-  post_install do |installer|
-    react_native_post_install(
-      installer,
-      config[:reactNativePath],
-      :mac_catalyst_enabled => false,
-      :ccache_enabled => podfile_properties['apple.ccacheEnabled'] == 'true',
-    )
-
-    # This is necessary for Xcode 14, because it signs resource bundles by default
-    # when building for devices.
-    installer.target_installation_results.pod_target_installation_results
-      .each do |pod_name, target_installation_result|
-      target_installation_result.resource_bundle_targets.each do |resource_bundle_target|
-        resource_bundle_target.build_configurations.each do |config|
-          config.build_settings['CODE_SIGNING_ALLOWED'] = 'NO'
-        end
-      end
-    end
-  end
-end
--- a/apps/mobile/ios/Podfile.lock
+++ b/apps/mobile/ios/Podfile.lock
--- a/apps/mobile/ios/Podfile.properties.json
+++ b/apps/mobile/ios/Podfile.properties.json
@@ -1,5 +0,0 @@
-{
-  "expo.jsEngine": "hermes",
-  "EX_DEV_CLIENT_NETWORK_INSPECTOR": "true",
-  "newArchEnabled": "true"
-}
--- a/apps/mobile/ios/mobileapp.xcodeproj/project.pbxproj
+++ b/apps/mobile/ios/mobileapp.xcodeproj/project.pbxproj
@@ -1,544 +0,0 @@
-// !$*UTF8*$!
-{
-	archiveVersion = 1;
-	classes = {
-	};
-	objectVersion = 46;
-	objects = {
-
-/* Begin PBXBuildFile section */
-		13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB01A68108700A75B9A /* AppDelegate.mm */; };
-		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
-		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
-		3E461D99554A48A4959DE609 /* SplashScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = AA286B85B6C04FC6940260E9 /* SplashScreen.storyboard */; };
-		96905EF65AED1B983A6B3ABC /* libPods-mobileapp.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 58EEBF8E8E6FB1BC6CAF49B5 /* libPods-mobileapp.a */; };
-		98F5742C729033F29C656840 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = E49C0DC702346D367B33AAEF /* PrivacyInfo.xcprivacy */; };
-		B18059E884C0ABDD17F3DC3D /* ExpoModulesProvider.swift in Sources */ = {isa = PBXBuildFile; fileRef = FAC715A2D49A985799AEE119 /* ExpoModulesProvider.swift */; };
-		BB2F792D24A3F905000567C9 /* Expo.plist in Resources */ = {isa = PBXBuildFile; fileRef = BB2F792C24A3F905000567C9 /* Expo.plist */; };
-		DD111B9AA6FE4075B8E1E6D2 /* noop-file.swift in Sources */ = {isa = PBXBuildFile; fileRef = 588141A975DE4C1BBF1048E5 /* noop-file.swift */; };
-/* End PBXBuildFile section */
-
-/* Begin PBXFileReference section */
-		13B07F961A680F5B00A75B9A /* mobileapp.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = mobileapp.app; sourceTree = BUILT_PRODUCTS_DIR; };
-		13B07FAF1A68108700A75B9A /* AppDelegate.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; name = AppDelegate.h; path = mobileapp/AppDelegate.h; sourceTree = "<group>"; };
-		13B07FB01A68108700A75B9A /* AppDelegate.mm */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.objcpp; name = AppDelegate.mm; path = mobileapp/AppDelegate.mm; sourceTree = "<group>"; };
-		13B07FB51A68108700A75B9A /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; name = Images.xcassets; path = mobileapp/Images.xcassets; sourceTree = "<group>"; };
-		13B07FB61A68108700A75B9A /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = Info.plist; path = mobileapp/Info.plist; sourceTree = "<group>"; };
-		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = mobileapp/main.m; sourceTree = "<group>"; };
-		51E9021565CB454F93B79E34 /* mobileapp-Bridging-Header.h */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 4; includeInIndex = 0; lastKnownFileType = sourcecode.c.h; name = "mobileapp-Bridging-Header.h"; path = "mobileapp/mobileapp-Bridging-Header.h"; sourceTree = "<group>"; };
-		588141A975DE4C1BBF1048E5 /* noop-file.swift */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 4; includeInIndex = 0; lastKnownFileType = sourcecode.swift; name = "noop-file.swift"; path = "mobileapp/noop-file.swift"; sourceTree = "<group>"; };
-		58EEBF8E8E6FB1BC6CAF49B5 /* libPods-mobileapp.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-mobileapp.a"; sourceTree = BUILT_PRODUCTS_DIR; };
-		6C2E3173556A471DD304B334 /* Pods-mobileapp.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-mobileapp.debug.xcconfig"; path = "Target Support Files/Pods-mobileapp/Pods-mobileapp.debug.xcconfig"; sourceTree = "<group>"; };
-		7A4D352CD337FB3A3BF06240 /* Pods-mobileapp.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-mobileapp.release.xcconfig"; path = "Target Support Files/Pods-mobileapp/Pods-mobileapp.release.xcconfig"; sourceTree = "<group>"; };
-		AA286B85B6C04FC6940260E9 /* SplashScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = SplashScreen.storyboard; path = mobileapp/SplashScreen.storyboard; sourceTree = "<group>"; };
-		BB2F792C24A3F905000567C9 /* Expo.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Expo.plist; sourceTree = "<group>"; };
-		E49C0DC702346D367B33AAEF /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; includeInIndex = 1; name = PrivacyInfo.xcprivacy; path = mobileapp/PrivacyInfo.xcprivacy; sourceTree = "<group>"; };
-		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
-		FAC715A2D49A985799AEE119 /* ExpoModulesProvider.swift */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = sourcecode.swift; name = ExpoModulesProvider.swift; path = "Pods/Target Support Files/Pods-mobileapp/ExpoModulesProvider.swift"; sourceTree = "<group>"; };
-/* End PBXFileReference section */
-
-/* Begin PBXFrameworksBuildPhase section */
-		13B07F8C1A680F5B00A75B9A /* Frameworks */ = {
-			isa = PBXFrameworksBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-				96905EF65AED1B983A6B3ABC /* libPods-mobileapp.a in Frameworks */,
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
-/* End PBXFrameworksBuildPhase section */
-
-/* Begin PBXGroup section */
-		13B07FAE1A68108700A75B9A /* mobileapp */ = {
-			isa = PBXGroup;
-			children = (
-				BB2F792B24A3F905000567C9 /* Supporting */,
-				13B07FAF1A68108700A75B9A /* AppDelegate.h */,
-				13B07FB01A68108700A75B9A /* AppDelegate.mm */,
-				13B07FB51A68108700A75B9A /* Images.xcassets */,
-				13B07FB61A68108700A75B9A /* Info.plist */,
-				13B07FB71A68108700A75B9A /* main.m */,
-				AA286B85B6C04FC6940260E9 /* SplashScreen.storyboard */,
-				588141A975DE4C1BBF1048E5 /* noop-file.swift */,
-				51E9021565CB454F93B79E34 /* mobileapp-Bridging-Header.h */,
-				E49C0DC702346D367B33AAEF /* PrivacyInfo.xcprivacy */,
-			);
-			name = mobileapp;
-			sourceTree = "<group>";
-		};
-		2D16E6871FA4F8E400B85C8A /* Frameworks */ = {
-			isa = PBXGroup;
-			children = (
-				ED297162215061F000B7C4FE /* JavaScriptCore.framework */,
-				58EEBF8E8E6FB1BC6CAF49B5 /* libPods-mobileapp.a */,
-			);
-			name = Frameworks;
-			sourceTree = "<group>";
-		};
-		832341AE1AAA6A7D00B99B32 /* Libraries */ = {
-			isa = PBXGroup;
-			children = (
-			);
-			name = Libraries;
-			sourceTree = "<group>";
-		};
-		83CBB9F61A601CBA00E9B192 = {
-			isa = PBXGroup;
-			children = (
-				13B07FAE1A68108700A75B9A /* mobileapp */,
-				832341AE1AAA6A7D00B99B32 /* Libraries */,
-				83CBBA001A601CBA00E9B192 /* Products */,
-				2D16E6871FA4F8E400B85C8A /* Frameworks */,
-				D65327D7A22EEC0BE12398D9 /* Pods */,
-				D7E4C46ADA2E9064B798F356 /* ExpoModulesProviders */,
-			);
-			indentWidth = 2;
-			sourceTree = "<group>";
-			tabWidth = 2;
-			usesTabs = 0;
-		};
-		83CBBA001A601CBA00E9B192 /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				13B07F961A680F5B00A75B9A /* mobileapp.app */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
-		92DBD88DE9BF7D494EA9DA96 /* mobileapp */ = {
-			isa = PBXGroup;
-			children = (
-				FAC715A2D49A985799AEE119 /* ExpoModulesProvider.swift */,
-			);
-			name = mobileapp;
-			sourceTree = "<group>";
-		};
-		BB2F792B24A3F905000567C9 /* Supporting */ = {
-			isa = PBXGroup;
-			children = (
-				BB2F792C24A3F905000567C9 /* Expo.plist */,
-			);
-			name = Supporting;
-			path = mobileapp/Supporting;
-			sourceTree = "<group>";
-		};
-		D65327D7A22EEC0BE12398D9 /* Pods */ = {
-			isa = PBXGroup;
-			children = (
-				6C2E3173556A471DD304B334 /* Pods-mobileapp.debug.xcconfig */,
-				7A4D352CD337FB3A3BF06240 /* Pods-mobileapp.release.xcconfig */,
-			);
-			path = Pods;
-			sourceTree = "<group>";
-		};
-		D7E4C46ADA2E9064B798F356 /* ExpoModulesProviders */ = {
-			isa = PBXGroup;
-			children = (
-				92DBD88DE9BF7D494EA9DA96 /* mobileapp */,
-			);
-			name = ExpoModulesProviders;
-			sourceTree = "<group>";
-		};
-/* End PBXGroup section */
-
-/* Begin PBXNativeTarget section */
-		13B07F861A680F5B00A75B9A /* mobileapp */ = {
-			isa = PBXNativeTarget;
-			buildConfigurationList = 13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "mobileapp" */;
-			buildPhases = (
-				08A4A3CD28434E44B6B9DE2E /* [CP] Check Pods Manifest.lock */,
-				33C9CB6682BF7BB3053F48FC /* [Expo] Configure project */,
-				13B07F871A680F5B00A75B9A /* Sources */,
-				13B07F8C1A680F5B00A75B9A /* Frameworks */,
-				13B07F8E1A680F5B00A75B9A /* Resources */,
-				00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
-				800E24972A6A228C8D4807E9 /* [CP] Copy Pods Resources */,
-				3C1F4EFB27CCA985BA2789D2 /* [CP] Embed Pods Frameworks */,
-			);
-			buildRules = (
-			);
-			dependencies = (
-			);
-			name = mobileapp;
-			productName = mobileapp;
-			productReference = 13B07F961A680F5B00A75B9A /* mobileapp.app */;
-			productType = "com.apple.product-type.application";
-		};
-/* End PBXNativeTarget section */
-
-/* Begin PBXProject section */
-		83CBB9F71A601CBA00E9B192 /* Project object */ = {
-			isa = PBXProject;
-			attributes = {
-				LastUpgradeCheck = 1130;
-				TargetAttributes = {
-					13B07F861A680F5B00A75B9A = {
-						LastSwiftMigration = 1250;
-					};
-				};
-			};
-			buildConfigurationList = 83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "mobileapp" */;
-			compatibilityVersion = "Xcode 3.2";
-			developmentRegion = en;
-			hasScannedForEncodings = 0;
-			knownRegions = (
-				en,
-				Base,
-			);
-			mainGroup = 83CBB9F61A601CBA00E9B192;
-			productRefGroup = 83CBBA001A601CBA00E9B192 /* Products */;
-			projectDirPath = "";
-			projectRoot = "";
-			targets = (
-				13B07F861A680F5B00A75B9A /* mobileapp */,
-			);
-		};
-/* End PBXProject section */
-
-/* Begin PBXResourcesBuildPhase section */
-		13B07F8E1A680F5B00A75B9A /* Resources */ = {
-			isa = PBXResourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-				BB2F792D24A3F905000567C9 /* Expo.plist in Resources */,
-				13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
-				3E461D99554A48A4959DE609 /* SplashScreen.storyboard in Resources */,
-				98F5742C729033F29C656840 /* PrivacyInfo.xcprivacy in Resources */,
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
-/* End PBXResourcesBuildPhase section */
-
-/* Begin PBXShellScriptBuildPhase section */
-		00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */ = {
-			isa = PBXShellScriptBuildPhase;
-			alwaysOutOfDate = 1;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-			);
-			name = "Bundle React Native code and images";
-			outputPaths = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "if [[ -f \"$PODS_ROOT/../.xcode.env\" ]]; then\n  source \"$PODS_ROOT/../.xcode.env\"\nfi\nif [[ -f \"$PODS_ROOT/../.xcode.env.local\" ]]; then\n  source \"$PODS_ROOT/../.xcode.env.local\"\nfi\n\n# The project root by default is one level up from the ios directory\nexport PROJECT_ROOT=\"$PROJECT_DIR\"/..\n\nif [[ \"$CONFIGURATION\" = *Debug* ]]; then\n  export SKIP_BUNDLING=1\nfi\nif [[ -z \"$ENTRY_FILE\" ]]; then\n  # Set the entry JS file using the bundler's entry resolution.\n  export ENTRY_FILE=\"$(\"$NODE_BINARY\" -e \"require('expo/scripts/resolveAppEntry')\" \"$PROJECT_ROOT\" ios absolute | tail -n 1)\"\nfi\n\nif [[ -z \"$CLI_PATH\" ]]; then\n  # Use Expo CLI\n  export CLI_PATH=\"$(\"$NODE_BINARY\" --print \"require.resolve('@expo/cli', { paths: [require.resolve('expo/package.json')] })\")\"\nfi\nif [[ -z \"$BUNDLE_COMMAND\" ]]; then\n  # Default Expo CLI command for bundling\n  export BUNDLE_COMMAND=\"export:embed\"\nfi\n\n# Source .xcode.env.updates if it exists to allow\n# SKIP_BUNDLING to be unset if needed\nif [[ -f \"$PODS_ROOT/../.xcode.env.updates\" ]]; then\n  source \"$PODS_ROOT/../.xcode.env.updates\"\nfi\n# Source local changes to allow overrides\n# if needed\nif [[ -f \"$PODS_ROOT/../.xcode.env.local\" ]]; then\n  source \"$PODS_ROOT/../.xcode.env.local\"\nfi\n\n`\"$NODE_BINARY\" --print \"require('path').dirname(require.resolve('react-native/package.json')) + '/scripts/react-native-xcode.sh'\"`\n\n";
-		};
-		08A4A3CD28434E44B6B9DE2E /* [CP] Check Pods Manifest.lock */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputFileListPaths = (
-			);
-			inputPaths = (
-				"${PODS_PODFILE_DIR_PATH}/Podfile.lock",
-				"${PODS_ROOT}/Manifest.lock",
-			);
-			name = "[CP] Check Pods Manifest.lock";
-			outputFileListPaths = (
-			);
-			outputPaths = (
-				"$(DERIVED_FILE_DIR)/Pods-mobileapp-checkManifestLockResult.txt",
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "diff \"${PODS_PODFILE_DIR_PATH}/Podfile.lock\" \"${PODS_ROOT}/Manifest.lock\" > /dev/null\nif [ $? != 0 ] ; then\n    # print error to STDERR\n    echo \"error: The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.\" >&2\n    exit 1\nfi\n# This output is used by Xcode 'outputs' to avoid re-running this script phase.\necho \"SUCCESS\" > \"${SCRIPT_OUTPUT_FILE_0}\"\n";
-			showEnvVarsInLog = 0;
-		};
-		33C9CB6682BF7BB3053F48FC /* [Expo] Configure project */ = {
-			isa = PBXShellScriptBuildPhase;
-			alwaysOutOfDate = 1;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputFileListPaths = (
-			);
-			inputPaths = (
-			);
-			name = "[Expo] Configure project";
-			outputFileListPaths = (
-			);
-			outputPaths = (
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "# This script configures Expo modules and generates the modules provider file.\nbash -l -c \"./Pods/Target\\ Support\\ Files/Pods-mobileapp/expo-configure-project.sh\"\n";
-		};
-		3C1F4EFB27CCA985BA2789D2 /* [CP] Embed Pods Frameworks */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-mobileapp/Pods-mobileapp-frameworks.sh",
-				"${PODS_XCFRAMEWORKS_BUILD_DIR}/hermes-engine/Pre-built/hermes.framework/hermes",
-			);
-			name = "[CP] Embed Pods Frameworks";
-			outputPaths = (
-				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/hermes.framework",
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-mobileapp/Pods-mobileapp-frameworks.sh\"\n";
-			showEnvVarsInLog = 0;
-		};
-		800E24972A6A228C8D4807E9 /* [CP] Copy Pods Resources */ = {
-			isa = PBXShellScriptBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-			);
-			inputPaths = (
-				"${PODS_ROOT}/Target Support Files/Pods-mobileapp/Pods-mobileapp-resources.sh",
-				"${PODS_CONFIGURATION_BUILD_DIR}/EXConstants/EXConstants.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/EXConstants/ExpoConstants_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/ExpoFileSystem/ExpoFileSystem_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/ExpoSystemUI/ExpoSystemUI_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/RCT-Folly/RCT-Folly_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/React-Core/React-Core_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/React-cxxreact/React-cxxreact_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/boost/boost_privacy.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/expo-dev-launcher/EXDevLauncher.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/expo-dev-menu/EXDevMenu.bundle",
-				"${PODS_CONFIGURATION_BUILD_DIR}/glog/glog_privacy.bundle",
-			);
-			name = "[CP] Copy Pods Resources";
-			outputPaths = (
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/EXConstants.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/ExpoConstants_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/ExpoFileSystem_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/ExpoSystemUI_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/RCT-Folly_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/React-Core_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/React-cxxreact_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/boost_privacy.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/EXDevLauncher.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/EXDevMenu.bundle",
-				"${TARGET_BUILD_DIR}/${UNLOCALIZED_RESOURCES_FOLDER_PATH}/glog_privacy.bundle",
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-			shellPath = /bin/sh;
-			shellScript = "\"${PODS_ROOT}/Target Support Files/Pods-mobileapp/Pods-mobileapp-resources.sh\"\n";
-			showEnvVarsInLog = 0;
-		};
-/* End PBXShellScriptBuildPhase section */
-
-/* Begin PBXSourcesBuildPhase section */
-		13B07F871A680F5B00A75B9A /* Sources */ = {
-			isa = PBXSourcesBuildPhase;
-			buildActionMask = 2147483647;
-			files = (
-				13B07FBC1A68108700A75B9A /* AppDelegate.mm in Sources */,
-				13B07FC11A68108700A75B9A /* main.m in Sources */,
-				B18059E884C0ABDD17F3DC3D /* ExpoModulesProvider.swift in Sources */,
-				DD111B9AA6FE4075B8E1E6D2 /* noop-file.swift in Sources */,
-			);
-			runOnlyForDeploymentPostprocessing = 0;
-		};
-/* End PBXSourcesBuildPhase section */
-
-/* Begin XCBuildConfiguration section */
-		13B07F941A680F5B00A75B9A /* Debug */ = {
-			isa = XCBuildConfiguration;
-			baseConfigurationReference = 6C2E3173556A471DD304B334 /* Pods-mobileapp.debug.xcconfig */;
-			buildSettings = {
-				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
-				CLANG_ENABLE_MODULES = YES;
-				CODE_SIGN_ENTITLEMENTS = mobileapp/mobileapp.entitlements;
-				CURRENT_PROJECT_VERSION = 1;
-				ENABLE_BITCODE = NO;
-				GCC_PREPROCESSOR_DEFINITIONS = (
-					"$(inherited)",
-					"FB_SONARKIT_ENABLED=1",
-				);
-				INFOPLIST_FILE = mobileapp/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 15.1;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.0;
-				OTHER_LDFLAGS = (
-					"$(inherited)",
-					"-ObjC",
-					"-lc++",
-				);
-				OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_DEBUG";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.mobile-app";
-				PRODUCT_NAME = mobileapp;
-				SWIFT_OBJC_BRIDGING_HEADER = "mobileapp/mobileapp-Bridging-Header.h";
-				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
-				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
-				VERSIONING_SYSTEM = "apple-generic";
-			};
-			name = Debug;
-		};
-		13B07F951A680F5B00A75B9A /* Release */ = {
-			isa = XCBuildConfiguration;
-			baseConfigurationReference = 7A4D352CD337FB3A3BF06240 /* Pods-mobileapp.release.xcconfig */;
-			buildSettings = {
-				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
-				CLANG_ENABLE_MODULES = YES;
-				CODE_SIGN_ENTITLEMENTS = mobileapp/mobileapp.entitlements;
-				CURRENT_PROJECT_VERSION = 1;
-				INFOPLIST_FILE = mobileapp/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 15.1;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.0;
-				OTHER_LDFLAGS = (
-					"$(inherited)",
-					"-ObjC",
-					"-lc++",
-				);
-				OTHER_SWIFT_FLAGS = "$(inherited) -D EXPO_CONFIGURATION_RELEASE";
-				PRODUCT_BUNDLE_IDENTIFIER = "com.anonymous.mobile-app";
-				PRODUCT_NAME = mobileapp;
-				SWIFT_OBJC_BRIDGING_HEADER = "mobileapp/mobileapp-Bridging-Header.h";
-				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
-				VERSIONING_SYSTEM = "apple-generic";
-			};
-			name = Release;
-		};
-		83CBBA201A601CBA00E9B192 /* Debug */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				ALWAYS_SEARCH_USER_PATHS = NO;
-				CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
-				CLANG_CXX_LANGUAGE_STANDARD = "c++20";
-				CLANG_CXX_LIBRARY = "libc++";
-				CLANG_ENABLE_MODULES = YES;
-				CLANG_ENABLE_OBJC_ARC = YES;
-				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
-				CLANG_WARN_BOOL_CONVERSION = YES;
-				CLANG_WARN_COMMA = YES;
-				CLANG_WARN_CONSTANT_CONVERSION = YES;
-				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
-				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
-				CLANG_WARN_EMPTY_BODY = YES;
-				CLANG_WARN_ENUM_CONVERSION = YES;
-				CLANG_WARN_INFINITE_RECURSION = YES;
-				CLANG_WARN_INT_CONVERSION = YES;
-				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
-				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
-				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
-				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
-				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
-				CLANG_WARN_STRICT_PROTOTYPES = YES;
-				CLANG_WARN_SUSPICIOUS_MOVE = YES;
-				CLANG_WARN_UNREACHABLE_CODE = YES;
-				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
-				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
-				COPY_PHASE_STRIP = NO;
-				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				ENABLE_TESTABILITY = YES;
-				GCC_C_LANGUAGE_STANDARD = gnu99;
-				GCC_DYNAMIC_NO_PIC = NO;
-				GCC_NO_COMMON_BLOCKS = YES;
-				GCC_OPTIMIZATION_LEVEL = 0;
-				GCC_PREPROCESSOR_DEFINITIONS = (
-					"DEBUG=1",
-					"$(inherited)",
-				);
-				GCC_SYMBOLS_PRIVATE_EXTERN = NO;
-				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
-				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
-				GCC_WARN_UNDECLARED_SELECTOR = YES;
-				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
-				GCC_WARN_UNUSED_FUNCTION = YES;
-				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 15.1;
-				LD_RUNPATH_SEARCH_PATHS = "/usr/lib/swift $(inherited)";
-				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift\"$(inherited)\"";
-				MTL_ENABLE_DEBUG_INFO = YES;
-				ONLY_ACTIVE_ARCH = YES;
-				OTHER_LDFLAGS = (
-					"$(inherited)",
-					" ",
-				);
-				REACT_NATIVE_PATH = "${PODS_ROOT}/../../../../node_modules/react-native";
-				SDKROOT = iphoneos;
-				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "$(inherited) DEBUG";
-				USE_HERMES = true;
-			};
-			name = Debug;
-		};
-		83CBBA211A601CBA00E9B192 /* Release */ = {
-			isa = XCBuildConfiguration;
-			buildSettings = {
-				ALWAYS_SEARCH_USER_PATHS = NO;
-				CLANG_ANALYZER_LOCALIZABILITY_NONLOCALIZED = YES;
-				CLANG_CXX_LANGUAGE_STANDARD = "c++20";
-				CLANG_CXX_LIBRARY = "libc++";
-				CLANG_ENABLE_MODULES = YES;
-				CLANG_ENABLE_OBJC_ARC = YES;
-				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
-				CLANG_WARN_BOOL_CONVERSION = YES;
-				CLANG_WARN_COMMA = YES;
-				CLANG_WARN_CONSTANT_CONVERSION = YES;
-				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
-				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
-				CLANG_WARN_EMPTY_BODY = YES;
-				CLANG_WARN_ENUM_CONVERSION = YES;
-				CLANG_WARN_INFINITE_RECURSION = YES;
-				CLANG_WARN_INT_CONVERSION = YES;
-				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
-				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
-				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
-				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
-				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
-				CLANG_WARN_STRICT_PROTOTYPES = YES;
-				CLANG_WARN_SUSPICIOUS_MOVE = YES;
-				CLANG_WARN_UNREACHABLE_CODE = YES;
-				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
-				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
-				COPY_PHASE_STRIP = YES;
-				ENABLE_NS_ASSERTIONS = NO;
-				ENABLE_STRICT_OBJC_MSGSEND = YES;
-				GCC_C_LANGUAGE_STANDARD = gnu99;
-				GCC_NO_COMMON_BLOCKS = YES;
-				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
-				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
-				GCC_WARN_UNDECLARED_SELECTOR = YES;
-				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
-				GCC_WARN_UNUSED_FUNCTION = YES;
-				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 15.1;
-				LD_RUNPATH_SEARCH_PATHS = "/usr/lib/swift $(inherited)";
-				LIBRARY_SEARCH_PATHS = "$(SDKROOT)/usr/lib/swift\"$(inherited)\"";
-				MTL_ENABLE_DEBUG_INFO = NO;
-				OTHER_LDFLAGS = (
-					"$(inherited)",
-					" ",
-				);
-				REACT_NATIVE_PATH = "${PODS_ROOT}/../../../../node_modules/react-native";
-				SDKROOT = iphoneos;
-				USE_HERMES = true;
-				VALIDATE_PRODUCT = YES;
-			};
-			name = Release;
-		};
-/* End XCBuildConfiguration section */
-
-/* Begin XCConfigurationList section */
-		13B07F931A680F5B00A75B9A /* Build configuration list for PBXNativeTarget "mobileapp" */ = {
-			isa = XCConfigurationList;
-			buildConfigurations = (
-				13B07F941A680F5B00A75B9A /* Debug */,
-				13B07F951A680F5B00A75B9A /* Release */,
-			);
-			defaultConfigurationIsVisible = 0;
-			defaultConfigurationName = Release;
-		};
-		83CBB9FA1A601CBA00E9B192 /* Build configuration list for PBXProject "mobileapp" */ = {
-			isa = XCConfigurationList;
-			buildConfigurations = (
-				83CBBA201A601CBA00E9B192 /* Debug */,
-				83CBBA211A601CBA00E9B192 /* Release */,
-			);
-			defaultConfigurationIsVisible = 0;
-			defaultConfigurationName = Release;
-		};
-/* End XCConfigurationList section */
-	};
-	rootObject = 83CBB9F71A601CBA00E9B192 /* Project object */;
-}
--- a/apps/mobile/ios/mobileapp.xcodeproj/xcshareddata/xcschemes/mobileapp.xcscheme
+++ b/apps/mobile/ios/mobileapp.xcodeproj/xcshareddata/xcschemes/mobileapp.xcscheme
@@ -1,88 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<Scheme
-   LastUpgradeVersion = "1130"
-   version = "1.3">
-   <BuildAction
-      parallelizeBuildables = "YES"
-      buildImplicitDependencies = "YES">
-      <BuildActionEntries>
-         <BuildActionEntry
-            buildForTesting = "YES"
-            buildForRunning = "YES"
-            buildForProfiling = "YES"
-            buildForArchiving = "YES"
-            buildForAnalyzing = "YES">
-            <BuildableReference
-               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
-               BuildableName = "mobileapp.app"
-               BlueprintName = "mobileapp"
-               ReferencedContainer = "container:mobileapp.xcodeproj">
-            </BuildableReference>
-         </BuildActionEntry>
-      </BuildActionEntries>
-   </BuildAction>
-   <TestAction
-      buildConfiguration = "Debug"
-      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
-      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
-      shouldUseLaunchSchemeArgsEnv = "YES">
-      <Testables>
-         <TestableReference
-            skipped = "NO">
-            <BuildableReference
-               BuildableIdentifier = "primary"
-               BlueprintIdentifier = "00E356ED1AD99517003FC87E"
-               BuildableName = "mobileappTests.xctest"
-               BlueprintName = "mobileappTests"
-               ReferencedContainer = "container:mobileapp.xcodeproj">
-            </BuildableReference>
-         </TestableReference>
-      </Testables>
-   </TestAction>
-   <LaunchAction
-      buildConfiguration = "Debug"
-      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
-      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
-      launchStyle = "0"
-      useCustomWorkingDirectory = "NO"
-      ignoresPersistentStateOnLaunch = "NO"
-      debugDocumentVersioning = "YES"
-      debugServiceExtension = "internal"
-      allowLocationSimulation = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
-            BuildableName = "mobileapp.app"
-            BlueprintName = "mobileapp"
-            ReferencedContainer = "container:mobileapp.xcodeproj">
-         </BuildableReference>
-      </BuildableProductRunnable>
-   </LaunchAction>
-   <ProfileAction
-      buildConfiguration = "Release"
-      shouldUseLaunchSchemeArgsEnv = "YES"
-      savedToolIdentifier = ""
-      useCustomWorkingDirectory = "NO"
-      debugDocumentVersioning = "YES">
-      <BuildableProductRunnable
-         runnableDebuggingMode = "0">
-         <BuildableReference
-            BuildableIdentifier = "primary"
-            BlueprintIdentifier = "13B07F861A680F5B00A75B9A"
-            BuildableName = "mobileapp.app"
-            BlueprintName = "mobileapp"
-            ReferencedContainer = "container:mobileapp.xcodeproj">
-         </BuildableReference>
-      </BuildableProductRunnable>
-   </ProfileAction>
-   <AnalyzeAction
-      buildConfiguration = "Debug">
-   </AnalyzeAction>
-   <ArchiveAction
-      buildConfiguration = "Release"
-      revealArchiveInOrganizer = "YES">
-   </ArchiveAction>
-</Scheme>
--- a/apps/mobile/ios/mobileapp.xcworkspace/contents.xcworkspacedata
+++ b/apps/mobile/ios/mobileapp.xcworkspace/contents.xcworkspacedata
@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<Workspace
-   version = "1.0">
-   <FileRef
-      location = "group:mobileapp.xcodeproj">
-   </FileRef>
-   <FileRef
-      location = "group:Pods/Pods.xcodeproj">
-   </FileRef>
-</Workspace>
--- a/apps/mobile/ios/mobileapp/AppDelegate.h
+++ b/apps/mobile/ios/mobileapp/AppDelegate.h
@@ -1,7 +0,0 @@
-#import <RCTAppDelegate.h>
-#import <UIKit/UIKit.h>
-#import <Expo/Expo.h>
-
-@interface AppDelegate : EXAppDelegateWrapper
-
-@end
--- a/apps/mobile/ios/mobileapp/AppDelegate.mm
+++ b/apps/mobile/ios/mobileapp/AppDelegate.mm
@@ -1,62 +0,0 @@
-#import "AppDelegate.h"
-
-#import <React/RCTBundleURLProvider.h>
-#import <React/RCTLinkingManager.h>
-
-@implementation AppDelegate
-
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
-{
-  self.moduleName = @"main";
-
-  // You can add your custom initial props in the dictionary below.
-  // They will be passed down to the ViewController used by React Native.
-  self.initialProps = @{};
-
-  return [super application:application didFinishLaunchingWithOptions:launchOptions];
-}
-
- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
-{
-  return [self bundleURL];
-}
-
- (NSURL *)bundleURL
-{
-#if DEBUG
-  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@".expo/.virtual-metro-entry"];
-#else
-  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
-#endif
-}
-
-// Linking API
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
-  return [super application:application openURL:url options:options] || [RCTLinkingManager application:application openURL:url options:options];
-}
-
-// Universal Links
- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler {
-  BOOL result = [RCTLinkingManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
-  return [super application:application continueUserActivity:userActivity restorationHandler:restorationHandler] || result;
-}
-
-// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
-{
-  return [super application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
-}
-
-// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
-{
-  return [super application:application didFailToRegisterForRemoteNotificationsWithError:error];
-}
-
-// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler
-{
-  return [super application:application didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
-}
-
-@end
--- a/apps/mobile/ios/mobileapp/Images.xcassets/AppIcon.appiconset/App-Icon-1024x1024@1x.png
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/AppIcon.appiconset/App-Icon-1024x1024@1x.png
--- a/apps/mobile/ios/mobileapp/Images.xcassets/AppIcon.appiconset/Contents.json
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/AppIcon.appiconset/Contents.json
@@ -1,14 +0,0 @@
-{
-  "images": [
-    {
-      "filename": "App-Icon-1024x1024@1x.png",
-      "idiom": "universal",
-      "platform": "ios",
-      "size": "1024x1024"
-    }
-  ],
-  "info": {
-    "version": 1,
-    "author": "expo"
-  }
-}
--- a/apps/mobile/ios/mobileapp/Images.xcassets/Contents.json
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/Contents.json
@@ -1,6 +0,0 @@
-{
-  "info" : {
-    "version" : 1,
-    "author" : "expo"
-  }
-}
--- a/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenBackground.colorset/Contents.json
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenBackground.colorset/Contents.json
@@ -1,20 +0,0 @@
-{
-  "colors": [
-    {
-      "color": {
-        "components": {
-          "alpha": "1.000",
-          "blue": "1.00000000000000",
-          "green": "1.00000000000000",
-          "red": "1.00000000000000"
-        },
-        "color-space": "srgb"
-      },
-      "idiom": "universal"
-    }
-  ],
-  "info": {
-    "version": 1,
-    "author": "expo"
-  }
-}
--- a/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/Contents.json
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/Contents.json
@@ -1,23 +0,0 @@
-{
-  "images": [
-    {
-      "idiom": "universal",
-      "filename": "image.png",
-      "scale": "1x"
-    },
-    {
-      "idiom": "universal",
-      "filename": "image@2x.png",
-      "scale": "2x"
-    },
-    {
-      "idiom": "universal",
-      "filename": "image@3x.png",
-      "scale": "3x"
-    }
-  ],
-  "info": {
-    "version": 1,
-    "author": "expo"
-  }
-}
--- a/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image.png
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image.png
--- a/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image@2x.png
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image@2x.png
--- a/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image@3x.png
+++ b/apps/mobile/ios/mobileapp/Images.xcassets/SplashScreenLogo.imageset/image@3x.png
--- a/apps/mobile/ios/mobileapp/Info.plist
+++ b/apps/mobile/ios/mobileapp/Info.plist
@@ -1,91 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-  <dict>
-    <key>CADisableMinimumFrameDurationOnPhone</key>
-    <true/>
-    <key>CFBundleDevelopmentRegion</key>
-    <string>$(DEVELOPMENT_LANGUAGE)</string>
-    <key>CFBundleDisplayName</key>
-    <string>mobile-app</string>
-    <key>CFBundleExecutable</key>
-    <string>$(EXECUTABLE_NAME)</string>
-    <key>CFBundleIdentifier</key>
-    <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
-    <key>CFBundleInfoDictionaryVersion</key>
-    <string>6.0</string>
-    <key>CFBundleName</key>
-    <string>$(PRODUCT_NAME)</string>
-    <key>CFBundlePackageType</key>
-    <string>$(PRODUCT_BUNDLE_PACKAGE_TYPE)</string>
-    <key>CFBundleShortVersionString</key>
-    <string>1.0.0</string>
-    <key>CFBundleSignature</key>
-    <string>????</string>
-    <key>CFBundleURLTypes</key>
-    <array>
-      <dict>
-        <key>CFBundleURLSchemes</key>
-        <array>
-          <string>myapp</string>
-          <string>com.anonymous.mobile-app</string>
-        </array>
-      </dict>
-      <dict>
-        <key>CFBundleURLSchemes</key>
-        <array>
-          <string>exp+mobile-app</string>
-        </array>
-      </dict>
-    </array>
-    <key>CFBundleVersion</key>
-    <string>1</string>
-    <key>LSMinimumSystemVersion</key>
-    <string>12.0</string>
-    <key>LSRequiresIPhoneOS</key>
-    <true/>
-    <key>NSAppTransportSecurity</key>
-    <dict>
-      <key>NSAllowsArbitraryLoads</key>
-      <false/>
-      <key>NSAllowsLocalNetworking</key>
-      <true/>
-    </dict>
-    <key>NSFaceIDUsageDescription</key>
-    <string>Allow $(PRODUCT_NAME) to access your Face ID biometric data.</string>
-    <key>NSUserActivityTypes</key>
-    <array>
-      <string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string>
-    </array>
-    <key>UILaunchStoryboardName</key>
-    <string>SplashScreen</string>
-    <key>UIRequiredDeviceCapabilities</key>
-    <array>
-      <string>arm64</string>
-    </array>
-    <key>UIRequiresFullScreen</key>
-    <false/>
-    <key>UIStatusBarStyle</key>
-    <string>UIStatusBarStyleDefault</string>
-    <key>UISupportedInterfaceOrientations</key>
-    <array>
-      <string>UIInterfaceOrientationPortrait</string>
-      <string>UIInterfaceOrientationPortraitUpsideDown</string>
-    </array>
-    <key>UISupportedInterfaceOrientations~ipad</key>
-    <array>
-      <string>UIInterfaceOrientationPortrait</string>
-      <string>UIInterfaceOrientationPortraitUpsideDown</string>
-      <string>UIInterfaceOrientationLandscapeLeft</string>
-      <string>UIInterfaceOrientationLandscapeRight</string>
-    </array>
-    <key>UIUserInterfaceStyle</key>
-    <string>Automatic</string>
-    <key>UIViewControllerBasedStatusBarAppearance</key>
-    <false/>
-    <key>UIFileSharingEnabled</key>
-    <true/>
-    <key>LSSupportsOpeningDocumentsInPlace</key>
-    <true/>
-  </dict>
-</plist>
--- a/apps/mobile/ios/mobileapp/PrivacyInfo.xcprivacy
+++ b/apps/mobile/ios/mobileapp/PrivacyInfo.xcprivacy
@@ -1,48 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>NSPrivacyAccessedAPITypes</key>
-	<array>
-		<dict>
-			<key>NSPrivacyAccessedAPIType</key>
-			<string>NSPrivacyAccessedAPICategoryUserDefaults</string>
-			<key>NSPrivacyAccessedAPITypeReasons</key>
-			<array>
-				<string>CA92.1</string>
-			</array>
-		</dict>
-		<dict>
-			<key>NSPrivacyAccessedAPIType</key>
-			<string>NSPrivacyAccessedAPICategoryFileTimestamp</string>
-			<key>NSPrivacyAccessedAPITypeReasons</key>
-			<array>
-				<string>0A2A.1</string>
-				<string>3B52.1</string>
-				<string>C617.1</string>
-			</array>
-		</dict>
-		<dict>
-			<key>NSPrivacyAccessedAPIType</key>
-			<string>NSPrivacyAccessedAPICategoryDiskSpace</string>
-			<key>NSPrivacyAccessedAPITypeReasons</key>
-			<array>
-				<string>E174.1</string>
-				<string>85F4.1</string>
-			</array>
-		</dict>
-		<dict>
-			<key>NSPrivacyAccessedAPIType</key>
-			<string>NSPrivacyAccessedAPICategorySystemBootTime</string>
-			<key>NSPrivacyAccessedAPITypeReasons</key>
-			<array>
-				<string>35F9.1</string>
-			</array>
-		</dict>
-	</array>
-	<key>NSPrivacyCollectedDataTypes</key>
-	<array/>
-	<key>NSPrivacyTracking</key>
-	<false/>
-</dict>
-</plist>
--- a/apps/mobile/ios/mobileapp/SplashScreen.storyboard
+++ b/apps/mobile/ios/mobileapp/SplashScreen.storyboard
@@ -1,42 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="32700.99.1234" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="EXPO-VIEWCONTROLLER-1">
-    <device id="retina6_12" orientation="portrait" appearance="light"/>
-    <dependencies>
-        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="22685"/>
-        <capability name="Named colors" minToolsVersion="9.0"/>
-        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
-        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
-    </dependencies>
-    <scenes>
-        <scene sceneID="EXPO-SCENE-1">
-            <objects>
-                <viewController storyboardIdentifier="SplashScreenViewController" id="EXPO-VIEWCONTROLLER-1" sceneMemberID="viewController">
-                    <view key="view" userInteractionEnabled="NO" contentMode="scaleToFill" insetsLayoutMarginsFromSafeArea="NO" id="EXPO-ContainerView" userLabel="ContainerView">
-                        <rect key="frame" x="0.0" y="0.0" width="393" height="852"/>
-                        <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMaxY="YES"/>
-                        <subviews>
-                            <imageView id="EXPO-SplashScreen" userLabel="SplashScreenLogo" image="SplashScreenLogo" contentMode="scaleAspectFit" clipsSubviews="true" userInteractionEnabled="false" translatesAutoresizingMaskIntoConstraints="false">
-                                <rect key="frame" x="96.5" y="326" width="200" height="200"/>
-                            </imageView>
-                        </subviews>
-                        <viewLayoutGuide key="safeArea" id="Rmq-lb-GrQ"/>
-                        <constraints>
-                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerX" secondItem="EXPO-ContainerView" secondAttribute="centerX" id="cad2ab56f97c5429bf29decf850647a4216861d4"/>
-                            <constraint firstItem="EXPO-SplashScreen" firstAttribute="centerY" secondItem="EXPO-ContainerView" secondAttribute="centerY" id="1a145271b085b6ce89b1405a310f5b1bb7656595"/>
-                        </constraints>
-                        <color key="backgroundColor" name="SplashScreenBackground"/>
-                    </view>
-                </viewController>
-                <placeholder placeholderIdentifier="IBFirstResponder" id="EXPO-PLACEHOLDER-1" userLabel="First Responder" sceneMemberID="firstResponder"/>
-            </objects>
-            <point key="canvasLocation" x="0.0" y="0.0"/>
-        </scene>
-    </scenes>
-    <resources>
-        <image name="SplashScreenLogo" width="200" height="200"/>
-        <namedColor name="SplashScreenBackground">
-            <color alpha="1.000" blue="1.00000000000000" green="1.00000000000000" red="1.00000000000000" customColorSpace="sRGB" colorSpace="custom"/>
-        </namedColor>
-    </resources>
-</document>
--- a/apps/mobile/ios/mobileapp/Supporting/Expo.plist
+++ b/apps/mobile/ios/mobileapp/Supporting/Expo.plist
@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-  <dict>
-    <key>EXUpdatesCheckOnLaunch</key>
-    <string>ALWAYS</string>
-    <key>EXUpdatesEnabled</key>
-    <false/>
-    <key>EXUpdatesLaunchWaitMs</key>
-    <integer>0</integer>
-  </dict>
-</plist>
--- a/apps/mobile/ios/mobileapp/main.m
+++ b/apps/mobile/ios/mobileapp/main.m
@@ -1,10 +0,0 @@
-#import <UIKit/UIKit.h>
-
-#import "AppDelegate.h"
-
-int main(int argc, char * argv[]) {
-  @autoreleasepool {
-    return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
-  }
-}
-
--- a/apps/mobile/ios/mobileapp/mobileapp-Bridging-Header.h
+++ b/apps/mobile/ios/mobileapp/mobileapp-Bridging-Header.h
@@ -1,3 +0,0 @@
-//
-//  Use this file to import your target's public headers that you would like to expose to Swift.
-//
--- a/apps/mobile/ios/mobileapp/mobileapp.entitlements
+++ b/apps/mobile/ios/mobileapp/mobileapp.entitlements
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-  <dict/>
-</plist>
--- a/apps/mobile/ios/mobileapp/noop-file.swift
+++ b/apps/mobile/ios/mobileapp/noop-file.swift
@@ -1,4 +0,0 @@
-//
-// @generated
-// A blank Swift file must be created for native modules with Swift files to work correctly.
-//
--- a/apps/mobile/lib/colors.ts
+++ b/apps/mobile/lib/colors.ts
@@ -0,0 +1,33 @@
+// lib/theme/colors.ts
+export type ThemeName = "light" | "dark";
+
+export const rawTheme = {
+  light: {
+    primary: "#0369A1",
+    secondary: "#0891B2",
+    accent: "#6D28D9",
+    neutral: "#6B7280",
+    "neutral-content": "#D1D5DB",
+    "base-100": "#FFFFFF",
+    "base-200": "#F3F4F6",
+    "base-content": "#0A0A0A",
+    info: "#A5F3FC",
+    success: "#22C55E",
+    warning: "#FACC15",
+    error: "#DC2626",
+  },
+  dark: {
+    primary: "#7DD3FC",
+    secondary: "#22D3EE",
+    accent: "#6D28D9",
+    neutral: "#9CA3AF",
+    "neutral-content": "#404040",
+    "base-100": "#171717",
+    "base-200": "#262626",
+    "base-content": "#FAFAFA",
+    info: "#009EE4",
+    success: "#00B17D",
+    warning: "#EAC700",
+    error: "#F1293C",
+  },
+};
--- a/apps/mobile/lib/theme.ts
+++ b/apps/mobile/lib/theme.ts
@@ -0,0 +1,23 @@
+import { vars } from "nativewind";
+import { rawTheme, ThemeName } from "./colors";
+
+const hexToRgb = (hex: string) => {
+  const [r, g, b] = hex
+    .replace(/^#/, "")
+    .match(/.{2}/g)!
+    .map((h) => parseInt(h, 16));
+  return `${r} ${g} ${b}`;
+};
+
+const makeVars = (scheme: ThemeName) =>
+  vars(
+    Object.fromEntries(
+      Object.entries(rawTheme[scheme]).map(([key, hex]) => [
+        `--color-${key}`,
+        hexToRgb(hex),
+      ])
+    ) as Record<string, string>
+  );
+
+export const lightTheme = makeVars("light");
+export const darkTheme = makeVars("dark");
--- a/apps/mobile/package.json
+++ b/apps/mobile/package.json
@@ -1,10 +1,9 @@
 {
-  "name": "mobile-app",
+  "name": "@linkwarden/mobile",
  "main": "expo-router/entry",
  "version": "1.0.0",
  "scripts": {
    "start": "expo start",
-    "reset-project": "node ./scripts/reset-project.js",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web",
@@ -20,6 +19,7 @@
    "@linkwarden/react-native-render-html": "^6.3.4",
    "@linkwarden/router": "*",
    "@linkwarden/types": "*",
+    "@react-native-async-storage/async-storage": "^2.2.0",
    "@react-native-community/netinfo": "11.4.1",
    "@react-native-menu/menu": "1.2.2",
    "@react-navigation/bottom-tabs": "^7.0.0",
@@ -28,6 +28,7 @@
    "@tanstack/react-query-persist-client": "^5.51.15",
    "class-variance-authority": "^0.7.1",
    "expo": "~52.0.18",
+    "expo-application": "~6.0.2",
    "expo-blur": "~14.0.1",
    "expo-clipboard": "~7.0.1",
    "expo-constants": "~17.0.3",
@@ -35,15 +36,17 @@
    "expo-file-system": "~18.0.12",
    "expo-font": "~13.0.1",
    "expo-haptics": "~14.0.0",
-    "expo-linking": "~7.0.3",
+    "expo-linking": "~7.0.5",
    "expo-router": "4.0.20",
    "expo-secure-store": "~14.0.0",
+    "expo-share-intent": "^3.2.3",
    "expo-splash-screen": "~0.29.18",
    "expo-status-bar": "~2.0.0",
    "expo-symbols": "~0.2.0",
    "expo-system-ui": "~4.0.6",
    "expo-web-browser": "~14.0.1",
    "html-entities": "^2.6.0",
+    "lucide-react-native": "^0.536.0",
    "nativewind": "^4.1.23",
    "react": "18.3.1",
    "react-dom": "18.3.1",
@@ -56,6 +59,7 @@
    "react-native-reanimated": "3.16.2",
    "react-native-safe-area-context": "4.12.0",
    "react-native-screens": "~4.1.0",
+    "react-native-svg": "^15.12.1",
    "react-native-web": "~0.19.13",
    "react-native-webview": "13.12.5",
    "tailwindcss": "^3.4.17",
--- a/apps/mobile/plugins/with-daynight-transparent-nav.js
+++ b/apps/mobile/plugins/with-daynight-transparent-nav.js
@@ -0,0 +1,43 @@
+const { withAndroidStyles } = require("@expo/config-plugins");
+function mutateStylesXml(xml) {
+  const styles = xml.resources?.style ?? [];
+  let appTheme = styles.find((s) => s.$?.name === "AppTheme");
+  if (!appTheme) {
+    appTheme = {
+      $: { name: "AppTheme", parent: "Theme.AppCompat.DayNight.NoActionBar" },
+      item: [],
+    };
+    styles.push(appTheme);
+  }
+
+  appTheme.$ = appTheme.$ || {};
+  appTheme.$.parent = "Theme.AppCompat.DayNight.NoActionBar";
+
+  appTheme.item = appTheme.item ?? [];
+
+  appTheme.item = appTheme.item.filter(
+    (i) => i?.$?.name !== "android:textColor"
+  );
+
+  const navItem = appTheme.item.find(
+    (i) => i.$?.name === "android:navigationBarColor"
+  );
+  if (navItem) {
+    navItem._ = "@android:color/transparent";
+  } else {
+    appTheme.item.push({
+      $: { name: "android:navigationBarColor" },
+      _: "@android:color/transparent",
+    });
+  }
+
+  xml.resources.style = styles;
+  return xml;
+}
+
+module.exports = function withDayNightTransparentNav(config) {
+  return withAndroidStyles(config, (c) => {
+    c.modResults = mutateStylesXml(c.modResults);
+    return c;
+  });
+};
--- a/apps/mobile/store/data.ts
+++ b/apps/mobile/store/data.ts
@@ -0,0 +1,37 @@
+import { create } from "zustand";
+import { MobileData } from "@linkwarden/types";
+import AsyncStorage from "@react-native-async-storage/async-storage";
+import { colorScheme } from "nativewind";
+
+type DataStore = {
+  data: MobileData;
+  updateData: (newData: Partial<MobileData>) => void;
+  setData: () => void;
+};
+
+const useDataStore = create<DataStore>((set, get) => ({
+  data: {
+    shareIntent: {
+      hasShareIntent: false,
+      url: "",
+    },
+    theme: "light",
+    preferredFormat: null,
+  },
+  setData: async () => {
+    const dataString = JSON.parse((await AsyncStorage.getItem("data")) || "{}");
+
+    colorScheme.set(dataString.theme || "light");
+
+    if (dataString)
+      set((state) => ({ data: { ...state.data, ...dataString } }));
+  },
+  updateData: async (patch) => {
+    const merged = { ...get().data, ...patch };
+    const { shareIntent, ...persistable } = merged;
+    await AsyncStorage.setItem("data", JSON.stringify(persistable));
+    set({ data: merged });
+  },
+}));
+
+export default useDataStore;
--- a/apps/mobile/tailwind.config.js
+++ b/apps/mobile/tailwind.config.js
@@ -1,9 +1,39 @@
 /** @type {import('tailwindcss').Config} */
+
+const { rawTheme } = require("./lib/colors");
+
+const hexToRgb = (hex) => {
+  const [r, g, b] = hex
+    .replace(/^#/, "")
+    .match(/.{2}/g)
+    .map((h) => parseInt(h, 16));
+  return `${r} ${g} ${b}`;
+};
+
 module.exports = {
  content: ["./app/**/*.{js,jsx,ts,tsx}", "./components/**/*.{js,jsx,ts,tsx}"],
  presets: [require("nativewind/preset")],
+  darkMode: "media",
  theme: {
-    extend: {},
+    extend: {
+      colors: Object.fromEntries(
+        Object.keys(rawTheme.light).map((key) => [
+          key,
+          `rgb(var(--color-${key}) / <alpha-value>)`,
+        ])
+      ),
+    },
  },
-  plugins: [],
+  plugins: [
+    ({ addBase }) => {
+      addBase({
+        ":root": Object.fromEntries(
+          Object.entries(rawTheme.light).map(([key, hex]) => [
+            `--color-${key}`,
+            hexToRgb(hex),
+          ])
+        ),
+      });
+    },
+  ],
 };
--- a/apps/web/components/CollectionListing.tsx
+++ b/apps/web/components/CollectionListing.tsx
@@ -22,12 +22,16 @@ import {
 import { useUpdateUser, useUser } from "@linkwarden/router/user";
 import Icon from "./Icon";
 import { IconWeight } from "@phosphor-icons/react";
+import Droppable from "./Droppable";
+import { cn } from "@linkwarden/lib";
+import { Active, useDndContext } from "@dnd-kit/core";

 interface ExtendedTreeItem extends TreeItem {
  data: Collection;
 }

 const CollectionListing = () => {
+  const { active: droppableActive } = useDndContext();
  const { t } = useTranslation();
  const updateCollection = useUpdateCollection();
  const { data: collections = [], isLoading } = useCollections();
@@ -276,7 +280,9 @@ const CollectionListing = () => {
    return (
      <Tree
        tree={tree}
-        renderItem={(itemProps) => renderItem({ ...itemProps }, currentPath)}
+        renderItem={(itemProps) =>
+          renderItem({ ...itemProps }, currentPath, droppableActive)
+        }
        onExpand={onExpand}
        onCollapse={onCollapse}
        onDragEnd={onDragEnd}
@@ -290,59 +296,77 @@ export default CollectionListing;

 const renderItem = (
  { item, onExpand, onCollapse, provided }: RenderItemParams,
-  currentPath: string
+  currentPath: string,
+  droppableActive: Active | null
 ) => {
  const collection = item.data;

  return (
-    <div ref={provided.innerRef} {...provided.draggableProps} className="mb-1">
+    <Droppable
+      id={`side-bar-collection-${collection.id}`}
+      data={{
+        name: collection.name,
+        id: collection.id,
+        ownerId: collection.ownerId,
+      }}
+      className="group"
+    >
      <div
-        className={`${
-          currentPath === `/collections/${collection.id}`
-            ? "bg-primary/20 is-active"
-            : "hover:bg-neutral/20"
-        } duration-100 flex gap-1 items-center pr-2 pl-1 rounded-md`}
+        ref={provided.innerRef}
+        {...provided.draggableProps}
+        className="mb-1"
      >
-        {Dropdown(item as ExtendedTreeItem, onExpand, onCollapse)}
-
-        <Link
-          href={`/collections/${collection.id}`}
-          className="w-full"
-          {...provided.dragHandleProps}
+        <div
+          className={cn(
+            currentPath === `/collections/${collection.id}`
+              ? "bg-primary/20 is-active"
+              : droppableActive
+                ? "select-none"
+                : "hover:bg-neutral/20",
+            "duration-100 flex gap-1 items-center pr-2 pl-1 rounded-md"
+          )}
        >
-          <div
-            className={`py-1 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
+          {Dropdown(item as ExtendedTreeItem, onExpand, onCollapse)}
+
+          <Link
+            href={`/collections/${collection.id}`}
+            className="w-full"
+            {...provided.dragHandleProps}
          >
-            {collection.icon ? (
-              <Icon
-                icon={collection.icon}
-                size={30}
-                weight={(collection.iconWeight || "regular") as IconWeight}
-                color={collection.color}
-                className="-mr-[0.15rem]"
-              />
-            ) : (
-              <i
-                className="bi-folder-fill text-xl"
-                style={{ color: collection.color }}
-              ></i>
-            )}
+            <div
+              className={`py-1 cursor-pointer flex items-center gap-2 w-full rounded-md h-8`}
+            >
+              {collection.icon ? (
+                <Icon
+                  icon={collection.icon}
+                  size={30}
+                  weight={(collection.iconWeight || "regular") as IconWeight}
+                  color={collection.color}
+                  className="-mr-[0.15rem]"
+                />
+              ) : (
+                <i
+                  className="bi-folder-fill text-xl"
+                  style={{ color: collection.color }}
+                ></i>
+              )}

-            <p className="truncate w-full">{collection.name}</p>
+              <p className="truncate w-full">{collection.name}</p>

-            {collection.isPublic && (
-              <i
-                className="bi-globe2 text-sm text-black/50 dark:text-white/50 drop-shadow"
-                title="This collection is being shared publicly."
-              ></i>
-            )}
-            <div className="drop-shadow text-neutral text-xs">
-              {collection._count?.links}
+              {collection.isPublic && (
+                <i
+                  className="bi-globe2 text-sm text-black/50 dark:text-white/50 drop-shadow"
+                  title="This collection is being shared publicly."
+                ></i>
+              )}
+              <div className="drop-shadow text-neutral text-xs">
+                {collection._count?.links}
+              </div>
            </div>
-          </div>
-        </Link>
+          </Link>
+        </div>
      </div>
-    </div>
+    </Droppable>
  );
 };

--- a/apps/web/components/DashboardLayoutDropdown.tsx
+++ b/apps/web/components/DashboardLayoutDropdown.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useMemo, DragEvent, useEffect } from "react";
+import React, { useState, useMemo, useEffect } from "react";
 import {
  DropdownMenu,
  DropdownMenuTrigger,
@@ -14,6 +14,22 @@ import {
 } from "@linkwarden/prisma/client";
 import { useUser } from "@linkwarden/router/user";
 import { useUpdateDashboardLayout } from "@linkwarden/router/dashboardData";
+import {
+  SortableContext,
+  useSortable,
+  verticalListSortingStrategy,
+} from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+import {
+  DndContext,
+  DragEndEvent,
+  MouseSensor,
+  TouchSensor,
+  useSensor,
+  useSensors,
+} from "@dnd-kit/core";
+import { restrictToParentElement } from "@dnd-kit/modifiers";
+import { cn } from "@linkwarden/lib";

 interface DashboardSectionOption {
  type: DashboardSectionType;
@@ -29,11 +45,20 @@ export default function DashboardLayoutDropdown() {
  const { data: collections = [] } = useCollections();
  const updateDashboardLayout = useUpdateDashboardLayout();
  const [searchTerm, setSearchTerm] = useState("");
-  const [draggedId, setDraggedId] = useState<string | null>(null);
-  const [dragOverId, setDragOverId] = useState<string | null>(null);
-  const [dragOverPosition, setDragOverPosition] = useState<
-    "above" | "below" | null
-  >(null);
+  const mouseSensor = useSensor(MouseSensor, {
+    // Require the mouse to move by 10 pixels before activating
+    activationConstraint: {
+      distance: 10,
+    },
+  });
+  const touchSensor = useSensor(TouchSensor, {
+    // Press delay of 200ms, with tolerance of 5px of movement
+    activationConstraint: {
+      delay: 200,
+      tolerance: 5,
+    },
+  });
+  const sensors = useSensors(mouseSensor, touchSensor);

  const [dashboardSections, setDashboardSections] = useState<
    DashboardSection[]
@@ -165,25 +190,62 @@ export default function DashboardLayoutDropdown() {

  const handleReorder = (sourceId: string, destId: string) => {
    if (sourceId === destId) return;
-    const sourceIndex = filteredSections.findIndex(
+
+    // Get only enabled sections for reordering
+    const enabledSections = filteredSections.filter((s) => s.enabled);
+
+    const sourceIndex = enabledSections.findIndex(
      (s) => getSectionId(s) === sourceId
    );
-    const destIndex = filteredSections.findIndex(
+    const destIndex = enabledSections.findIndex(
      (s) => getSectionId(s) === destId
    );
    if (sourceIndex < 0 || destIndex < 0) return;

-    const reordered = [...filteredSections];
-    const [moved] = reordered.splice(sourceIndex, 1);
-    reordered.splice(destIndex, 0, moved);
+    // Reorder only the enabled sections
+    const reorderedEnabled = [...enabledSections];
+    const [moved] = reorderedEnabled.splice(sourceIndex, 1);
+    reorderedEnabled.splice(destIndex, 0, moved);

-    const updated = reordered.map((section, idx) =>
-      section.enabled ? { ...section, order: idx } : section
-    );
+    // Assign new order values based on the reordered enabled sections
+    const reorderedWithNewOrders = reorderedEnabled.map((section, idx) => ({
+      ...section,
+      order: idx,
+    }));
+
+    // Get disabled sections and combine with reordered enabled sections
+    const disabledSections = filteredSections.filter((s) => !s.enabled);
+    const updated = [...reorderedWithNewOrders, ...disabledSections];

    updateDashboardLayout.mutateAsync(updated);
  };

+  const handleDragEnd = (event: DragEndEvent) => {
+    const { active, over } = event;
+    if (!over || active.id === over.id) {
+      return;
+    }
+
+    const sourceId = active.id as string;
+    const destId = over.id as string;
+
+    // Only allow reordering enabled sections
+    const sourceSection = filteredSections.find(
+      (s) => getSectionId(s) === sourceId
+    );
+    const destSection = filteredSections.find(
+      (s) => getSectionId(s) === destId
+    );
+    if (sourceSection?.enabled && destSection?.enabled) {
+      handleReorder(sourceId, destId);
+    }
+  };
+
+  // Only include enabled sections in the sortable context
+  const sortableItems = filteredSections
+    .filter((section) => section.enabled)
+    .map(getSectionId);
+
  return (
    <DropdownMenu modal>
      <DropdownMenuTrigger asChild>
@@ -210,37 +272,40 @@ export default function DashboardLayoutDropdown() {
              placeholder={t("search")}
            />
          </div>
+          <DndContext
+            modifiers={[restrictToParentElement]}
+            onDragEnd={handleDragEnd}
+            sensors={sensors}
+          >
+            <SortableContext
+              items={sortableItems}
+              strategy={verticalListSortingStrategy}
+            >
+              <ul className="max-h-60 overflow-y-auto px-2 pb-2">
+                {filteredSections.map((section) => {
+                  const color =
+                    section.type === "COLLECTION"
+                      ? collections.find((c) => c.id === section.collectionId)
+                          ?.color
+                      : undefined;

-          <ul className="max-h-60 overflow-y-auto px-2 pb-2">
-            {filteredSections.map((section) => {
-              const color =
-                section.type === "COLLECTION"
-                  ? collections.find((c) => c.id === section.collectionId)
-                      ?.color
-                  : undefined;
+                  return (
+                    <DraggableListItem
+                      key={getSectionId(section)}
+                      section={{ ...section, color }}
+                      onCheckboxChange={handleCheckboxChange}
+                    />
+                  );
+                })}

-              return (
-                <DraggableListItem
-                  key={getSectionId(section)}
-                  section={{ ...section, color }}
-                  onCheckboxChange={handleCheckboxChange}
-                  onReorder={handleReorder}
-                  draggedId={draggedId}
-                  dragOverId={dragOverId}
-                  dragOverPosition={dragOverPosition}
-                  setDraggedId={setDraggedId}
-                  setDragOverId={setDragOverId}
-                  setDragOverPosition={setDragOverPosition}
-                />
-              );
-            })}
-
-            {filteredSections.length === 0 && (
-              <li className="text-sm py-2 text-center text-neutral">
-                {t("no_results_found")}
-              </li>
-            )}
-          </ul>
+                {filteredSections.length === 0 && (
+                  <li className="text-sm py-2 text-center text-neutral">
+                    {t("no_results_found")}
+                  </li>
+                )}
+              </ul>
+            </SortableContext>
+          </DndContext>
        </div>
      </DropdownMenuContent>
    </DropdownMenu>
@@ -250,91 +315,44 @@ export default function DashboardLayoutDropdown() {
 interface DraggableListItemProps {
  section: DashboardSectionOption & { color?: string };
  onCheckboxChange: (section: DashboardSectionOption) => void;
-  onReorder: (sourceId: string, destId: string) => void;
-  draggedId: string | null;
-  dragOverId: string | null;
-  dragOverPosition: "above" | "below" | null;
-  setDraggedId: (id: string | null) => void;
-  setDragOverId: (id: string | null) => void;
-  setDragOverPosition: (pos: "above" | "below" | null) => void;
 }

 function DraggableListItem({
  section,
  onCheckboxChange,
-  onReorder,
-  draggedId,
-  dragOverId,
-  dragOverPosition,
-  setDraggedId,
-  setDragOverId,
-  setDragOverPosition,
 }: DraggableListItemProps) {
  const sectionId = `${section.type}-${section.collectionId ?? "default"}`;

-  const handleDragStart = (e: DragEvent<HTMLLIElement>) => {
-    const img = new Image();
-    img.src =
-      "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1' height='1'></svg>";
-    e.dataTransfer.setDragImage(img, 0, 0);
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    transform,
+    transition,
+    isDragging,
+  } = useSortable({
+    id: sectionId,
+    disabled: !section.enabled,
+  });

-    e.dataTransfer.setData("text/plain", sectionId);
-    setDraggedId(sectionId);
-    e.dataTransfer.effectAllowed = "move";
+  const style = {
+    transform: CSS.Transform.toString(transform),
+    transition,
  };

-  const handleDragOver = (e: DragEvent<HTMLLIElement>) => {
-    e.preventDefault();
-    const rect = e.currentTarget.getBoundingClientRect();
-    const midY = rect.top + rect.height / 2;
-    const pos = e.clientY < midY ? "above" : "below";
-    setDragOverPosition(pos);
-    setDragOverId(sectionId);
-    e.dataTransfer.dropEffect = "move";
-  };
-
-  const handleDragLeave = () => {
-    setDragOverId(null);
-    setDragOverPosition(null);
-  };
-
-  const handleDrop = (e: DragEvent<HTMLLIElement>) => {
-    e.preventDefault();
-    const sourceId = e.dataTransfer.getData("text/plain");
-    if (sourceId) {
-      const destId = dragOverPosition === "below" ? sectionId : sectionId;
-      onReorder(sourceId, destId);
-    }
-    setDraggedId(null);
-    setDragOverId(null);
-    setDragOverPosition(null);
-  };
-
-  const indicatorClass =
-    dragOverId === sectionId && dragOverPosition === "above"
-      ? "border-t-2 border-primary"
-      : dragOverId === sectionId && dragOverPosition === "below"
-        ? "border-b-2 border-primary"
-        : "";
-
  return (
    <li
-      draggable={section.enabled}
-      onDragStart={handleDragStart}
-      onDragOver={handleDragOver}
-      onDragLeave={handleDragLeave}
-      onDrop={handleDrop}
-      onDragEnd={() => {
-        setDraggedId(null);
-        setDragOverId(null);
-        setDragOverPosition(null);
-      }}
-      className={`
-        select-none py-1 px-1 flex items-center justify-between
-        ${section.enabled ? "cursor-grab active:cursor-grabbing" : ""}
-        ${draggedId === sectionId ? "opacity-70" : ""}
-        ${indicatorClass}
-      `}
+      ref={setNodeRef}
+      style={style}
+      {...attributes}
+      {...listeners}
+      className={cn(
+        "select-none py-1 px-1 flex items-center justify-between",
+        section.enabled
+          ? "cursor-grab active:cursor-grabbing"
+          : "cursor-default",
+        isDragging && "opacity-50"
+      )}
    >
      <div className="flex items-center gap-2">
        <input
--- a/Show More
+++ b/Show More