update publishing flow

android/.gitignore

@@ -0,0 +1,101 @@
+# Using Android gitignore template: https://github.com/github/gitignore/blob/HEAD/Android.gitignore
+
+# Built application files
+*.apk
+*.aar
+*.ap_
+*.aab
+
+# Files for the ART/Dalvik VM
+*.dex
+
+# Java class files
+*.class
+
+# Generated files
+bin/
+gen/
+out/
+#  Uncomment the following line in case you need and you don't have the release build type files in your app
+# release/
+
+# Gradle files
+.gradle/
+build/
+
+# Local configuration file (sdk path, etc)
+local.properties
+
+# Proguard folder generated by Eclipse
+proguard/
+
+# Log Files
+*.log
+
+# Android Studio Navigation editor temp files
+.navigation/
+
+# Android Studio captures folder
+captures/
+
+# IntelliJ
+*.iml
+.idea/workspace.xml
+.idea/tasks.xml
+.idea/gradle.xml
+.idea/assetWizardSettings.xml
+.idea/dictionaries
+.idea/libraries
+# Android Studio 3 in .gitignore file.
+.idea/caches
+.idea/modules.xml
+# Comment next line if keeping position of elements in Navigation Editor is relevant for you
+.idea/navEditor.xml
+
+# Keystore files
+# Uncomment the following lines if you do not want to check your keystore files in.
+#*.jks
+#*.keystore
+
+# External native build folder generated in Android Studio 2.2 and later
+.externalNativeBuild
+.cxx/
+
+# Google Services (e.g. APIs or Firebase)
+# google-services.json
+
+# Freeline
+freeline.py
+freeline/
+freeline_project_description.json
+
+# fastlane
+fastlane/report.xml
+fastlane/Preview.html
+fastlane/screenshots
+fastlane/test_output
+fastlane/readme.md
+
+# Version control
+vcs.xml
+
+# lint
+lint/intermediates/
+lint/generated/
+lint/outputs/
+lint/tmp/
+# lint/reports/
+
+# Android Profiling
+*.hprof
+
+# Cordova plugins for Capacitor
+capacitor-cordova-android-plugins
+
+# Copied web assets
+app/src/main/assets/public
+
+# Generated Config files
+app/src/main/assets/capacitor.config.json
+app/src/main/assets/capacitor.plugins.json
+app/src/main/res/xml/config.xml

android/app/.gitignore

@@ -0,0 +1,2 @@
+/build/*
+!/build/.npmkeep

android/app/build.gradle

@@ -0,0 +1,54 @@
+apply plugin: 'com.android.application'
+
+android {
+    namespace = "com.takerofnotes.app"
+    compileSdk = rootProject.ext.compileSdkVersion
+    defaultConfig {
+        applicationId "com.takerofnotes.app"
+        minSdkVersion rootProject.ext.minSdkVersion
+        targetSdkVersion rootProject.ext.targetSdkVersion
+        versionCode 1
+        versionName "1.0"
+        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
+        aaptOptions {
+             // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
+             // Default: https://android.googlesource.com/platform/frameworks/base/+/282e181b58cf72b6ca770dc7ca5f91f135444502/tools/aapt/AaptAssets.cpp#61
+            ignoreAssetsPattern = '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
+        }
+    }
+    buildTypes {
+        release {
+            minifyEnabled false
+            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
+        }
+    }
+}
+
+repositories {
+    flatDir{
+        dirs '../capacitor-cordova-android-plugins/src/main/libs', 'libs'
+    }
+}
+
+dependencies {
+    implementation fileTree(include: ['*.jar'], dir: 'libs')
+    implementation "androidx.appcompat:appcompat:$androidxAppCompatVersion"
+    implementation "androidx.coordinatorlayout:coordinatorlayout:$androidxCoordinatorLayoutVersion"
+    implementation "androidx.core:core-splashscreen:$coreSplashScreenVersion"
+    implementation project(':capacitor-android')
+    testImplementation "junit:junit:$junitVersion"
+    androidTestImplementation "androidx.test.ext:junit:$androidxJunitVersion"
+    androidTestImplementation "androidx.test.espresso:espresso-core:$androidxEspressoCoreVersion"
+    implementation project(':capacitor-cordova-android-plugins')
+}
+
+apply from: 'capacitor.build.gradle'
+
+try {
+    def servicesJSON = file('google-services.json')
+    if (servicesJSON.text) {
+        apply plugin: 'com.google.gms.google-services'
+    }
+} catch(Exception e) {
+    logger.info("google-services.json not found, google-services plugin not applied. Push Notifications won't work")
+}

android/app/capacitor.build.gradle

@@ -0,0 +1,19 @@
+// DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
+
+android {
+  compileOptions {
+      sourceCompatibility JavaVersion.VERSION_21
+      targetCompatibility JavaVersion.VERSION_21
+  }
+}
+
+apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
+dependencies {
+    implementation project(':capacitor-preferences')
+
+}
+
+
+if (hasProperty('postBuildExtras')) {
+  postBuildExtras()
+}

android/app/proguard-rules.pro

@@ -0,0 +1,21 @@
+# Add project specific ProGuard rules here.
+# You can control the set of applied configuration files using the
+# proguardFiles setting in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# If your project uses WebView with JS, uncomment the following
+# and specify the fully qualified class name to the JavaScript interface
+# class:
+#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
+#   public *;
+#}
+
+# Uncomment this to preserve the line number information for
+# debugging stack traces.
+#-keepattributes SourceFile,LineNumberTable
+
+# If you keep the line number information, uncomment this to
+# hide the original source file name.
+#-renamesourcefileattribute SourceFile

android/app/src/androidTest/java/com/getcapacitor/myapp/ExampleInstrumentedTest.java

@@ -0,0 +1,26 @@
+package com.getcapacitor.myapp;
+
+import static org.junit.Assert.*;
+
+import android.content.Context;
+import androidx.test.ext.junit.runners.AndroidJUnit4;
+import androidx.test.platform.app.InstrumentationRegistry;
+import org.junit.Test;
+import org.junit.runner.RunWith;
+
+/**
+ * Instrumented test, which will execute on an Android device.
+ *
+ * @see <a href="http://d.android.com/tools/testing">Testing documentation</a>
+ */
+@RunWith(AndroidJUnit4.class)
+public class ExampleInstrumentedTest {
+
+    @Test
+    public void useAppContext() throws Exception {
+        // Context of the app under test.
+        Context appContext = InstrumentationRegistry.getInstrumentation().getTargetContext();
+
+        assertEquals("com.getcapacitor.app", appContext.getPackageName());
+    }
+}

android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <application
+        android:allowBackup="true"
+        android:icon="@mipmap/ic_launcher"
+        android:label="@string/app_name"
+        android:roundIcon="@mipmap/ic_launcher_round"
+        android:supportsRtl="true"
+        android:theme="@style/AppTheme">
+
+        <activity
+            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation|density"
+            android:name=".MainActivity"
+            android:label="@string/title_activity_main"
+            android:theme="@style/AppTheme.NoActionBarLaunch"
+            android:launchMode="singleTask"
+            android:exported="true">
+
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN" />
+                <category android:name="android.intent.category.LAUNCHER" />
+            </intent-filter>
+
+        </activity>
+
+        <provider
+            android:name="androidx.core.content.FileProvider"
+            android:authorities="${applicationId}.fileprovider"
+            android:exported="false"
+            android:grantUriPermissions="true">
+            <meta-data
+                android:name="android.support.FILE_PROVIDER_PATHS"
+                android:resource="@xml/file_paths"></meta-data>
+        </provider>
+    </application>
+
+    <!-- Permissions -->
+
+    <uses-permission android:name="android.permission.INTERNET" />
+</manifest>

android/app/src/main/java/com/takerofnotes/app/MainActivity.java

@@ -0,0 +1,5 @@
+package com.takerofnotes.app;
+
+import com.getcapacitor.BridgeActivity;
+
+public class MainActivity extends BridgeActivity {}

android/app/src/main/res/drawable-v24/ic_launcher_foreground.xml

@@ -0,0 +1,34 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportHeight="108"
+    android:viewportWidth="108">
+    <path
+        android:fillType="evenOdd"
+        android:pathData="M32,64C32,64 38.39,52.99 44.13,50.95C51.37,48.37 70.14,49.57 70.14,49.57L108.26,87.69L108,109.01L75.97,107.97L32,64Z"
+        android:strokeColor="#00000000"
+        android:strokeWidth="1">
+        <aapt:attr name="android:fillColor">
+            <gradient
+                android:endX="78.5885"
+                android:endY="90.9159"
+                android:startX="48.7653"
+                android:startY="61.0927"
+                android:type="linear">
+                <item
+                    android:color="#44000000"
+                    android:offset="0.0" />
+                <item
+                    android:color="#00000000"
+                    android:offset="1.0" />
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path
+        android:fillColor="#FFFFFF"
+        android:fillType="nonZero"
+        android:pathData="M66.94,46.02L66.94,46.02C72.44,50.07 76,56.61 76,64L32,64C32,56.61 35.56,50.11 40.98,46.06L36.18,41.19C35.45,40.45 35.45,39.3 36.18,38.56C36.91,37.81 38.05,37.81 38.78,38.56L44.25,44.05C47.18,42.57 50.48,41.71 54,41.71C57.48,41.71 60.78,42.57 63.68,44.05L69.11,38.56C69.84,37.81 70.98,37.81 71.71,38.56C72.44,39.3 72.44,40.45 71.71,41.19L66.94,46.02ZM62.94,56.92C64.08,56.92 65,56.01 65,54.88C65,53.76 64.08,52.85 62.94,52.85C61.8,52.85 60.88,53.76 60.88,54.88C60.88,56.01 61.8,56.92 62.94,56.92ZM45.06,56.92C46.2,56.92 47.13,56.01 47.13,54.88C47.13,53.76 46.2,52.85 45.06,52.85C43.92,52.85 43,53.76 43,54.88C43,56.01 43.92,56.92 45.06,56.92Z"
+        android:strokeColor="#00000000"
+        android:strokeWidth="1" />
+</vector>

android/app/src/main/res/drawable/ic_launcher_background.xml

@@ -0,0 +1,170 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportHeight="108"
+    android:viewportWidth="108">
+    <path
+        android:fillColor="#26A69A"
+        android:pathData="M0,0h108v108h-108z" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M9,0L9,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,0L19,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M29,0L29,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M39,0L39,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M49,0L49,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M59,0L59,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M69,0L69,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M79,0L79,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M89,0L89,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M99,0L99,108"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,9L108,9"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,19L108,19"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,29L108,29"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,39L108,39"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,49L108,49"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,59L108,59"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,69L108,69"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,79L108,79"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,89L108,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M0,99L108,99"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,29L89,29"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,39L89,39"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,49L89,49"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,59L89,59"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,69L89,69"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M19,79L89,79"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M29,19L29,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M39,19L39,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M49,19L49,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M59,19L59,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M69,19L69,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+    <path
+        android:fillColor="#00000000"
+        android:pathData="M79,19L79,89"
+        android:strokeColor="#33FFFFFF"
+        android:strokeWidth="0.8" />
+</vector>

android/app/src/main/res/layout/activity_main.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    tools:context=".MainActivity">
+
+    <WebView
+        android:layout_width="match_parent"
+        android:layout_height="match_parent" />
+</androidx.coordinatorlayout.widget.CoordinatorLayout>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/values/ic_launcher_background.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="ic_launcher_background">#FFFFFF</color>
+</resources>

android/app/src/main/res/values/strings.xml

@@ -0,0 +1,7 @@
+<?xml version='1.0' encoding='utf-8'?>
+<resources>
+    <string name="app_name">Taker of Notes</string>
+    <string name="title_activity_main">Taker of Notes</string>
+    <string name="package_name">com.takerofnotes.app</string>
+    <string name="custom_url_scheme">com.takerofnotes.app</string>
+</resources>

android/app/src/main/res/values/styles.xml

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+
+    <!-- Base application theme. -->
+    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
+        <!-- Customize your theme here. -->
+        <item name="colorPrimary">@color/colorPrimary</item>
+        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
+        <item name="colorAccent">@color/colorAccent</item>
+    </style>
+
+    <style name="AppTheme.NoActionBar" parent="Theme.AppCompat.DayNight.NoActionBar">
+        <item name="windowActionBar">false</item>
+        <item name="windowNoTitle">true</item>
+        <item name="android:background">@null</item>
+    </style>
+
+
+    <style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
+        <item name="android:background">@drawable/splash</item>
+    </style>
+</resources>

android/app/src/main/res/xml/file_paths.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<paths xmlns:android="http://schemas.android.com/apk/res/android">
+    <external-path name="my_images" path="." />
+    <cache-path name="my_cache_images" path="." />
+</paths>

android/app/src/test/java/com/getcapacitor/myapp/ExampleUnitTest.java

@@ -0,0 +1,18 @@
+package com.getcapacitor.myapp;
+
+import static org.junit.Assert.*;
+
+import org.junit.Test;
+
+/**
+ * Example local unit test, which will execute on the development machine (host).
+ *
+ * @see <a href="http://d.android.com/tools/testing">Testing documentation</a>
+ */
+public class ExampleUnitTest {
+
+    @Test
+    public void addition_isCorrect() throws Exception {
+        assertEquals(4, 2 + 2);
+    }
+}

android/build.gradle

@@ -0,0 +1,29 @@
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+
+buildscript {
+    
+    repositories {
+        google()
+        mavenCentral()
+    }
+    dependencies {
+        classpath 'com.android.tools.build:gradle:8.13.0'
+        classpath 'com.google.gms:google-services:4.4.4'
+
+        // NOTE: Do not place your application dependencies here; they belong
+        // in the individual module build.gradle files
+    }
+}
+
+apply from: "variables.gradle"
+
+allprojects {
+    repositories {
+        google()
+        mavenCentral()
+    }
+}
+
+task clean(type: Delete) {
+    delete rootProject.buildDir
+}

android/capacitor.settings.gradle

@@ -0,0 +1,6 @@
+// DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
+include ':capacitor-android'
+project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/android/capacitor')
+
+include ':capacitor-preferences'
+project(':capacitor-preferences').projectDir = new File('../node_modules/@capacitor/preferences/android')

android/gradle.properties

@@ -0,0 +1,22 @@
+# 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.
+org.gradle.jvmargs=-Xmx1536m
+
+# 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

android/gradle/wrapper/gradle-wrapper.properties

@@ -0,0 +1,7 @@
+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.14.3-all.zip
+networkTimeout=10000
+validateDistributionUrl=true
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

android/gradlew

@@ -0,0 +1,251 @@
+#!/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\n' "$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="\\\"\\\""
+
+
+# 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, 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" \
+        -jar "$APP_HOME/gradle/wrapper/gradle-wrapper.jar" \
+        "$@"
+
+# 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" "$@"

android/gradlew.bat

@@ -0,0 +1,94 @@
+@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=
+
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" -jar "%APP_HOME%\gradle\wrapper\gradle-wrapper.jar" %*
+
+: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

android/settings.gradle

@@ -0,0 +1,5 @@
+include ':app'
+include ':capacitor-cordova-android-plugins'
+project(':capacitor-cordova-android-plugins').projectDir = new File('./capacitor-cordova-android-plugins/')
+
+apply from: 'capacitor.settings.gradle'

android/variables.gradle

@@ -0,0 +1,16 @@
+ext {
+    minSdkVersion = 24
+    compileSdkVersion = 36
+    targetSdkVersion = 36
+    androidxActivityVersion = '1.11.0'
+    androidxAppCompatVersion = '1.7.1'
+    androidxCoordinatorLayoutVersion = '1.3.0'
+    androidxCoreVersion = '1.17.0'
+    androidxFragmentVersion = '1.8.9'
+    coreSplashScreenVersion = '1.2.0'
+    androidxWebkitVersion = '1.14.0'
+    junitVersion = '4.13.2'
+    androidxJunitVersion = '1.3.0'
+    androidxEspressoCoreVersion = '3.7.0'
+    cordovaAndroidVersion = '14.0.1'
+}

bin/generateEncryptionKey.js

@@ -1,3 +0,0 @@
-import crypto from 'crypto'
-
-console.log(crypto.randomBytes(32).toString('hex'))

bin/uploadArtifacts.js

@@ -0,0 +1,140 @@
+import fs from 'fs'
+import path from 'path'
+import { execSync } from 'child_process'
+import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3'
+import dotenv from 'dotenv'
+
+dotenv.config({ quiet: true })
+
+const DIST_DIR = path.resolve('dist')
+const BUCKET = 'dist'
+
+const client = new S3Client({
+    region: 'us-east-1',
+    endpoint: 'https://s3.takerofnotes.com',
+    forcePathStyle: true,
+    credentials: {
+        accessKeyId: process.env.AWS_ACCESS_KEY_ID,
+        secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
+    },
+})
+
+function getContentType(file) {
+    if (file.endsWith('.yml')) return 'text/yaml'
+    if (file.endsWith('.json')) return 'application/json'
+    if (file.endsWith('.AppImage')) return 'application/octet-stream'
+    if (file.endsWith('.deb')) return 'application/vnd.debian.binary-package'
+    if (file.endsWith('.exe'))
+        return 'application/vnd.microsoft.portable-executable'
+    if (file.endsWith('.dmg')) return 'application/x-apple-diskimage'
+    return 'application/octet-stream'
+}
+
+function getCurrentTag() {
+    try {
+        const tag = execSync('git describe --tags --exact-match 2>/dev/null', {
+            encoding: 'utf8',
+            stdio: ['pipe', 'pipe', 'pipe'],
+        }).trim()
+        return tag
+    } catch {
+        return null
+    }
+}
+
+function isGitTagDirty() {
+    try {
+        const status = execSync('git status --porcelain', {
+            encoding: 'utf8',
+            stdio: ['pipe', 'pipe', 'pipe'],
+        }).trim()
+        return status.length > 0
+    } catch {
+        return true
+    }
+}
+
+async function uploadFile(filePath, platform, version) {
+    const fileStream = fs.createReadStream(filePath)
+    const fileName = path.basename(filePath)
+    const key = `${platform}/${version}/${fileName}`
+
+    console.log(`Uploading ${fileName} → ${key}`)
+
+    await client.send(
+        new PutObjectCommand({
+            Bucket: BUCKET,
+            Key: key,
+            Body: fileStream,
+            ContentType: getContentType(fileName),
+        }),
+    )
+}
+
+async function main() {
+    const platform = process.argv[2]
+    const version = process.argv[3]
+
+    if (!platform || !version) {
+        console.error('Usage: node uploadArtifacts.js <platform> <version>')
+        console.error('Example: node uploadArtifacts.js win 1.0.0')
+        process.exit(1)
+    }
+
+    const currentTag = getCurrentTag()
+    if (!currentTag) {
+        console.log(
+            'No git tag found. Skipping upload (artifacts are only uploaded on tagged commits).',
+        )
+        return
+    }
+
+    if (currentTag !== version && !currentTag.startsWith(version)) {
+        console.log(
+            `Git tag (${currentTag}) does not match version (${version}). Skipping upload.`,
+        )
+        return
+    }
+
+    // if (isGitTagDirty()) {
+    //     console.log('Git working directory is dirty. Skipping upload.')
+    //     return
+    // }
+
+    console.log(
+        `Uploading artifacts for ${platform} v${version} (tag: ${currentTag})`,
+    )
+
+    if (!fs.existsSync(DIST_DIR)) {
+        throw new Error('dist directory not found. Run build first.')
+    }
+
+    const files = fs.readdirSync(DIST_DIR)
+
+    const uploadTargets = files.filter((file) => {
+        return (
+            file.endsWith('.yml') ||
+            file.endsWith('.AppImage') ||
+            file.endsWith('.deb') ||
+            file.endsWith('.exe') ||
+            file.endsWith('.dmg')
+        )
+    })
+
+    if (uploadTargets.length === 0) {
+        console.log('No artifacts found to upload.')
+        return
+    }
+
+    for (const file of uploadTargets) {
+        const fullPath = path.join(DIST_DIR, file)
+        await uploadFile(fullPath, platform, version)
+    }
+
+    console.log('Upload complete.')
+}
+
+main().catch((err) => {
+    console.error(err)
+    process.exit(1)
+})

capacitor.config.json

@@ -0,0 +1,5 @@
+{
+    "appId": "com.takerofnotes.app",
+    "appName": "Taker of Notes",
+    "webDir": "dist/renderer"
+}

dev-app-update.yml

@@ -1,3 +0,0 @@
-provider: generic
-url: https://example.com/auto-updates
-updaterCacheDirName: app.takerofnotes.com-updater

electron-builder.yml

@@ -30,13 +30,11 @@ dmg:
 linux:
     target:
         - AppImage
-        - snap
+        # - snap
         - deb
     maintainer: electronjs.org
     category: Utility
 appImage:
     artifactName: ${name}-${version}.${ext}
 npmRebuild: false
-publish:
-    provider: generic
-    url: https://example.com/auto-updates
+publish: null

out/main/index.js

@@ -1,8 +1,11 @@
 import "dotenv/config";
 import { electronApp, optimizer, is } from "@electron-toolkit/utils";
-import { app, ipcMain, BrowserWindow, shell } from "electron";
+import { app, ipcMain, BrowserWindow, dialog, shell } from "electron";
 import filesystemPlugin from "@takerofnotes/plugin-filesystem";
 import supabasePlugin from "@takerofnotes/plugin-supabase";
+import s3Plugin from "@takerofnotes/plugin-s3";
+import postgresPlugin from "@takerofnotes/plugin-postgre-sql";
+import Ajv from "ajv";
 import sodium from "libsodium-wrappers";
 import { v4 } from "uuid";
 import { Index } from "flexsearch";
@@ -72,13 +75,60 @@ class PluginRegistry {
     }));
   }
 }
+const ajv = new Ajv({ allErrors: true, strict: false });
 const getDefaultConfig = () => {
   return {
     activeAdapter: "browser",
     theme: "dark"
   };
 };
-const createConfigManager = (storage) => {
+const CONFIG_SCHEMA = {
+  type: "object",
+  properties: {
+    activeAdapter: { type: "string" },
+    theme: { type: "string", enum: ["dark", "light"] },
+    encryptionKey: { type: "string" },
+    adapters: { type: "object" }
+  },
+  required: ["activeAdapter"],
+  additionalProperties: true
+};
+const validateConfig = ajv.compile(CONFIG_SCHEMA);
+const convertSchemaToJson = (schemaArray) => {
+  const properties = {};
+  const required = [];
+  for (const field of schemaArray) {
+    properties[field.key] = { type: "string" };
+    if (field.required) {
+      required.push(field.key);
+    }
+  }
+  return {
+    type: "object",
+    properties,
+    required,
+    additionalProperties: false
+  };
+};
+const validateAdapterConfigs = (adapters, pluginManager) => {
+  if (!adapters || !pluginManager) return { valid: true, errors: [] };
+  const errors = [];
+  for (const [adapterId, adapterConfig] of Object.entries(adapters)) {
+    const plugin = pluginManager.getPlugin(adapterId);
+    if (!plugin?.configSchema) continue;
+    const schema = convertSchemaToJson(plugin.configSchema);
+    const validate = ajv.compile(schema);
+    const valid = validate(adapterConfig);
+    if (!valid) {
+      const adapterErrors = validate.errors.map(
+        (e) => `${adapterId}${e.instancePath}: ${e.message}`
+      );
+      errors.push(...adapterErrors);
+    }
+  }
+  return { valid: errors.length === 0, errors };
+};
+const createConfigManager = (storage, pluginManager) => {
   let config = null;
   return {
     async loadConfig() {
@@ -94,6 +144,20 @@ const createConfigManager = (storage) => {
       return config;
     },
     async setConfig(newConfig) {
+      const valid = validateConfig(newConfig);
+      if (!valid) {
+        const errors = validateConfig.errors.map((e) => `${e.instancePath || "root"}: ${e.message}`).join("; ");
+        throw new Error(`Config validation failed: ${errors}`);
+      }
+      const adapterValidation = validateAdapterConfigs(
+        newConfig.adapters,
+        pluginManager
+      );
+      if (!adapterValidation.valid) {
+        throw new Error(
+          `Adapter config validation failed: ${adapterValidation.errors.join("; ")}`
+        );
+      }
       config = newConfig;
       await storage.save(newConfig);
     },
@@ -109,8 +173,10 @@ class NotesAPI {
     }
     this.adapter = adapter;
     this.notesCache = /* @__PURE__ */ new Map();
+    this.categories = /* @__PURE__ */ new Set();
     this.encryptionKey = encryptionKey;
     this._sodiumReady = false;
+    this._decryptionFailures = [];
     this.index = new Index({
       tokenize: "forward"
     });
@@ -122,11 +188,10 @@ class NotesAPI {
     }
   }
   _hexToUint8Array(hex) {
-    const bytes = new Uint8Array(hex.length / 2);
-    for (let i = 0; i < bytes.length; i++) {
-      bytes[i] = parseInt(hex.substr(i * 2, 2), 16);
-    }
-    return bytes;
+    return Uint8Array.from(
+      hex.match(/.{1,2}/g),
+      (byte) => parseInt(byte, 16)
+    );
   }
   _concatUint8Arrays(a, b) {
     const result = new Uint8Array(a.length + b.length);
@@ -135,19 +200,11 @@ class NotesAPI {
     return result;
   }
   _uint8ArrayToBase64(bytes) {
-    let binary = "";
-    for (let i = 0; i < bytes.length; i++) {
-      binary += String.fromCharCode(bytes[i]);
-    }
-    return btoa(binary);
+    return btoa(String.fromCharCode(...bytes));
   }
   _base64ToUint8Array(base64) {
     const binary = atob(base64);
-    const bytes = new Uint8Array(binary.length);
-    for (let i = 0; i < binary.length; i++) {
-      bytes[i] = binary.charCodeAt(i);
-    }
-    return bytes;
+    return Uint8Array.from(binary, (c) => c.charCodeAt(0));
   }
   _encrypt(note) {
     if (!this.encryptionKey) {
@@ -216,18 +273,28 @@ class NotesAPI {
     await this._initSodium();
     await this.adapter.init();
     this.notesCache.clear();
+    this.categories.clear();
+    this._decryptionFailures = [];
     const encryptedNotes = await this.adapter.getAll();
     for (const encryptedNote of encryptedNotes) {
+      const noteId = encryptedNote.id || "unknown";
       try {
         const note = this._decrypt(encryptedNote.data || encryptedNote);
         this.notesCache.set(note.id, note);
+        if (note.category) {
+          this.categories.add(note.category);
+        }
         const searchText = note.plainText || this._extractPlainText(note.content);
         this.index.add(note.id, note.title + "\n" + searchText);
       } catch (error) {
         console.error("Failed to decrypt note:", error);
+        this._decryptionFailures.push(noteId);
       }
     }
   }
+  getDecryptionFailures() {
+    return [...this._decryptionFailures];
+  }
   _extractPlainText(content) {
     if (!content) return "";
     if (typeof content === "string") return content;
@@ -239,13 +306,7 @@ class NotesAPI {
     return extractText(content);
   }
   getCategories() {
-    const categories = /* @__PURE__ */ new Set();
-    for (const note of this.notesCache.values()) {
-      if (note.category) {
-        categories.add(note.category);
-      }
-    }
-    return Array.from(categories).sort();
+    return Array.from(this.categories).sort();
   }
   getCategoryNotes(categoryName = null) {
     return Array.from(this.notesCache.values()).filter((n) => n.category === categoryName).sort((a, b) => new Date(b.updatedAt) - new Date(a.updatedAt)).map((n) => ({ ...n }));
@@ -271,14 +332,32 @@ class NotesAPI {
       data: this._encrypt(note)
     };
     this.notesCache.set(id, note);
+    if (note.category) {
+      this.categories.add(note.category);
+    }
     this.index.add(id, note.title + "\n" + plainText);
     await this.adapter.create(encryptedNote);
     return note;
   }
   async deleteNote(id) {
+    const note = this.notesCache.get(id);
+    const category = note?.category;
     await this.adapter.delete(id);
     this.notesCache.delete(id);
     this.index.remove(id);
+    if (category) {
+      const notesWithCategory = Array.from(
+        this.notesCache.values()
+      ).filter((n) => n.category === category);
+      if (notesWithCategory.length === 0) {
+        this.categories.delete(category);
+      }
+    }
+    if (this._decryptionFailures.includes(id)) {
+      this._decryptionFailures = this._decryptionFailures.filter(
+        (id2) => id2 !== id2
+      );
+    }
   }
   async updateNote(id, updates = {}) {
     const note = this.notesCache.get(id);
@@ -289,6 +368,7 @@ class NotesAPI {
         throw new Error(`Invalid update field: ${key}`);
       }
     }
+    const oldCategory = note.category;
     const updatedNote = {
       ...note,
       ...updates,
@@ -299,6 +379,19 @@ class NotesAPI {
       data: this._encrypt(updatedNote)
     };
     this.notesCache.set(id, updatedNote);
+    if (updates.category !== void 0) {
+      if (oldCategory) {
+        const notesWithOldCategory = Array.from(
+          this.notesCache.values()
+        ).filter((n) => n.category === oldCategory && n.id !== id);
+        if (notesWithOldCategory.length === 0) {
+          this.categories.delete(oldCategory);
+        }
+      }
+      if (updatedNote.category) {
+        this.categories.add(updatedNote.category);
+      }
+    }
     const searchText = updatedNote.plainText || this._extractPlainText(updatedNote.content);
     this.index.update(id, updatedNote.title + "\n" + searchText);
     await this.adapter.update(encryptedNote);
@@ -317,48 +410,45 @@ const generateEncryptionKey = () => {
   crypto.getRandomValues(array);
   return Array.from(array).map((b) => b.toString(16).padStart(2, "0")).join("");
 };
-const initPluginManager = (runtime, plugins, config) => {
+const initPluginManager = (runtime, plugins) => {
   const registry = new PluginRegistry();
   for (const plugin of plugins) {
     registry.register(plugin);
   }
-  const manager = createPluginManager(registry);
-  manager.setActivePlugin(
-    config.activeAdapter,
-    config.adapters[config.activeAdapter]
-  );
-  return manager;
+  return createPluginManager(registry);
 };
-const initConfigManager = async (runtime) => {
+const initConfigManager = async (runtime, pluginManager) => {
   let storage;
   {
     const { createNodeStorage } = await import("./NodeStorage-B8VFtrTS.js");
     const filesystemPlugin2 = (await import("@takerofnotes/plugin-filesystem")).default;
     storage = createNodeStorage(filesystemPlugin2);
   }
-  return createConfigManager(storage);
+  return createConfigManager(storage, pluginManager);
 };
 const initializeCore = async (runtime, { plugins }) => {
-  const configManager = await initConfigManager();
+  const pluginManager = initPluginManager(runtime, plugins);
+  const configManager = await initConfigManager(runtime, pluginManager);
   const config = await configManager.loadConfig();
-  const pluginManager = initPluginManager(runtime, plugins, config);
+  const activeConfig = config.adapters?.[config.activeAdapter] || {};
+  pluginManager.setActivePlugin(config.activeAdapter, activeConfig);
   let notesAPI = null;
   let initPromise = null;
   const getNotesAPI = async () => {
     if (notesAPI) return notesAPI;
     if (!initPromise) {
       initPromise = (async () => {
-        const config2 = await configManager.loadConfig();
-        let encryptionKey = config2?.encryptionKey;
+        const latestConfig = await configManager.loadConfig();
+        let encryptionKey = latestConfig?.encryptionKey;
         if (!encryptionKey) {
           encryptionKey = generateEncryptionKey();
           await configManager.setConfig({
-            ...config2,
+            ...latestConfig,
             encryptionKey
           });
         }
-        const pluginId = config2?.activeAdapter || "filesystem";
-        const adapterConfig = config2?.adapters?.[pluginId] || {};
+        const pluginId = latestConfig?.activeAdapter || "filesystem";
+        const adapterConfig = latestConfig?.adapters?.[pluginId] || {};
         const adapter = pluginManager.getAdapter(
           pluginId,
           adapterConfig
@@ -439,7 +529,12 @@ app.whenReady().then(async () => {
   const { pluginManager, configManager } = await initializeCore(
     "electron-main",
     {
-      plugins: [filesystemPlugin, supabasePlugin]
+      plugins: [
+        filesystemPlugin,
+        s3Plugin,
+        postgresPlugin,
+        supabasePlugin
+      ]
     }
   );
   ipcMain.handle("pluginManager:call", async (_, method, ...args) => {
@@ -482,6 +577,12 @@ app.whenReady().then(async () => {
       );
     }
   });
+  ipcMain.handle("open-directory-dialog", async () => {
+    const result = await dialog.showOpenDialog({
+      properties: ["openDirectory"]
+    });
+    return result.canceled ? null : result.filePaths[0];
+  });
   electronApp.setAppUserModelId("com.electron");
   app.on("browser-window-created", (_, window) => {
     optimizer.watchWindowShortcuts(window);

out/preload/index.mjs

@@ -38,6 +38,9 @@ const api = {
   },
   moveClosed: () => {
     ipcRenderer.invoke("move-closed");
+  },
+  openDirectoryDialog: () => {
+    return ipcRenderer.invoke("open-directory-dialog");
   }
 };
 if (process.contextIsolated) {

package.json

@@ -19,17 +19,25 @@
         "build": "electron-vite build",
         "build:web": "vite build",
         "postinstall": "electron-builder install-app-deps",
-        "build:unpack": "npm run build && electron-builder --dir",
         "build:win": "npm run build && electron-builder --win",
         "build:mac": "npm run build && electron-builder --mac",
-        "build:linux": "npm run build && electron-builder --linux"
+        "build:linux": "npm run build && electron-builder --linux",
+        "release:win": "node bin/uploadArtifacts.js win $npm_package_version",
+        "release:mac": "node bin/uploadArtifacts.js mac $npm_package_version",
+        "release:linux": "node bin/uploadArtifacts.js linux $npm_package_version"
     },
     "dependencies": {
+        "@capacitor/android": "^8.3.0",
+        "@capacitor/core": "^8.3.0",
+        "@capacitor/ios": "^8.3.0",
+        "@capacitor/preferences": "^8.0.1",
         "@electron-toolkit/preload": "^3.0.2",
         "@electron-toolkit/utils": "^4.0.0",
         "@fuzzco/font-loader": "^1.0.2",
         "@takerofnotes/plugin-browser": "^0.2.0",
         "@takerofnotes/plugin-filesystem": "^0.3.0",
+        "@takerofnotes/plugin-postgre-sql": "^0.1.0",
+        "@takerofnotes/plugin-s3": "^0.2.0",
         "@takerofnotes/plugin-supabase": "^0.2.0",
         "@tiptap/extension-code-block-lowlight": "^3.20.0",
         "@tiptap/extension-document": "^3.19.0",
@@ -39,6 +47,7 @@
         "@tiptap/starter-kit": "^3.19.0",
         "@tiptap/vue-3": "^3.19.0",
         "@vueuse/core": "^14.2.1",
+        "ajv": "^6.14.0",
         "archiver": "^7.0.1",
         "dotenv": "^17.3.1",
         "electron-updater": "^6.3.9",
@@ -57,6 +66,8 @@
         "vue-router": "^5.0.3"
     },
     "devDependencies": {
+        "@aws-sdk/client-s3": "^3.1025.0",
+        "@capacitor/cli": "^8.3.0",
         "@vitejs/plugin-vue": "^6.0.2",
         "electron": "^39.2.6",
         "electron-builder": "^26.0.12",

src/core/CapacitorStorage.js

@@ -0,0 +1,20 @@
+import { Preferences } from '@capacitor/preferences'
+
+const CONFIG_KEY = 'app_config'
+
+export function createCapacitorStorage() {
+    return {
+        async load() {
+            const { value } = await Preferences.get({ key: CONFIG_KEY })
+            return value ? JSON.parse(value) : null
+        },
+        async save(data) {
+            await Preferences.set({
+                key: CONFIG_KEY,
+                value: JSON.stringify(data),
+            })
+        },
+    }
+}
+
+export default createCapacitorStorage

src/core/ConfigManager.js

@@ -1,3 +1,7 @@
+import Ajv from 'ajv'
+
+const ajv = new Ajv({ allErrors: true, strict: false })
+
 const getDefaultConfig = () => {
     return {
         activeAdapter: 'browser',
@@ -5,7 +9,65 @@ const getDefaultConfig = () => {
     }
 }
 
-export const createConfigManager = (storage) => {
+const CONFIG_SCHEMA = {
+    type: 'object',
+    properties: {
+        activeAdapter: { type: 'string' },
+        theme: { type: 'string', enum: ['dark', 'light'] },
+        encryptionKey: { type: 'string' },
+        adapters: { type: 'object' },
+    },
+    required: ['activeAdapter'],
+    additionalProperties: true,
+}
+
+const validateConfig = ajv.compile(CONFIG_SCHEMA)
+
+const convertSchemaToJson = (schemaArray) => {
+    const properties = {}
+    const required = []
+
+    for (const field of schemaArray) {
+        properties[field.key] = { type: 'string' }
+
+        if (field.required) {
+            required.push(field.key)
+        }
+    }
+
+    return {
+        type: 'object',
+        properties,
+        required,
+        additionalProperties: false,
+    }
+}
+
+const validateAdapterConfigs = (adapters, pluginManager) => {
+    if (!adapters || !pluginManager) return { valid: true, errors: [] }
+
+    const errors = []
+
+    for (const [adapterId, adapterConfig] of Object.entries(adapters)) {
+        const plugin = pluginManager.getPlugin(adapterId)
+        if (!plugin?.configSchema) continue
+
+        const schema = convertSchemaToJson(plugin.configSchema)
+        const validate = ajv.compile(schema)
+        const valid = validate(adapterConfig)
+
+        if (!valid) {
+            const adapterErrors = validate.errors.map(
+                (e) => `${adapterId}${e.instancePath}: ${e.message}`,
+            )
+            errors.push(...adapterErrors)
+        }
+    }
+
+    return { valid: errors.length === 0, errors }
+}
+
+export const createConfigManager = (storage, pluginManager) => {
     let config = null
 
     return {
@@ -27,6 +89,24 @@ export const createConfigManager = (storage) => {
         },
 
         async setConfig(newConfig) {
+            const valid = validateConfig(newConfig)
+            if (!valid) {
+                const errors = validateConfig.errors
+                    .map((e) => `${e.instancePath || 'root'}: ${e.message}`)
+                    .join('; ')
+                throw new Error(`Config validation failed: ${errors}`)
+            }
+
+            const adapterValidation = validateAdapterConfigs(
+                newConfig.adapters,
+                pluginManager,
+            )
+            if (!adapterValidation.valid) {
+                throw new Error(
+                    `Adapter config validation failed: ${adapterValidation.errors.join('; ')}`,
+                )
+            }
+
             config = newConfig
             await storage.save(newConfig)
         },

src/core/IpcAdapter.js

@@ -1,7 +1,5 @@
 export default class IpcAdapter {
-    constructor() {
-        this._methods = ['init', 'getAll', 'create', 'update', 'delete']
-    }
+    constructor() {}
 
     async init() {
         return await window.api.adapterCall('init')

src/core/NotesAPI.js

@@ -10,8 +10,10 @@ export default class NotesAPI {
 
         this.adapter = adapter
         this.notesCache = new Map()
+        this.categories = new Set()
         this.encryptionKey = encryptionKey
         this._sodiumReady = false
+        this._decryptionFailures = []
 
         this.index = new Index({
             tokenize: 'forward',
@@ -26,11 +28,9 @@ export default class NotesAPI {
     }
 
     _hexToUint8Array(hex) {
-        const bytes = new Uint8Array(hex.length / 2)
-        for (let i = 0; i < bytes.length; i++) {
-            bytes[i] = parseInt(hex.substr(i * 2, 2), 16)
-        }
-        return bytes
+        return Uint8Array.from(hex.match(/.{1,2}/g), (byte) =>
+            parseInt(byte, 16),
+        )
     }
 
     _concatUint8Arrays(a, b) {
@@ -41,20 +41,12 @@ export default class NotesAPI {
     }
 
     _uint8ArrayToBase64(bytes) {
-        let binary = ''
-        for (let i = 0; i < bytes.length; i++) {
-            binary += String.fromCharCode(bytes[i])
-        }
-        return btoa(binary)
+        return btoa(String.fromCharCode(...bytes))
     }
 
     _base64ToUint8Array(base64) {
         const binary = atob(base64)
-        const bytes = new Uint8Array(binary.length)
-        for (let i = 0; i < binary.length; i++) {
-            bytes[i] = binary.charCodeAt(i)
-        }
-        return bytes
+        return Uint8Array.from(binary, (c) => c.charCodeAt(0))
     }
 
     _encrypt(note) {
@@ -142,23 +134,34 @@ export default class NotesAPI {
         await this._initSodium()
         await this.adapter.init()
         this.notesCache.clear()
+        this.categories.clear()
+        this._decryptionFailures = []
 
         const encryptedNotes = await this.adapter.getAll()
 
         for (const encryptedNote of encryptedNotes) {
+            const noteId = encryptedNote.id || 'unknown'
             try {
                 const note = this._decrypt(encryptedNote.data || encryptedNote)
 
                 this.notesCache.set(note.id, note)
+                if (note.category) {
+                    this.categories.add(note.category)
+                }
                 const searchText =
                     note.plainText || this._extractPlainText(note.content)
                 this.index.add(note.id, note.title + '\n' + searchText)
             } catch (error) {
                 console.error('Failed to decrypt note:', error)
+                this._decryptionFailures.push(noteId)
             }
         }
     }
 
+    getDecryptionFailures() {
+        return [...this._decryptionFailures]
+    }
+
     _extractPlainText(content) {
         if (!content) return ''
         if (typeof content === 'string') return content
@@ -173,15 +176,7 @@ export default class NotesAPI {
     }
 
     getCategories() {
-        const categories = new Set()
-
-        for (const note of this.notesCache.values()) {
-            if (note.category) {
-                categories.add(note.category)
-            }
-        }
-
-        return Array.from(categories).sort()
+        return Array.from(this.categories).sort()
     }
 
     getCategoryNotes(categoryName = null) {
@@ -193,6 +188,7 @@ export default class NotesAPI {
 
     getNote(id) {
         const note = this.notesCache.get(id)
+
         return note ? { ...note } : null
     }
 
@@ -216,6 +212,9 @@ export default class NotesAPI {
         }
 
         this.notesCache.set(id, note)
+        if (note.category) {
+            this.categories.add(note.category)
+        }
         this.index.add(id, note.title + '\n' + plainText)
 
         await this.adapter.create(encryptedNote)
@@ -224,10 +223,30 @@ export default class NotesAPI {
     }
 
     async deleteNote(id) {
+        const note = this.notesCache.get(id)
+        const category = note?.category
+
         await this.adapter.delete(id)
 
         this.notesCache.delete(id)
         this.index.remove(id)
+
+        // Delete category if needed
+        if (category) {
+            const notesWithCategory = Array.from(
+                this.notesCache.values(),
+            ).filter((n) => n.category === category)
+            if (notesWithCategory.length === 0) {
+                this.categories.delete(category)
+            }
+        }
+
+        // Update decryption failures
+        if (this._decryptionFailures.includes(id)) {
+            this._decryptionFailures = this._decryptionFailures.filter(
+                (id) => id !== id,
+            )
+        }
     }
 
     async updateNote(id, updates = {}) {
@@ -242,6 +261,8 @@ export default class NotesAPI {
             }
         }
 
+        const oldCategory = note.category
+
         const updatedNote = {
             ...note,
             ...updates,
@@ -255,6 +276,20 @@ export default class NotesAPI {
 
         this.notesCache.set(id, updatedNote)
 
+        if (updates.category !== undefined) {
+            if (oldCategory) {
+                const notesWithOldCategory = Array.from(
+                    this.notesCache.values(),
+                ).filter((n) => n.category === oldCategory && n.id !== id)
+                if (notesWithOldCategory.length === 0) {
+                    this.categories.delete(oldCategory)
+                }
+            }
+            if (updatedNote.category) {
+                this.categories.add(updatedNote.category)
+            }
+        }
+
         const searchText =
             updatedNote.plainText || this._extractPlainText(updatedNote.content)
 

src/core/index.js

@@ -18,7 +18,7 @@ const generateEncryptionKey = () => {
         .join('')
 }
 
-const initPluginManager = (runtime, plugins, config) => {
+const initPluginManager = (runtime, plugins) => {
     if (runtime === 'electron-renderer') return createPluginManagerClient()
 
     const registry = new PluginRegistry()
@@ -27,14 +27,10 @@ const initPluginManager = (runtime, plugins, config) => {
         registry.register(plugin)
     }
 
-    const manager = createPluginManager(registry)
-    const activeConfig = config.adapters?.[config.activeAdapter] || {}
-    manager.setActivePlugin(config.activeAdapter, activeConfig)
-
-    return manager
+    return createPluginManager(registry)
 }
 
-const initConfigManager = async (runtime) => {
+const initConfigManager = async (runtime, pluginManager) => {
     if (runtime === 'electron-renderer') return createConfigManagerClient()
 
     let storage
@@ -46,41 +42,46 @@ const initConfigManager = async (runtime) => {
         storage = createNodeStorage(filesystemPlugin)
     } else if (runtime === 'web') {
         storage = createWebStorage()
+    } else if (runtime === 'capacitor') {
+        const { createCapacitorStorage } = await import('./CapacitorStorage.js')
+        storage = createCapacitorStorage()
     }
 
-    return createConfigManager(storage)
+    return createConfigManager(storage, pluginManager)
 }
 
 export const initializeCore = async (runtime, { plugins }) => {
-    const configManager = await initConfigManager(runtime)
+    const pluginManager = initPluginManager(runtime, plugins)
+    const configManager = await initConfigManager(runtime, pluginManager)
     const config = await configManager.loadConfig()
-    const pluginManager = initPluginManager(runtime, plugins, config)
 
-    // -------------------------
-    // NotesAPI bootstrap
-    // -------------------------
+    // Set active plugin
+    const activeConfig = config.adapters?.[config.activeAdapter] || {}
+    pluginManager.setActivePlugin(config.activeAdapter, activeConfig)
+
+    // Create API instance
     let notesAPI = null
     let initPromise = null
-
     const getNotesAPI = async () => {
         if (notesAPI) return notesAPI
 
         if (!initPromise) {
             initPromise = (async () => {
-                const config = await configManager.loadConfig()
+                // Get fresh config to ensure adapters are populated from main process
+                const latestConfig = await configManager.loadConfig()
 
-                let encryptionKey = config?.encryptionKey
+                let encryptionKey = latestConfig?.encryptionKey
 
                 if (!encryptionKey) {
                     encryptionKey = generateEncryptionKey()
                     await configManager.setConfig({
-                        ...config,
+                        ...latestConfig,
                         encryptionKey,
                     })
                 }
 
-                const pluginId = config?.activeAdapter || 'filesystem'
-                const adapterConfig = config?.adapters?.[pluginId] || {}
+                const pluginId = latestConfig?.activeAdapter || 'filesystem'
+                const adapterConfig = latestConfig?.adapters?.[pluginId] || {}
 
                 const adapter = pluginManager.getAdapter(
                     pluginId,

src/main/index.js

@@ -1,8 +1,10 @@
 import 'dotenv/config'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
-import { app, shell, BrowserWindow, ipcMain } from 'electron'
+import { app, shell, BrowserWindow, ipcMain, dialog } from 'electron'
 import filesystemPlugin from '@takerofnotes/plugin-filesystem'
 import supabasePlugin from '@takerofnotes/plugin-supabase'
+import s3Plugin from '@takerofnotes/plugin-s3'
+import postgresPlugin from '@takerofnotes/plugin-postgre-sql'
 import { initializeCore } from '../core/index.js'
 import { join } from 'path'
 
@@ -78,7 +80,12 @@ app.whenReady().then(async () => {
     const { pluginManager, configManager } = await initializeCore(
         'electron-main',
         {
-            plugins: [filesystemPlugin, supabasePlugin],
+            plugins: [
+                filesystemPlugin,
+                s3Plugin,
+                postgresPlugin,
+                supabasePlugin,
+            ],
         },
     )
 
@@ -130,6 +137,13 @@ app.whenReady().then(async () => {
         }
     })
 
+    ipcMain.handle('open-directory-dialog', async () => {
+        const result = await dialog.showOpenDialog({
+            properties: ['openDirectory'],
+        })
+        return result.canceled ? null : result.filePaths[0]
+    })
+
     electronApp.setAppUserModelId('com.electron')
 
     app.on('browser-window-created', (_, window) => {

src/preload/index.js

@@ -44,6 +44,9 @@ const api = {
     moveClosed: () => {
         ipcRenderer.invoke('move-closed')
     },
+    openDirectoryDialog: () => {
+        return ipcRenderer.invoke('open-directory-dialog')
+    },
 }
 
 if (process.contextIsolated) {

src/renderer/src/components/DecryptionWarning.vue

@@ -0,0 +1,103 @@
+<template>
+    <div v-if="failedIds.length && visible" class="decryption-warning">
+        <div class="warning">
+            <button class="warning-text" @click="detailsOpen = !detailsOpen">
+                <strong>{{ failedIds.length }}&nbsp;</strong>
+                <span>
+                    {{ failedIds.length === 1 ? 'note could' : 'notes could' }}
+                    not be decrypted
+                </span>
+            </button>
+
+            <button class="close-button" @click="visible = false">✕</button>
+        </div>
+
+        <div v-show="detailsOpen" class="details">
+            <span>Failed note IDs:</span>
+
+            <ul class="id-list">
+                <li v-for="id in failedIds" :key="id">{{ id }}</li>
+            </ul>
+
+            <p class="instructions">
+                These notes may have been encrypted with a different key. Either
+                change your encryption key in preferences, or delete these
+                notes.
+            </p>
+
+            <button class="delete-button" @click="onDeleteNotes">
+                Delete Notes (Permanent)
+            </button>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import useNotes from '@/composables/useNotes'
+import { ref } from 'vue'
+
+const props = defineProps({
+    failedIds: {
+        type: Array,
+        required: true,
+    },
+})
+
+const visible = ref(true)
+const detailsOpen = ref(false)
+
+const { deleteNote } = useNotes()
+
+const onDeleteNotes = async () => {
+    await Promise.all(props.failedIds.map((id) => deleteNote(id)))
+    visible.value = false
+}
+</script>
+
+<style lang="scss" scoped>
+.decryption-warning {
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: var(--theme-bg);
+    border-top: 1px solid var(--grey-100);
+    padding: 10px var(--layout-margin);
+
+    .warning {
+        display: flex;
+        justify-content: space-between;
+        gap: 10px;
+
+        .warning-text {
+            &:hover {
+                color: var(--theme-accent);
+            }
+        }
+    }
+    .details {
+        margin-top: 20px;
+
+        ul {
+            list-style-type: none;
+            margin-top: 10px;
+            color: var(--grey-100);
+        }
+        .instructions {
+            margin-top: 10px;
+        }
+        .delete-button {
+            display: block;
+            margin: 20px auto 0;
+            border: 1px solid var(--theme-fg);
+            padding: 0.2em 0.5em;
+            border-radius: 0.2em;
+
+            &:hover {
+                color: var(--theme-accent);
+                border-color: var(--theme-accent);
+            }
+        }
+    }
+}
+</style>

src/renderer/src/components/Menu.vue

@@ -1,7 +1,11 @@
 <template>
     <transition name="menu">
-        <div v-if="menuOpen" class="menu" ref="container">
-            <Nav />
+        <div
+            v-if="menuOpen || lockOpen"
+            :class="['menu', { locked: lockOpen }]"
+            ref="container"
+        >
+            <Nav v-if="!lockOpen" />
 
             <div class="menu-wrap layout-block">
                 <new-note class="menu-item" @noteOpened="closeMenu" />
@@ -12,7 +16,7 @@
                 <router-link class="menu-item" to="/instructions">
                     Instructio
                 </router-link>
-                <button class="menu-item">Import</button>
+                <!-- <button class="menu-item">Import</button> -->
                 <button class="menu-item" @click="handleExport">Export</button>
                 <router-link class="menu-item" to="/preferences">
                     Preferences
@@ -32,6 +36,10 @@ import useMenu from '@/composables/useMenu'
 import { useRoute } from 'vue-router'
 import useExport from '@/composables/useExport'
 
+const props = defineProps({
+    lockOpen: { type: Boolean, default: () => false },
+})
+
 const container = ref()
 
 const { menuOpen, closeMenu } = useMenu()
@@ -85,6 +93,10 @@ const handleExport = async () => {
         }
     }
 
+    &.locked .menu-wrap {
+        padding-top: 0;
+    }
+
     &.menu-enter-active,
     &.menu-leave-active {
         transition: transform 300ms var(--ease-out-expo);

src/renderer/src/components/MoveMenu.vue

@@ -2,14 +2,18 @@
     <div v-if="open" class="move-menu layout-block">
         <button class="cancel-button" @click="close">Cancel</button>
 
+        <button class="summarium-button" @click="onCategoryClick(null)">
+            SUMMARIUM
+        </button>
+
         <template v-for="(category, i) in categories">
             <category-row
                 v-if="category !== fromCategory"
                 :category="category"
                 :index="i"
                 wrapper="button"
-                @click="onCategoryClick(category)"
                 :key="category"
+                @click="onCategoryClick(category)"
             />
         </template>
     </div>
@@ -17,10 +21,9 @@
 
 <script setup>
 import CategoryRow from '@/components/CategoryRow.vue'
-import { computed, onBeforeUnmount, watch } from 'vue'
+import { computed, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import useNotes from '@/composables/useNotes'
-import useState from '@/composables/useState'
 import _omit from 'lodash/omit'
 
 const { categories, updateNote } = useNotes()
@@ -39,7 +42,7 @@ const close = async () => {
     await window.api.moveClosed()
 }
 const onCategoryClick = async (category) => {
-    if (!category || !noteId.value) return
+    if (!noteId.value) return
 
     await updateNote(noteId.value, { category: category })
 
@@ -55,10 +58,20 @@ watch(open, async () => {
     width: 50vw;
     height: 100%;
     border-left: 1px solid var(--grey-100);
+    display: flex;
+    flex-direction: column;
 
     .cancel-button {
         color: var(--grey-100);
         padding: 9px 0 16px;
     }
+    .summarium-button {
+        display: block;
+        margin: 10px 0;
+
+        &:hover {
+            color: var(--theme-accent);
+        }
+    }
 }
 </style>

src/renderer/src/components/NewNote.vue

@@ -5,6 +5,8 @@
 <script setup>
 import useOpenNote from '@/composables/useOpenNote'
 import useNotes from '@/composables/useNotes'
+import { useMagicKeys } from '@vueuse/core'
+import { watchEffect } from 'vue'
 
 const props = defineProps({ category: String })
 const emit = defineEmits(['noteOpened'])
@@ -22,9 +24,12 @@ const onClick = async () => {
     openNote(note.id)
     emit('noteOpened')
 }
-</script>
 
-<style lang="scss">
-.new-note {
-}
-</style>
+// Add keyboard shortcut
+const { ctrl, n } = useMagicKeys()
+watchEffect(() => {
+    if (ctrl.value && n.value) {
+        onClick()
+    }
+})
+</script>

src/renderer/src/components/NoteRow.vue

@@ -1,6 +1,6 @@
 <template>
     <div :class="['note-row', { 'move-active': moveActive }]">
-        <span class="date">{{ formatDate(note.createdAt) }}</span>
+        <span class="date">{{ formatDate(note.updatedAt) }}</span>
         <div class="title-actions">
             <button class="title bold" @click="openNote(note.id)">
                 {{ note.title }}
@@ -18,7 +18,6 @@
 
 <script setup>
 import useOpenNote from '@/composables/useOpenNote'
-import useState from '@/composables/useState'
 import { useRoute, useRouter } from 'vue-router'
 import { computed } from 'vue'
 import { format } from 'fecha'
@@ -60,6 +59,11 @@ const moveActive = computed(() => route.query.move === props.note.id)
         align-items: flex-start;
         gap: 2px;
 
+        .title {
+            white-space: break-spaces;
+            word-break: break-word;
+            @include line-clamp(3);
+        }
         .action {
             opacity: 0;
 

src/renderer/src/components/ScrollBar.vue

@@ -1,5 +1,5 @@
 <template>
-    <div v-if="showScrollBar" class="scroll-bar">
+    <div v-if="showScrollBar" :class="['scroll-bar', { active: isDragging }]">
         <div class="inner" ref="inner">
             <div class="handle" ref="handle" />
         </div>
@@ -7,10 +7,14 @@
 </template>
 
 <script setup>
-import { ref, onBeforeUnmount, computed, watch } from 'vue'
-import { useElementSize, useWindowScroll, useWindowSize } from '@vueuse/core'
-import Tempus from 'tempus'
+import {
+    useElementSize,
+    useWindowScroll,
+    useWindowSize,
+    useEventListener,
+} from '@vueuse/core'
 import { useDragControls } from '@/composables/useDragControls'
+import { ref, computed } from 'vue'
 
 const inner = ref()
 const handle = ref()
@@ -23,12 +27,13 @@ const { height: innerHeight } = useElementSize(inner)
 const { height: handleHeight } = useElementSize(handle)
 
 // Drag controls
-// useDragControls({
-//     target: handle,
-//     onUpdate: ({ y }) => {
-//         console.log(y.value)
-//     },
-// })
+const { isDragging } = useDragControls({
+    target: inner,
+    onUpdate: ({ y }) => {
+        if (!handle.value) return
+        window.scrollTo(0, y.value * (documentHeight.value - wHeight.value))
+    },
+})
 
 const updateScrollbar = () => {
     const scrollHeight = documentHeight.value
@@ -46,27 +51,11 @@ const updateScrollbar = () => {
     }
 }
 
+useEventListener(window, 'scroll', updateScrollbar)
+
 const showScrollBar = computed(() => {
     return documentHeight.value > wHeight.value
 })
-
-// RAF
-const removeRaf = ref()
-const addRaf = () => (removeRaf.value = Tempus.add(updateScrollbar))
-onBeforeUnmount(() => {
-    removeRaf.value?.()
-})
-watch(
-    showScrollBar,
-    (show) => {
-        if (show) {
-            addRaf()
-        } else {
-            removeRaf.value?.()
-        }
-    },
-    { immediate: true },
-)
 </script>
 
 <style lang="scss">
@@ -78,6 +67,8 @@ watch(
     width: 8px;
     will-change: transform;
     border-left: 1px solid var(--grey-100);
+    background: var(--theme-bg);
+    cursor: grab;
 
     .inner {
         height: 100%;
@@ -85,7 +76,7 @@ watch(
 
         .handle {
             width: 100%;
-            height: 388px;
+            height: 70vh;
             background: var(--grey-100);
             border-radius: 20px;
             position: absolute;
@@ -93,5 +84,8 @@ watch(
             will-change: transform;
         }
     }
+    &.active {
+        cursor: grabbing;
+    }
 }
 </style>

src/renderer/src/components/note/Download.vue

@@ -1,38 +1,27 @@
 <template>
     <div class="note-download">
-        <button @click="download">{{ noteTitle }}.md ↓</button>
+        <button v-if="noteTitle && props.editor" @click="download">
+            <span class="title-text">{{ noteTitle }}</span>
+            <span class="extension">.md ↓</span>
+        </button>
     </div>
 </template>
 
 <script setup>
-import { computed } from 'vue'
 import _kebabCase from 'lodash/kebabCase'
+import { computed } from 'vue'
 
 const DEFAULT_TITLE = 'Untitled'
 
 const props = defineProps({
-    editor: {
-        type: Object,
-        required: true,
-    },
+    title: String,
+    editor: Object,
 })
 
-const noteTitle = computed(() => {
-    if (!props.editor) return DEFAULT_TITLE
-
-    let title
-    const doc = props.editor.state.doc
-
-    const firstNode = doc.firstChild
-    if (!firstNode || firstNode.type.name !== 'heading') title = DEFAULT_TITLE
-
-    title = firstNode.textContent.trim() || DEFAULT_TITLE
-
-    return _kebabCase(title)
-})
+const noteTitle = computed(() => _kebabCase(props.title || DEFAULT_TITLE))
 
 const download = () => {
-    if (!props.editor) return
+    if (!noteTitle.value || !props.editor) return
 
     const content = props.editor.getMarkdown()
     const blob = new Blob([content], { type: 'text/plain' })
@@ -53,6 +42,24 @@ const download = () => {
     justify-content: center;
 
     button {
+        display: inline-flex;
+        margin: auto;
+        justify-content: center;
+
+        .title-text {
+            display: block;
+            max-width: min(
+                300px,
+                calc(100vw - var(--layout-margin) * 2) - 36px
+            );
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            overflow: hidden;
+        }
+        .extension {
+            display: block;
+            flex-shrink: 0;
+        }
         &:hover {
             color: var(--theme-accent);
         }

src/renderer/src/components/note/Editor.vue

@@ -1,5 +1,15 @@
 <template>
     <div v-if="editor" class="note-editor">
+        <div class="title">
+            <div
+                :class="['title-input p', { placeholder: !title }]"
+                contenteditable="true"
+                ref="titleInput"
+                @input="onTitleChange"
+                @keydown="onTitleKeydown"
+            />
+        </div>
+
         <editor-content :editor="editor" class="editor-wrap" />
 
         <editor-menu :editor="editor" />
@@ -9,78 +19,130 @@
 </template>
 
 <script setup>
-import { onBeforeUnmount, onMounted, shallowRef } from 'vue'
+import {
+    onBeforeUnmount,
+    onMounted,
+    shallowRef,
+    ref,
+    watch,
+    nextTick,
+} from 'vue'
 import PageLoading from '@/components/PageLoading.vue'
 import { Editor, EditorContent } from '@tiptap/vue-3'
+import { extensions } from '@/libs/editorExtensions'
 import useNotes from '@/composables/useNotes'
 import _debounce from 'lodash/debounce'
 import EditorMenu from './Menu.vue'
-import { extensions } from '@/libs/editorExtensions'
+
+const TITLE_CHAR_LIMIT = 100
 
 const props = defineProps({
-    id: {
-        type: String,
+    note: {
+        type: Object,
         required: true,
     },
 })
 
 const editor = shallowRef()
+const title = ref('')
+const titleInput = ref()
 
-const { loadNote, updateNote } = useNotes()
+const { updateNote } = useNotes()
 
 const onUpdate = _debounce(async ({ editor }) => {
     const json = editor.getJSON()
     const text = editor.getText()
 
-    // Get doc title
-    let title
-    const doc = editor.state.doc
-
-    const firstNode = doc.firstChild
-    if (!firstNode || firstNode.type.name !== 'heading') title = 'Untitled'
-
-    title = firstNode.textContent.trim() || 'Untitled'
-
-    await updateNote(props.id, {
-        title,
+    await updateNote(props.note.id, {
         content: json,
         plainText: text,
     })
-}, 300)
+}, 500)
 
 onMounted(async () => {
-    const note = await loadNote(props.id)
+    if (props.note.title !== 'Untitled') {
+        title.value = props.note.title || ''
+    }
 
     editor.value = new Editor({
         extensions,
-        content: note.content || [],
+        content: props.note.content || [],
         onUpdate: onUpdate,
     })
+
+    // Clear any highlights from find feature
+    editor.value.chain().selectAll().unsetHighlight().run()
+
+    await nextTick()
+    if (titleInput.value) {
+        titleInput.value.textContent = title.value
+        if (['', 'Untitled'].includes(title.value)) {
+            titleInput.value.focus()
+        }
+    }
 })
 onBeforeUnmount(() => {
     editor.value?.destroy?.()
 })
 
+// Make sure title input is synced
+watch(title, async (newVal) => {
+    if (!titleInput.value) return
+
+    if (titleInput.value.textContent !== newVal) {
+        titleInput.value.textContent = newVal
+    }
+})
+const updateTitle = _debounce((title) => {
+    updateNote(props.note.id, {
+        title: title === '' ? 'Untitled' : title,
+    })
+}, 500)
+const onTitleChange = (e) => {
+    title.value = e.target.textContent
+
+    updateTitle(title.value)
+}
+const onTitleKeydown = (e) => {
+    if (e.key === 'Enter') {
+        e.preventDefault()
+        editor.value?.commands?.focus()
+    }
+
+    if (title.value.length >= TITLE_CHAR_LIMIT && e.key.length === 1) {
+        e.preventDefault()
+    }
+}
+
 defineExpose({
+    title,
     editor,
 })
 </script>
 
 <style lang="scss">
 .note-editor {
+    .title {
+        width: 100%;
+        margin-bottom: 40px;
+        padding-bottom: 0.5em;
+        border-bottom: 1px dashed currentColor;
+
+        .title-input {
+            white-space: break-spaces;
+            word-break: break-word;
+            @include drop-cap;
+
+            &.placeholder:before {
+                content: 'Title';
+                color: var(--grey-100);
+            }
+        }
+    }
+
     h1 {
         font-weight: 700 !important;
         @include p;
-
-        &:first-child {
-            @include drop-cap;
-        }
-    }
-    h1.is-editor-empty:first-child::before {
-        color: var(--grey-100);
-        content: attr(data-placeholder);
-        pointer-events: none;
-        @include drop-cap;
     }
     p strong {
         font-weight: 700;
@@ -152,10 +214,13 @@ defineExpose({
             background: currentColor;
         }
     }
-    mark {
+    u {
+        text-decoration: underline;
+    }
+    .highlighted {
         background: var(--theme-accent);
         color: var(--theme-bg);
-        padding: 0 0.2em;
+        border-radius: 0.2em;
     }
 
     ul[data-type='taskList'] {

src/renderer/src/components/note/Find.vue

@@ -1,34 +1,20 @@
 <template>
     <div v-if="visible" class="note-find">
         <div class="find-bar">
-            <!-- <input
-                @keydown.enter="findNext"
-                @keydown.escape="close"
-                ref="inputRef"
-            /> -->
             <search-input
                 v-model="searchQuery"
                 placeholder="Find..."
                 ref="inputRef"
+                @keydown.escape="close"
             />
-            <span class="match-count">
-                {{ currentMatch + 1 }} / {{ matches.length }}
-            </span>
-            <button @click="findPrev" :disabled="matches.length === 0">
-                ↑
-            </button>
-            <button @click="findNext" :disabled="matches.length === 0">
-                ↓
-            </button>
             <button @click="close">✕</button>
         </div>
     </div>
 </template>
 
 <script setup>
-import { ref, watch, nextTick } from 'vue'
+import { ref, watch, nextTick, onBeforeUnmount, onMounted } from 'vue'
 import SearchInput from '@/components/SearchInput.vue'
-import { Highlight } from '@tiptap/extension-highlight'
 
 const props = defineProps({
     editor: {
@@ -45,7 +31,6 @@ const emit = defineEmits(['close'])
 
 const searchQuery = ref('')
 const matches = ref([])
-const currentMatch = ref(0)
 const inputRef = ref(null)
 
 const findInDocument = () => {
@@ -78,82 +63,25 @@ const findInDocument = () => {
     })
 
     matches.value = foundMatches
-    currentMatch.value = 0
-
-    if (foundMatches.length > 0) {
-        highlightMatch(0)
-        scrollToMatch(0)
-    }
+    highlightMatches()
 }
 
-const highlightMatch = (index) => {
-    if (!props.editor || !matches.value[index]) return
-
-    const { from, to } = matches.value[index]
+const highlightMatches = () => {
+    if (!props.editor || !matches.value) return
 
+    matches.value.forEach(({ from, to }) => {
         props.editor
             .chain()
             .setTextSelection({ from, to })
             .setHighlight({ color: 'var(--theme-accent)' })
             .run()
-
-    inputRef.value?.focus()
+    })
 }
 
 const clearHighlights = () => {
     if (!props.editor) return
 
-    const { state } = props.editor
-    const { doc } = state
-
-    doc.descendants((node, pos) => {
-        if (node.marks && node.marks.length > 0) {
-            node.marks.forEach((mark) => {
-                if (mark.type.name === 'highlight') {
-                    props.editor.chain().focus().unsetHighlight().run()
-                }
-            })
-        }
-    })
-
-    props.editor.commands.unsetHighlight()
-}
-
-const scrollToMatch = (index) => {
-    if (!props.editor || !matches.value[index]) return
-
-    const { from } = matches.value[index]
-    props.editor.commands.setTextSelection({ from, to: from })
-
-    const dom = props.editor.view.dom
-    const selection = window.getSelection()
-
-    if (selection && selection.rangeCount > 0) {
-        const range = selection.getRangeAt(0)
-        range.commonAncestorContainer.scrollIntoView({
-            behavior: 'smooth',
-            block: 'center',
-        })
-    }
-}
-
-const findNext = () => {
-    if (matches.value.length === 0) return
-
-    clearHighlights()
-    currentMatch.value = (currentMatch.value + 1) % matches.value.length
-    highlightMatch(currentMatch.value)
-    scrollToMatch(currentMatch.value)
-}
-
-const findPrev = () => {
-    if (matches.value.length === 0) return
-
-    clearHighlights()
-    currentMatch.value =
-        (currentMatch.value - 1 + matches.value.length) % matches.value.length
-    highlightMatch(currentMatch.value)
-    scrollToMatch(currentMatch.value)
+    props.editor.chain().selectAll().unsetHighlight().run()
 }
 
 const close = () => {
@@ -170,27 +98,25 @@ watch(
             await nextTick()
             inputRef.value?.focus()
             if (props.editor && searchQuery.value) {
-                console.log('visible change')
                 findInDocument()
             }
         }
     },
 )
-
 watch(
     () => props.editor,
     (newEditor) => {
         if (newEditor && props.visible && searchQuery.value) {
-            console.log('editor change')
             findInDocument()
         }
     },
 )
-
 watch(searchQuery, () => {
-    console.log('search change')
     findInDocument()
 })
+
+onMounted(() => clearHighlights())
+onBeforeUnmount(() => clearHighlights())
 </script>
 
 <style lang="scss">

src/renderer/src/components/note/Menu.vue

@@ -13,12 +13,6 @@
             >
                 Italic
             </button>
-            <button
-                @click="editor.chain().focus().toggleHighlight().run()"
-                :class="{ active: editor.isActive('highlight') }"
-            >
-                Highlight
-            </button>
         </div>
     </bubble-menu>
 </template>

src/renderer/src/components/preferences/DirectoryInput.vue

@@ -0,0 +1,58 @@
+<template>
+    <div class="preferences-directory-input">
+        <label :for="key"> {{ label }}{{ required ? '*' : '' }} </label>
+
+        <div class="input-row">
+            <input
+                v-model="model"
+                :id="key"
+                type="text"
+                :placeholder="default"
+                :required="required"
+                readonly
+            />
+
+            <button @click="openDirectoryPicker" type="button">Browse</button>
+        </div>
+    </div>
+</template>
+
+<script setup>
+const props = defineProps({
+    label: String,
+    key: String,
+    required: Boolean,
+    default: String,
+})
+
+const model = defineModel()
+
+const openDirectoryPicker = async () => {
+    const path = await window.api.openDirectoryDialog()
+    if (path) {
+        model.value = path
+    }
+}
+</script>
+
+<style lang="scss">
+.preferences-directory-input {
+    label {
+        display: block;
+        margin-bottom: 6px;
+    }
+    .input-row {
+        display: flex;
+        gap: 8px;
+    }
+    input {
+        flex: 1;
+        border: 1px solid var(--grey-100);
+        border-radius: 0.2em;
+        padding: 0.2em 0.5em;
+    }
+    button {
+        padding: 0.2em 0.5em;
+    }
+}
+</style>

src/renderer/src/components/preferences/Encryption.vue

@@ -0,0 +1,38 @@
+<template>
+    <div v-if="config" class="preferences-encryption">
+        <h2 class="section-title h1 mono">Encryption</h2>
+
+        <preferences-text-input
+            v-model.trim="config.encryptionKey"
+            type="password"
+            label="Encryption Key"
+            key="encryptionKey"
+            required
+        />
+    </div>
+</template>
+
+<script setup>
+import PreferencesTextInput from '@/components/preferences/TextInput.vue'
+import useConfig from '@/composables/useConfig'
+import { onMounted } from 'vue'
+
+const { config, ensureConfig } = useConfig()
+
+onMounted(async () => {
+    await ensureConfig()
+})
+
+const validate = async () => {
+    if (!config.value.encryptionKey) {
+        throw new Error('Please fill in the encryption key')
+    }
+}
+
+defineExpose({ validate })
+</script>
+
+<style lang="scss">
+.preferences-encryption {
+}
+</style>

src/renderer/src/components/preferences/Storage.vue

@@ -0,0 +1,153 @@
+<template>
+    <div v-if="config" class="preferences-storage">
+        <h2 class="section-title h1 mono">Storage Plugin</h2>
+
+        <div v-for="plugin in plugins" class="plugin" :key="plugin.id">
+            <input
+                v-model="selectedPluginId"
+                name="plugins"
+                type="radio"
+                :id="plugin.id"
+                :value="plugin.id"
+            />
+            <div class="info">
+                <p class="name bold">{{ plugin.name }}</p>
+                <p class="description">{{ plugin.description }}</p>
+
+                <div v-if="plugin.configSchema.length" class="config">
+                    <div
+                        v-for="field in plugin.configSchema"
+                        class="config-field"
+                        :key="field.key"
+                    >
+                        <!-- Inputs -->
+                        <text-input
+                            v-if="
+                                [
+                                    'text',
+                                    'email',
+                                    'password',
+                                    'number',
+                                ].includes(field.type)
+                            "
+                            v-model="config.adapters[plugin.id][field.key]"
+                            v-bind="field"
+                        />
+                        <directory-input
+                            v-else-if="field.type === 'directory'"
+                            v-model="config.adapters[plugin.id][field.key]"
+                            v-bind="field"
+                        />
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import DirectoryInput from '@/components/preferences/DirectoryInput.vue'
+import TextInput from '@/components/preferences/TextInput.vue'
+import usePlugins from '@/composables/usePlugins'
+import useConfig from '@/composables/useConfig'
+import { ref, computed, onMounted } from 'vue'
+
+const { plugins, setActivePlugin, testPlugin } = await usePlugins()
+const { config, ensureConfig } = useConfig()
+
+onMounted(async () => {
+    await ensureConfig()
+
+    // Make sure every plugin config has defaults set
+    const normalizeConfig = () => {
+        if (!config.value.adapters) {
+            config.value.adapters = {}
+        }
+
+        for (const plugin of plugins.value) {
+            if (!config.value.adapters[plugin.id]) {
+                config.value.adapters[plugin.id] = {}
+            }
+
+            for (const field of plugin.configSchema) {
+                if (config.value.adapters[plugin.id][field.key] === undefined) {
+                    config.value.adapters[plugin.id][field.key] =
+                        field.default ?? ''
+                }
+            }
+        }
+    }
+    normalizeConfig()
+})
+
+// Track selected plugin
+const selectedPluginId = ref(config.value.activeAdapter)
+const selectedPlugin = computed(() => {
+    return plugins.value.find((p) => p.id === selectedPluginId.value)
+})
+
+// Validation for parent
+const validate = async () => {
+    const plugin = selectedPlugin.value
+    const adapterConfig = config.value.adapters[plugin.id] || {}
+
+    if (plugin && plugin.configSchema.length) {
+        // Check required fields
+        for (const field of plugin.configSchema) {
+            if (field.required && !adapterConfig[field.key]) {
+                throw new Error(
+                    `Please fill in all required fields for ${plugin.name}`,
+                )
+            }
+        }
+
+        // Test connection
+        // const testResult = await testPlugin(plugin.id, adapterConfig)
+        // console.log(testResult)
+        // if (!testResult) {
+        //     validationError.value = `Failed to connect to ${plugin.name}`
+        // }
+    }
+
+    await setActivePlugin(selectedPluginId.value, adapterConfig)
+}
+
+defineExpose({ validate })
+</script>
+
+<style lang="scss">
+.preferences-storage {
+    .plugin {
+        display: flex;
+        margin-bottom: 16px;
+    }
+
+    input[type='radio'] {
+        display: block;
+        flex-shrink: 0;
+        width: 10px;
+        height: 10px;
+        margin-right: 10px;
+        border: 1px solid var(--theme-fg);
+        cursor: pointer;
+
+        &:checked {
+            background-color: var(--theme-fg);
+        }
+    }
+
+    .info {
+        .description {
+            color: var(--grey-100);
+            margin-top: 6px;
+        }
+    }
+
+    .config {
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        margin-top: 16px;
+    }
+}
+</style>

src/renderer/src/components/preferences/TextInput.vue

@@ -0,0 +1,40 @@
+<template>
+    <div class="preferences-text-input">
+        <label :for="key"> {{ label }}{{ required ? '*' : '' }} </label>
+
+        <input
+            v-model="model"
+            :id="key"
+            :type="type"
+            :placeholder="default"
+            :required="required"
+        />
+    </div>
+</template>
+
+<script setup>
+const props = defineProps({
+    label: String,
+    key: String,
+    required: Boolean,
+    type: String,
+    default: String,
+})
+
+const model = defineModel()
+</script>
+
+<style lang="scss">
+.preferences-text-input {
+    label {
+        display: block;
+        margin-bottom: 6px;
+    }
+    input {
+        width: 100%;
+        border: 1px solid var(--grey-100);
+        border-radius: 0.2em;
+        padding: 0.2em 0.5em;
+    }
+}
+</style>

src/renderer/src/composables/useDragControls.js

@@ -9,6 +9,9 @@ export function useDragControls(options = {}) {
     const isDragging = ref(false)
 
     let bounds = null
+    let cleanupSelectListener = null
+
+    const disableSelect = (e) => e.preventDefault()
 
     const updateBounds = () => {
         if (target) {
@@ -35,6 +38,9 @@ export function useDragControls(options = {}) {
         isDragging.value = true
         updateBounds()
         move(e)
+
+        // Disable text selection
+        cleanupSelectListener = useEventListener('selectstart', disableSelect)
     }
 
     const move = (e) => {
@@ -49,6 +55,8 @@ export function useDragControls(options = {}) {
 
     const end = () => {
         isDragging.value = false
+
+        cleanupSelectListener?.()
     }
 
     onMounted(() => {

src/renderer/src/composables/useEnvironment.ts

@@ -1,6 +1,7 @@
 export enum ENVIRONMENTS {
     ELECTRON = 'electron',
     WEB = 'web',
+    CAPACITOR = 'capacitor',
 }
 
 export const useEnvironment = (): ENVIRONMENTS => {
@@ -35,7 +36,26 @@ export const useEnvironment = (): ENVIRONMENTS => {
         return false
     }
 
-    const environment = isElectron() ? ENVIRONMENTS.ELECTRON : ENVIRONMENTS.WEB
+    function isCapacitor() {
+        if (typeof window !== 'undefined' && (window as any).Capacitor) {
+            return true
+        }
+        if (typeof navigator === 'object' && navigator.userAgent) {
+            const ua = navigator.userAgent
+            return (
+                ua.includes('Capacitor') ||
+                ua.includes('Android') ||
+                ua.includes('iPhone')
+            )
+        }
+        return false
+    }
+
+    const environment = isElectron()
+        ? ENVIRONMENTS.ELECTRON
+        : isCapacitor()
+          ? ENVIRONMENTS.CAPACITOR
+          : ENVIRONMENTS.WEB
 
     return environment
 }

src/renderer/src/composables/useNoteListeners.js

@@ -0,0 +1,52 @@
+import { useEnvironment } from '@/composables/useEnvironment.js'
+import useCore from '@/composables/useCore'
+import _omit from 'lodash/omit'
+import { ref } from 'vue'
+
+let listenersInitialized = false
+const changeCount = ref(0)
+
+export default () => {
+    const environment = useEnvironment()
+    const { getNotesAPI } = useCore()
+
+    const setupListeners = () => {
+        if (environment !== 'electron' || listenersInitialized) return
+        listenersInitialized = true
+
+        const updateCacheCount = async (note) => {
+            const api = await getNotesAPI()
+            await api.updateNote(
+                note.id,
+                _omit(note, ['id', 'createdAt', 'updatedAt']),
+            )
+
+            changeCount.value++
+        }
+
+        window.api.onNoteCreated(updateCacheCount)
+        window.api.onNoteUpdated(updateCacheCount)
+        window.api.onPluginChanged(async () => {
+            const api = await getNotesAPI()
+            await api.init()
+
+            changeCount.value++
+        })
+
+        // Todo update cache
+        window.api.onNoteDeleted(() => {
+            changeCount.value++
+        })
+    }
+
+    const broadcastChange = (event, data) => {
+        if (environment !== 'electron') return
+        window.api.notifyNoteChanged(event, data)
+    }
+
+    return {
+        setupListeners,
+        broadcastChange,
+        changeCount,
+    }
+}

src/renderer/src/composables/useNotes.js

@@ -1,77 +1,39 @@
-import _omit from 'lodash/omit'
+import useNoteListeners from '@/composables/useNoteListeners'
+import useCore from '@/composables/useCore'
 import { ref } from 'vue'
-import { getNotesAPI } from '@/libs/getNotesAPI'
-import { useEnvironment } from '@/composables/useEnvironment.js'
 
 const categories = ref([])
 const searchResults = ref([])
-const notesChangeCount = ref(0)
-
-let listenersInitialized = false
-
-const environment = useEnvironment()
-
-const setupListeners = () => {
-    if (listenersInitialized || typeof window === 'undefined') return
-    listenersInitialized = true
-
-    const updateCacheCount = async (note) => {
-        const api = await getNotesAPI()
-        await api.updateNote(
-            note.id,
-            _omit(note, ['id', 'createdAt', 'updatedAt']),
-        )
-
-        notesChangeCount.value++
-    }
-
-    window.api.onNoteCreated(updateCacheCount)
-    window.api.onNoteUpdated(updateCacheCount)
-    window.api.onPluginChanged(async () => {
-        const api = await getNotesAPI()
-        await api.init()
-
-        notesChangeCount.value++
-    })
-
-    // Todo update cache
-    window.api.onNoteDeleted(() => {
-        notesChangeCount.value++
-    })
-}
-
-const broadcastChange = (event, data) => {
-    if (environment === 'electron') {
-        window.api.notifyNoteChanged(event, data)
-    }
-}
-
-if (environment === 'electron') {
-    setupListeners()
-}
+const decryptionFailures = ref([])
 
 export default () => {
-    /* -------------------------
-     Initialization
-    --------------------------*/
+    const { getNotesAPI } = useCore()
+
+    // Change listeners for electron
+    const { setupListeners, broadcastChange, changeCount } = useNoteListeners()
+    setupListeners()
+
+    const getDecryptionFailures = async () => {
+        const api = await getNotesAPI()
+        decryptionFailures.value = api.getDecryptionFailures()
+    }
+    getDecryptionFailures()
+
+    // Load
     const loadCategories = async () => {
         const api = await getNotesAPI()
         categories.value = api.getCategories()
     }
-
     const loadCategoryNotes = async (category = null) => {
         const api = await getNotesAPI()
         return api.getCategoryNotes(category)
     }
-
     const loadNote = async (id) => {
         const api = await getNotesAPI()
         return api.getNote(id)
     }
 
-    /* -------------------------
-     Create
-    --------------------------*/
+    // Create
     const createNote = async (metadata, content, plainText = '') => {
         const api = await getNotesAPI()
         const note = await api.createNote(metadata, content, plainText)
@@ -80,9 +42,7 @@ export default () => {
         return note
     }
 
-    /* -------------------------
-     Update
-    --------------------------*/
+    // Update
     const updateNote = async (id, updates) => {
         const api = await getNotesAPI()
 
@@ -96,7 +56,6 @@ export default () => {
 
         return note
     }
-
     const updateCategory = async (category, update) => {
         const notes = await loadCategoryNotes(category)
 
@@ -107,19 +66,16 @@ export default () => {
         await loadCategories()
     }
 
-    /* -------------------------
-     Delete
-    --------------------------*/
+    // Delete
     const deleteNote = async (id) => {
         const api = await getNotesAPI()
         await api.deleteNote(id)
         await loadCategories()
         broadcastChange('note-deleted', { id })
+        getDecryptionFailures()
     }
 
-    /* -------------------------
-     Search
-    --------------------------*/
+    // Search
     const search = async (query) => {
         const api = await getNotesAPI()
 
@@ -134,7 +90,8 @@ export default () => {
     return {
         categories,
         searchResults,
-        notesChangeCount,
+        decryptionFailures,
+        changeCount,
 
         loadCategories,
         loadCategoryNotes,

src/renderer/src/content/instructions.md

@@ -11,12 +11,9 @@ Tabula = Index/Overview
 
 Program Key Commands
 
-cmd + s = save\
 cmd + t = new capitulum\
 cmd + n = new nota\
-cmd + x = close window\
-dbl click = change name / open nota\
-paste hyperlink twice = activated url
+cmd + x = close window
 
 ---
 
@@ -25,4 +22,9 @@ Text Markdowns
 cmd + b = Bold\
 cmd + u = underline\
 --- = ---------- (ruled line break)\
-/_text_/ = Desaturated text
+\# = Heading\
+\> = Blockquote\
+\- = Unordered List\
+\1. = Ordered List\
+\` = Inline Code\
+\``` = Code Block

src/renderer/src/libs/editorExtensions.js

@@ -3,37 +3,25 @@ import StarterKit from '@tiptap/starter-kit'
 import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight'
 import { TaskList, TaskItem } from '@tiptap/extension-list'
 import { Highlight } from '@tiptap/extension-highlight'
-import Document from '@tiptap/extension-document'
 import { all, createLowlight } from 'lowlight'
-import { Placeholder } from '@tiptap/extensions'
 
 // Lowlight setup
 const lowlight = createLowlight(all)
 
-// Force note format
-const CustomDocument = Document.extend({
-    content: 'heading block*',
-})
-
 export const extensions = [
-    CustomDocument,
     StarterKit.configure({
-        document: false,
         heading: { levels: [1] },
         trailingNode: {
             node: 'paragraph',
         },
     }),
-    Placeholder.configure({
-        placeholder: ({ node }) => {
-            if (node.type.name === 'heading') {
-                return 'Title'
-            }
-        },
-    }),
     TaskList,
     TaskItem,
-    Highlight,
+    Highlight.configure({
+        HTMLAttributes: {
+            class: 'highlighted',
+        },
+    }),
     Markdown,
     CodeBlockLowlight.configure({
         lowlight,

src/renderer/src/libs/getNotesAPI.js

@@ -1,18 +0,0 @@
-import useCore from '@/composables/useCore'
-
-let notesAPI = null
-let initPromise = null
-
-export const getNotesAPI = async () => {
-    if (notesAPI) return notesAPI
-
-    if (!initPromise) {
-        initPromise = (async () => {
-            const { getNotesAPI } = useCore()
-            notesAPI = await getNotesAPI()
-            return notesAPI
-        })()
-    }
-
-    return initPromise
-}

src/renderer/src/plugins/core.js

@@ -1,16 +1,21 @@
 import { useEnvironment } from '@/composables/useEnvironment'
 import { initializeCore } from '@core/index.js'
-import supabasePlugin from '@takerofnotes/plugin-supabase'
 import browserPlugin from '@takerofnotes/plugin-browser'
+import supabasePlugin from '@takerofnotes/plugin-supabase'
 
 export const initCore = async (app) => {
     const environment = useEnvironment()
 
     // Set runtime
-    const runtime = environment === 'electron' ? 'electron-renderer' : 'web'
+    const runtime =
+        environment === 'electron'
+            ? 'electron-renderer'
+            : environment === 'capacitor'
+              ? 'capacitor'
+              : 'web'
 
     // Plugins that are valid for web (electron uses IPC)
-    const plugins = [supabasePlugin, browserPlugin]
+    const plugins = [browserPlugin, supabasePlugin]
 
     const core = await initializeCore(runtime, {
         plugins,

src/renderer/src/plugins/router.js

@@ -1,4 +1,9 @@
-import { createRouter, createWebHashHistory } from 'vue-router'
+import {
+    createRouter,
+    createWebHashHistory,
+    createWebHistory,
+} from 'vue-router'
+import { useEnvironment } from '@/composables/useEnvironment.ts'
 
 import Directory from '@/views/Directory.vue'
 import Note from '@/views/Note.vue'
@@ -8,6 +13,8 @@ import Instructions from '@/views/Instructions.vue'
 import Search from '@/views/Search.vue'
 import Preferences from '@/views/Preferences.vue'
 
+const environment = useEnvironment()
+
 const routes = [
     { path: '/', name: 'directory', component: Directory },
     { path: '/note/:id', name: 'note', component: Note },
@@ -19,6 +26,7 @@ const routes = [
 ]
 
 export const router = createRouter({
-    history: createWebHashHistory(),
+    history:
+        environment === 'web' ? createWebHistory() : createWebHashHistory(),
     routes,
 })

src/renderer/src/styles/_font-style.scss

@@ -18,6 +18,6 @@
 @mixin p {
     font-family: var(--font-mono);
     font-weight: 400;
-    line-height: 1;
+    line-height: 1.4;
     font-size: 12px;
 }

src/renderer/src/styles/_functions.scss

@@ -57,5 +57,6 @@
     &:first-child::first-letter {
         font-family: var(--font-display);
         font-size: 42px;
+        line-height: 0.7;
     }
 }

src/renderer/src/views/Category.vue

@@ -27,22 +27,32 @@ const route = useRoute()
 const id = route.params?.id
 const router = useRouter()
 
-const { categories, loadCategoryNotes, updateCategory, notesChangeCount } =
-    useNotes()
-
 const notes = ref()
 
-async function refreshNotes() {
+const refreshNotes = async () => {
     if (id) {
         notes.value = await loadCategoryNotes(id)
     }
 }
 
+const {
+    categories,
+    loadCategoryNotes,
+    updateCategory,
+    loadCategories,
+    changeCount,
+} = useNotes(refreshNotes)
+
 onMounted(async () => {
     await refreshNotes()
+
+    if (!categories.value?.length) {
+        await loadCategories()
+        console.log(categories.value)
+    }
 })
 
-watch(notesChangeCount, async () => {
+watch(changeCount, async () => {
     await refreshNotes()
 })
 
@@ -53,7 +63,8 @@ const onCategoryEdited = async (editedCategory) => {
 }
 
 const categoryIndex = computed(() => {
-    return categories.value?.findIndex((category) => category === id) || 1
+    if (!categories.value) return 0
+    return categories.value?.findIndex((category) => category === id)
 })
 </script>
 

src/renderer/src/views/Directory.vue

@@ -1,5 +1,8 @@
 <template>
-    <main v-if="loaded" class="directory layout-block">
+    <main
+        v-if="loaded && (categories?.length || notes?.length)"
+        class="directory layout-block"
+    >
         <category-row
             v-for="(category, i) in categories"
             :index="i"
@@ -12,20 +15,39 @@
         <div class="notes">
             <note-row v-for="note in notes" :note="note" :key="note.id" />
         </div>
+
+        <new-note />
+
+        <decryption-warning :failedIds="decryptionFailures" />
+    </main>
+
+    <main v-else-if="loaded">
+        <Menu lockOpen />
     </main>
 
     <page-loading v-else />
 </template>
 
 <script setup>
-import useNotes from '@/composables/useNotes'
-import { onMounted, ref, watch } from 'vue'
+import DecryptionWarning from '@/components/DecryptionWarning.vue'
+import { onMounted, ref, watchEffect, watch } from 'vue'
 import CategoryRow from '@/components/CategoryRow.vue'
-import NoteRow from '@/components/NoteRow.vue'
 import PageLoading from '@/components/PageLoading.vue'
+import NoteRow from '@/components/NoteRow.vue'
+import useNotes from '@/composables/useNotes'
+import NewNote from '@/components/NewNote.vue'
+import { useMagicKeys } from '@vueuse/core'
+import Menu from '@/components/Menu.vue'
+import { useRouter } from 'vue-router'
 
-const { categories, loadCategories, loadCategoryNotes, notesChangeCount } =
-    useNotes()
+const router = useRouter()
+const {
+    categories,
+    loadCategories,
+    loadCategoryNotes,
+    changeCount,
+    decryptionFailures,
+} = useNotes()
 
 const notes = ref()
 const loaded = ref(false)
@@ -41,15 +63,23 @@ onMounted(async () => {
     await refreshNotes()
 })
 
-watch(notesChangeCount, async () => {
+watch(changeCount, async () => {
     await refreshNotes()
 })
+
+// New category keyboard shortcut
+const { ctrl, t } = useMagicKeys()
+watchEffect(() => {
+    if (ctrl.value && t.value) {
+        router.push('/category')
+    }
+})
 </script>
 
 <style lang="scss">
 main.directory {
     padding-top: var(--nav-height);
-    padding-bottom: 30px;
+    padding-bottom: 60px;
 
     .label {
         text-transform: uppercase;
@@ -61,5 +91,9 @@ main.directory {
         flex-direction: column;
         gap: 14px;
     }
+    .new-note {
+        display: block;
+        margin: 50px auto 0;
+    }
 }
 </style>

src/renderer/src/views/Note.vue

@@ -1,13 +1,15 @@
 <template>
     <main class="note layout-block">
-        <note-download :editor="editorRef?.editor" />
+        <note-download :title="editorRef?.title" :editor="editorRef?.editor" />
 
         <note-find
             :editor="editorRef?.editor"
             :visible="findVisible"
             @close="findVisible = false"
         />
-        <note-editor ref="editorRef" :id="id" />
+        <note-editor :note="note" ref="editorRef" />
+
+        <div class="click-target" @click="onTargetClick" />
     </main>
 </template>
 
@@ -15,6 +17,7 @@
 import { ref, watchEffect } from 'vue'
 import { useMagicKeys } from '@vueuse/core'
 import { useRoute } from 'vue-router'
+import useNotes from '@/composables/useNotes'
 import NoteEditor from '@/components/note/Editor.vue'
 import NoteFind from '@/components/note/Find.vue'
 import NoteDownload from '@/components/note/Download.vue'
@@ -22,20 +25,45 @@ import NoteDownload from '@/components/note/Download.vue'
 const route = useRoute()
 const id = route.params.id
 
+const { loadNote } = useNotes()
+const note = await loadNote(id)
+
 const editorRef = ref(null)
 const findVisible = ref(false)
 
+// Find shortcut
 const { ctrl, f } = useMagicKeys()
 watchEffect(() => {
     if (ctrl.value && f.value) {
         findVisible.value = !findVisible.value
     }
 })
+
+const onTargetClick = () => {
+    const editor = editorRef.value.editor
+    if (!editor) return
+
+    editor.commands.insertContentAt(
+        editorRef.value.editor.getText().length + 1,
+        '\n',
+    )
+    editor.commands.focus()
+    editor.commands.setTextSelection(
+        editorRef.value.editor.getText().length + 1,
+    )
+}
 </script>
 
 <style lang="scss">
 main.note {
+    min-height: 100%;
     padding-top: 8px;
-    padding-bottom: 20px;
+    grid-template-rows: auto auto 1fr;
+    display: grid;
+
+    .click-target {
+        cursor: pointer;
+        min-height: 1em;
+    }
 }
 </style>

src/renderer/src/views/Preferences.vue

@@ -1,43 +1,18 @@
 <template>
     <main class="preferences layout-block">
-        <h1 class="mono">Storage Plugin</h1>
+        <h1 class="title">Preferences</h1>
 
-        <div v-for="plugin in plugins" class="plugin" :key="plugin.id">
-            <input
-                v-model="selectedPluginId"
-                name="plugins"
-                type="radio"
-                :id="plugin.id"
-                :value="plugin.id"
-            />
-            <div class="info">
-                <p class="name bold">{{ plugin.name }}</p>
-                <p class="description">{{ plugin.description }}</p>
+        <div class="sections">
+            <preferences-encryption ref="encryption" />
 
-                <div v-if="plugin.configSchema.length" class="config">
-                    <div
-                        v-for="field in plugin.configSchema"
-                        class="config-field"
-                        :key="field.key"
-                    >
-                        <label :for="field.key">
-                            {{ field.label }} {{ field.required ? '*' : '' }}
-                        </label>
-                        <input
-                            v-model="config.adapters[plugin.id][field.key]"
-                            :id="field.key"
-                            :type="field.type"
-                            :placeholder="field.default"
-                            :required="field.required"
-                        />
-                    </div>
-                </div>
-            </div>
+            <suspense @resolve="ready = true">
+                <preferences-storage ref="storage" />
+            </suspense>
         </div>
 
         <p v-if="validationError" class="error">{{ validationError }}</p>
 
-        <button @click="save" class="save-btn">
+        <button @click="save" class="save-btn" :disabled="!ready">
             <svg-spinner v-if="saving" />
             <span v-else-if="saved">Saved</span>
             <span v-else>Save</span>
@@ -46,74 +21,39 @@
 </template>
 
 <script setup>
+import PreferencesEncryption from '@/components/preferences/Encryption.vue'
+import PreferencesStorage from '@/components/preferences/Storage.vue'
 import SvgSpinner from '@/components/svg/Spinner.vue'
-import usePlugins from '@/composables/usePlugins'
-import useConfig from '@/composables/useConfig'
-import { ref, computed } from 'vue'
-
-const { plugins, setActivePlugin, testPlugin } = await usePlugins()
-const { config, ensureConfig } = useConfig()
-await ensureConfig()
-
-const normalizeConfig = () => {
-    if (!config.value.adapters) {
-        config.value.adapters = {}
-    }
-
-    for (const plugin of plugins.value) {
-        if (!config.value.adapters[plugin.id]) {
-            config.value.adapters[plugin.id] = {}
-        }
-
-        for (const field of plugin.configSchema) {
-            if (config.value.adapters[plugin.id][field.key] === undefined) {
-                config.value.adapters[plugin.id][field.key] =
-                    field.default ?? ''
-            }
-        }
-    }
-}
-normalizeConfig()
-
-const selectedPluginId = ref(config.value.activeAdapter)
-const validationError = ref('')
-
-const selectedPlugin = computed(() => {
-    return plugins.value.find((p) => p.id === selectedPluginId.value)
-})
+import { ref } from 'vue'
 
+const ready = ref(false)
 const saving = ref(false)
 const saved = ref(false)
+const validationError = ref('')
+
+// Sections
+const storage = ref()
+const encryption = ref()
+
 const save = async () => {
     saving.value = true
+    saved.value = false
     validationError.value = ''
 
-    const plugin = selectedPlugin.value
-    const adapterConfig = config.value.adapters[plugin.id] || {}
+    try {
+        await storage.value.validate()
+        await encryption.value.validate()
 
-    if (plugin && plugin.configSchema.length) {
-        // Check required fields
-        for (const field of plugin.configSchema) {
-            if (field.required && !adapterConfig[field.key]) {
-                validationError.value = `Please fill in all required fields for ${plugin.name}`
-                return
-            }
-        }
-
-        // Test connection
-        // const testResult = await testPlugin(plugin.id, adapterConfig)
-        // console.log(testResult)
-        // if (!testResult) {
-        //     validationError.value = `Failed to connect to ${plugin.name}`
-        // }
-    }
-
-    await setActivePlugin(selectedPluginId.value, adapterConfig)
-    saving.value = false
         saved.value = true
         setTimeout(() => {
             saved.value = false
         }, 2000)
+    } catch (error) {
+        console.error(error.message)
+        validationError.value = error.message
+    } finally {
+        saving.value = false
+    }
 }
 </script>
 
@@ -122,55 +62,18 @@ const save = async () => {
     padding-top: var(--nav-height);
     padding-bottom: 60px;
 
-    h1 {
+    .title {
+        margin-bottom: 25px;
+    }
+    .sections {
+        display: flex;
+        flex-direction: column;
+        gap: 30px;
+    }
+    .section-title {
         margin-bottom: 20px;
     }
 
-    .plugin {
-        display: flex;
-        margin-bottom: 16px;
-    }
-
-    input[type='radio'] {
-        display: block;
-        flex-shrink: 0;
-        width: 10px;
-        height: 10px;
-        margin-right: 10px;
-        border: 1px solid var(--theme-fg);
-        cursor: pointer;
-
-        &:checked {
-            background-color: var(--theme-fg);
-        }
-    }
-
-    .info {
-        .description {
-            color: var(--grey-100);
-            margin-top: 6px;
-        }
-    }
-
-    .config {
-        display: flex;
-        flex-direction: column;
-        gap: 10px;
-        margin-top: 16px;
-    }
-    .config-field {
-        display: flex;
-        flex-direction: column;
-        gap: 4px;
-
-        input {
-            width: 100%;
-            border: 1px solid var(--grey-100);
-            border-radius: 0.2em;
-            padding: 0.2em 0.5em;
-        }
-    }
-
     .error {
         color: red;
         margin-top: 16px;
@@ -193,6 +96,10 @@ const save = async () => {
         &:hover {
             color: var(--theme-accent);
         }
+        &:disabled {
+            opacity: 0.5;
+            cursor: default;
+        }
     }
 }
 </style>