mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-29 00:10:47 +00:00
feat: improve account management
This commit is contained in:
parent
be16d5c21d
commit
4cb49d44c7
@ -11,6 +11,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@getalby/bitcoin-connect-react": "^3.6.1",
|
||||
"@phosphor-icons/react": "^2.1.7",
|
||||
"@radix-ui/react-avatar": "^1.1.0",
|
||||
"@radix-ui/react-checkbox": "^1.1.1",
|
||||
"@radix-ui/react-popover": "^1.1.1",
|
||||
@ -42,8 +43,8 @@
|
||||
"nanoid": "^5.0.7",
|
||||
"nostr-tools": "^2.7.2",
|
||||
"react": "19.0.0-rc-d025ddd3-20240722",
|
||||
"react-dom": "19.0.0-rc-d025ddd3-20240722",
|
||||
"react-currency-input-field": "^3.8.0",
|
||||
"react-dom": "19.0.0-rc-d025ddd3-20240722",
|
||||
"react-hook-form": "^7.52.2",
|
||||
"react-i18next": "^15.0.1",
|
||||
"react-string-replace": "^1.1.1",
|
||||
@ -53,9 +54,6 @@
|
||||
"virtua": "^0.33.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "npm:types-react@19.0.0-rc.1",
|
||||
"@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
|
||||
"babel-plugin-react-compiler": "0.0.0-experimental-696af53-20240625",
|
||||
"@biomejs/biome": "^1.8.3",
|
||||
"@evilmartians/harmony": "^1.2.0",
|
||||
"@tailwindcss/forms": "^0.5.7",
|
||||
@ -63,8 +61,11 @@
|
||||
"@tanstack/router-devtools": "^1.47.1",
|
||||
"@tanstack/router-plugin": "^1.47.0",
|
||||
"@tauri-apps/cli": "2.0.0-rc.1",
|
||||
"@types/react": "npm:types-react@19.0.0-rc.1",
|
||||
"@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
|
||||
"@vitejs/plugin-react": "^4.3.1",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"babel-plugin-react-compiler": "0.0.0-experimental-696af53-20240625",
|
||||
"clsx": "^2.1.1",
|
||||
"postcss": "^8.4.41",
|
||||
"tailwind-gradient-mask-image": "^1.2.0",
|
||||
|
@ -11,6 +11,9 @@ importers:
|
||||
'@getalby/bitcoin-connect-react':
|
||||
specifier: ^3.6.1
|
||||
version: 3.6.1(immer@10.1.1)(react@19.0.0-rc-d025ddd3-20240722)(types-react@19.0.0-rc.1)(typescript@5.5.4)
|
||||
'@phosphor-icons/react':
|
||||
specifier: ^2.1.7
|
||||
version: 2.1.7(react-dom@19.0.0-rc-d025ddd3-20240722(react@19.0.0-rc-d025ddd3-20240722))(react@19.0.0-rc-d025ddd3-20240722)
|
||||
'@radix-ui/react-avatar':
|
||||
specifier: ^1.1.0
|
||||
version: 1.1.0(react-dom@19.0.0-rc-d025ddd3-20240722(react@19.0.0-rc-d025ddd3-20240722))(react@19.0.0-rc-d025ddd3-20240722)(types-react-dom@19.0.0-rc.1)(types-react@19.0.0-rc.1)
|
||||
@ -607,6 +610,13 @@ packages:
|
||||
resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
|
||||
engines: {node: '>= 8'}
|
||||
|
||||
'@phosphor-icons/react@2.1.7':
|
||||
resolution: {integrity: sha512-g2e2eVAn1XG2a+LI09QU3IORLhnFNAFkNbo2iwbX6NOKSLOwvEMmTa7CgOzEbgNWR47z8i8kwjdvYZ5fkGx1mQ==}
|
||||
engines: {node: '>=10'}
|
||||
peerDependencies:
|
||||
react: '>= 16.8'
|
||||
react-dom: '>= 16.8'
|
||||
|
||||
'@pkgjs/parseargs@0.11.0':
|
||||
resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
|
||||
engines: {node: '>=14'}
|
||||
@ -2604,6 +2614,11 @@ snapshots:
|
||||
'@nodelib/fs.scandir': 2.1.5
|
||||
fastq: 1.17.1
|
||||
|
||||
'@phosphor-icons/react@2.1.7(react-dom@19.0.0-rc-d025ddd3-20240722(react@19.0.0-rc-d025ddd3-20240722))(react@19.0.0-rc-d025ddd3-20240722)':
|
||||
dependencies:
|
||||
react: 19.0.0-rc-d025ddd3-20240722
|
||||
react-dom: 19.0.0-rc-d025ddd3-20240722(react@19.0.0-rc-d025ddd3-20240722)
|
||||
|
||||
'@pkgjs/parseargs@0.11.0':
|
||||
optional: true
|
||||
|
||||
|
@ -1,29 +1,30 @@
|
||||
#[cfg(target_os = "macos")]
|
||||
use crate::commands::tray::create_tray_panel;
|
||||
use crate::common::{get_user_settings, init_nip65, parse_event};
|
||||
use crate::{Nostr, RichEvent, NEWSFEED_NEG_LIMIT, NOTIFICATION_NEG_LIMIT};
|
||||
|
||||
use keyring::Entry;
|
||||
use keyring_search::{Limit, List, Search};
|
||||
use nostr_sdk::prelude::*;
|
||||
use serde::Serialize;
|
||||
use serde::{Deserialize, Serialize};
|
||||
use specta::Type;
|
||||
use std::collections::HashSet;
|
||||
use std::time::Duration;
|
||||
use std::{collections::HashSet, str::FromStr, time::Duration};
|
||||
use tauri::{Emitter, EventTarget, Manager, State};
|
||||
use tauri_plugin_notification::NotificationExt;
|
||||
|
||||
#[derive(Serialize, Type)]
|
||||
pub struct Account {
|
||||
npub: String,
|
||||
nsec: String,
|
||||
// #[cfg(target_os = "macos")]
|
||||
// use crate::commands::tray::create_tray_panel;
|
||||
use crate::{
|
||||
common::{get_user_settings, init_nip65, parse_event},
|
||||
Nostr, RichEvent, NEWSFEED_NEG_LIMIT, NOTIFICATION_NEG_LIMIT,
|
||||
};
|
||||
|
||||
#[derive(Debug, Clone, Serialize, Deserialize, Type)]
|
||||
struct Account {
|
||||
password: String,
|
||||
nostr_connect: Option<String>,
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub fn get_accounts() -> Vec<String> {
|
||||
let search = Search::new().expect("Unexpected.");
|
||||
let results = search.by_service("Lume");
|
||||
let results = search.by_service("Lume Secret Storage");
|
||||
let list = List::list_credentials(&results, Limit::All);
|
||||
let accounts: HashSet<String> = list
|
||||
.split_whitespace()
|
||||
@ -36,76 +37,96 @@ pub fn get_accounts() -> Vec<String> {
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub fn create_account() -> Result<Account, String> {
|
||||
let keys = Keys::generate();
|
||||
let public_key = keys.public_key();
|
||||
let secret_key = keys.secret_key().unwrap();
|
||||
|
||||
let result = Account {
|
||||
npub: public_key.to_bech32().unwrap(),
|
||||
nsec: secret_key.to_bech32().unwrap(),
|
||||
};
|
||||
|
||||
Ok(result)
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub fn get_private_key(npub: &str) -> Result<String, String> {
|
||||
let keyring = Entry::new("Lume", npub).unwrap();
|
||||
|
||||
if let Ok(nsec) = keyring.get_password() {
|
||||
let secret_key = SecretKey::from_bech32(nsec).unwrap();
|
||||
Ok(secret_key.to_bech32().unwrap())
|
||||
} else {
|
||||
Err("Key not found".into())
|
||||
}
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub async fn save_account(
|
||||
nsec: &str,
|
||||
password: &str,
|
||||
pub async fn create_account(
|
||||
name: String,
|
||||
about: String,
|
||||
picture: String,
|
||||
password: String,
|
||||
state: State<'_, Nostr>,
|
||||
) -> Result<String, String> {
|
||||
let secret_key = if nsec.starts_with("ncryptsec") {
|
||||
let encrypted_key = EncryptedSecretKey::from_bech32(nsec).unwrap();
|
||||
encrypted_key
|
||||
.to_secret_key(password)
|
||||
.map_err(|err| err.to_string())
|
||||
} else {
|
||||
SecretKey::from_bech32(nsec).map_err(|err| err.to_string())
|
||||
let client = &state.client;
|
||||
let keys = Keys::generate();
|
||||
let npub = keys.public_key().to_bech32().map_err(|e| e.to_string())?;
|
||||
let secret_key = keys.secret_key().map_err(|e| e.to_string())?;
|
||||
let enc = EncryptedSecretKey::new(secret_key, password, 16, KeySecurity::Medium)
|
||||
.map_err(|err| err.to_string())?;
|
||||
let enc_bech32 = enc.to_bech32().map_err(|err| err.to_string())?;
|
||||
|
||||
// Save account
|
||||
let keyring = Entry::new("Lume Secret Storage", &npub).map_err(|e| e.to_string())?;
|
||||
let account = Account {
|
||||
password: enc_bech32,
|
||||
nostr_connect: None,
|
||||
};
|
||||
let j = serde_json::to_string(&account).map_err(|e| e.to_string())?;
|
||||
let _ = keyring.set_password(&j);
|
||||
|
||||
match secret_key {
|
||||
Ok(val) => {
|
||||
let nostr_keys = Keys::new(val);
|
||||
let npub = nostr_keys.public_key().to_bech32().unwrap();
|
||||
let nsec = nostr_keys.secret_key().unwrap().to_bech32().unwrap();
|
||||
let signer = NostrSigner::Keys(keys);
|
||||
|
||||
let keyring = Entry::new("Lume", &npub).unwrap();
|
||||
let _ = keyring.set_password(&nsec);
|
||||
// Update signer
|
||||
client.set_signer(Some(signer)).await;
|
||||
|
||||
let signer = NostrSigner::Keys(nostr_keys);
|
||||
let client = &state.client;
|
||||
let mut metadata = Metadata::new()
|
||||
.display_name(name.clone())
|
||||
.name(name.to_lowercase())
|
||||
.about(about);
|
||||
|
||||
// Update client's signer
|
||||
client.set_signer(Some(signer)).await;
|
||||
if let Ok(url) = Url::parse(&picture) {
|
||||
metadata = metadata.picture(url)
|
||||
}
|
||||
|
||||
Ok(npub)
|
||||
}
|
||||
Err(msg) => Err(msg),
|
||||
match client.set_metadata(&metadata).await {
|
||||
Ok(_) => Ok(npub),
|
||||
Err(e) => Err(e.to_string()),
|
||||
}
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub async fn connect_remote_account(uri: &str, state: State<'_, Nostr>) -> Result<String, String> {
|
||||
pub async fn import_account(
|
||||
key: String,
|
||||
password: Option<String>,
|
||||
state: State<'_, Nostr>,
|
||||
) -> Result<String, String> {
|
||||
let client = &state.client;
|
||||
let secret_key = SecretKey::from_bech32(key).map_err(|err| err.to_string())?;
|
||||
let keys = Keys::new(secret_key.clone());
|
||||
let npub = keys.public_key().to_bech32().unwrap();
|
||||
|
||||
let enc_bech32 = match password {
|
||||
Some(pw) => {
|
||||
let enc = EncryptedSecretKey::new(&secret_key, pw, 16, KeySecurity::Medium)
|
||||
.map_err(|err| err.to_string())?;
|
||||
|
||||
enc.to_bech32().map_err(|err| err.to_string())?
|
||||
}
|
||||
None => secret_key.to_bech32().map_err(|err| err.to_string())?,
|
||||
};
|
||||
|
||||
let keyring = Entry::new("Lume Secret Storage", &npub).map_err(|e| e.to_string())?;
|
||||
let account = Account {
|
||||
password: enc_bech32,
|
||||
nostr_connect: None,
|
||||
};
|
||||
let j = serde_json::to_string(&account).map_err(|e| e.to_string())?;
|
||||
let _ = keyring.set_password(&j);
|
||||
|
||||
let signer = NostrSigner::Keys(keys);
|
||||
|
||||
// Update client's signer
|
||||
client.set_signer(Some(signer)).await;
|
||||
|
||||
Ok(npub)
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub async fn connect_account(uri: String, state: State<'_, Nostr>) -> Result<String, String> {
|
||||
let client = &state.client;
|
||||
|
||||
match NostrConnectURI::parse(uri) {
|
||||
match NostrConnectURI::parse(uri.clone()) {
|
||||
Ok(bunker_uri) => {
|
||||
// Local user
|
||||
let app_keys = Keys::generate();
|
||||
let app_secret = app_keys.secret_key().unwrap().to_string();
|
||||
|
||||
@ -115,8 +136,22 @@ pub async fn connect_remote_account(uri: &str, state: State<'_, Nostr>) -> Resul
|
||||
|
||||
match Nip46Signer::new(bunker_uri, app_keys, Duration::from_secs(120), None).await {
|
||||
Ok(signer) => {
|
||||
let keyring = Entry::new("Lume", &remote_npub).unwrap();
|
||||
let _ = keyring.set_password(&app_secret);
|
||||
let mut url = Url::parse(&uri).unwrap();
|
||||
let query: Vec<(String, String)> = url
|
||||
.query_pairs()
|
||||
.filter(|(name, _)| name != "secret")
|
||||
.map(|(name, value)| (name.into_owned(), value.into_owned()))
|
||||
.collect();
|
||||
url.query_pairs_mut().clear().extend_pairs(&query);
|
||||
|
||||
let key = format!("{}_nostrconnect", remote_npub);
|
||||
let keyring = Entry::new("Lume Secret Storage", &key).unwrap();
|
||||
let account = Account {
|
||||
password: app_secret,
|
||||
nostr_connect: Some(url.to_string()),
|
||||
};
|
||||
let j = serde_json::to_string(&account).map_err(|e| e.to_string())?;
|
||||
let _ = keyring.set_password(&j);
|
||||
|
||||
// Update signer
|
||||
let _ = client.set_signer(Some(signer.into())).await;
|
||||
@ -132,75 +167,74 @@ pub async fn connect_remote_account(uri: &str, state: State<'_, Nostr>) -> Resul
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub async fn get_encrypted_key(npub: &str, password: &str) -> Result<String, String> {
|
||||
let keyring = Entry::new("Lume", npub).unwrap();
|
||||
pub fn delete_account(id: String) -> Result<(), String> {
|
||||
let keyring = Entry::new("Lume Secret Storage", &id).map_err(|e| e.to_string())?;
|
||||
let _ = keyring.delete_credential();
|
||||
|
||||
if let Ok(nsec) = keyring.get_password() {
|
||||
let secret_key = SecretKey::from_bech32(nsec).unwrap();
|
||||
let new_key = EncryptedSecretKey::new(&secret_key, password, 16, KeySecurity::Medium);
|
||||
|
||||
if let Ok(key) = new_key {
|
||||
Ok(key.to_bech32().unwrap())
|
||||
} else {
|
||||
Err("Encrypt key failed".into())
|
||||
}
|
||||
} else {
|
||||
Err("Key not found".into())
|
||||
}
|
||||
Ok(())
|
||||
}
|
||||
|
||||
#[tauri::command]
|
||||
#[specta::specta]
|
||||
pub async fn load_account(
|
||||
npub: &str,
|
||||
bunker: Option<&str>,
|
||||
pub async fn login(
|
||||
account: String,
|
||||
password: String,
|
||||
state: State<'_, Nostr>,
|
||||
app: tauri::AppHandle,
|
||||
) -> Result<bool, String> {
|
||||
) -> Result<String, String> {
|
||||
let handle = app.clone();
|
||||
let client = &state.client;
|
||||
let keyring = Entry::new("Lume", npub).unwrap();
|
||||
let keyring = Entry::new("Lume Secret Storage", &account).map_err(|e| e.to_string())?;
|
||||
|
||||
let password = match keyring.get_password() {
|
||||
Ok(pw) => pw,
|
||||
Err(_) => return Err("Cancelled".into()),
|
||||
let account = match keyring.get_password() {
|
||||
Ok(pw) => {
|
||||
let account: Account = serde_json::from_str(&pw).map_err(|e| e.to_string())?;
|
||||
account
|
||||
}
|
||||
Err(e) => return Err(e.to_string()),
|
||||
};
|
||||
|
||||
match bunker {
|
||||
Some(uri) => {
|
||||
let app_keys =
|
||||
Keys::parse(password).expect("Secret Key is modified, please check again.");
|
||||
|
||||
match NostrConnectURI::parse(uri) {
|
||||
Ok(bunker_uri) => {
|
||||
match Nip46Signer::new(bunker_uri, app_keys, Duration::from_secs(30), None)
|
||||
.await
|
||||
{
|
||||
Ok(signer) => client.set_signer(Some(signer.into())).await,
|
||||
Err(err) => return Err(err.to_string()),
|
||||
}
|
||||
}
|
||||
Err(err) => return Err(err.to_string()),
|
||||
}
|
||||
}
|
||||
let public_key = match account.nostr_connect {
|
||||
None => {
|
||||
let keys = Keys::parse(password).expect("Secret Key is modified, please check again.");
|
||||
let ncryptsec =
|
||||
EncryptedSecretKey::from_bech32(account.password).map_err(|e| e.to_string())?;
|
||||
let secret_key = ncryptsec
|
||||
.to_secret_key(password)
|
||||
.map_err(|_| "Wrong password.")?;
|
||||
let keys = Keys::new(secret_key);
|
||||
let public_key = keys.public_key().to_bech32().unwrap();
|
||||
let signer = NostrSigner::Keys(keys);
|
||||
|
||||
// Update signer
|
||||
client.set_signer(Some(signer)).await;
|
||||
|
||||
public_key
|
||||
}
|
||||
}
|
||||
Some(bunker) => {
|
||||
let uri = NostrConnectURI::parse(bunker).map_err(|e| e.to_string())?;
|
||||
let public_key = uri.signer_public_key().unwrap().to_bech32().unwrap();
|
||||
let app_keys = Keys::from_str(&account.password).map_err(|e| e.to_string())?;
|
||||
|
||||
match Nip46Signer::new(uri, app_keys, Duration::from_secs(120), None).await {
|
||||
Ok(signer) => {
|
||||
// Update signer
|
||||
client.set_signer(Some(signer.into())).await;
|
||||
public_key
|
||||
}
|
||||
Err(e) => return Err(e.to_string()),
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Connect to user's relay (NIP-65)
|
||||
init_nip65(client).await;
|
||||
|
||||
// Create tray (macOS)
|
||||
#[cfg(target_os = "macos")]
|
||||
create_tray_panel(npub, &handle);
|
||||
// #[cfg(target_os = "macos")]
|
||||
// create_tray_panel(&public_key.to_bech32().unwrap(), &handle);
|
||||
|
||||
// Get user's contact list
|
||||
if let Ok(contacts) = client.get_contact_list(None).await {
|
||||
if let Ok(contacts) = client.get_contact_list(Some(Duration::from_secs(5))).await {
|
||||
*state.contact_list.lock().unwrap() = contacts
|
||||
};
|
||||
|
||||
@ -418,5 +452,5 @@ pub async fn load_account(
|
||||
.await
|
||||
});
|
||||
|
||||
Ok(true)
|
||||
Ok(public_key)
|
||||
}
|
@ -1,5 +1,5 @@
|
||||
pub mod account;
|
||||
pub mod event;
|
||||
pub mod keys;
|
||||
pub mod metadata;
|
||||
pub mod relay;
|
||||
#[cfg(target_os = "macos")]
|
||||
|
@ -11,7 +11,7 @@ extern crate objc;
|
||||
|
||||
#[cfg(target_os = "macos")]
|
||||
use border::WebviewWindowExt as BorderWebviewWindowExt;
|
||||
use commands::{event::*, keys::*, metadata::*, relay::*, window::*};
|
||||
use commands::{account::*, event::*, metadata::*, relay::*, window::*};
|
||||
use nostr_sdk::prelude::*;
|
||||
use serde::{Deserialize, Serialize};
|
||||
use specta::Type;
|
||||
@ -85,11 +85,10 @@ fn main() {
|
||||
save_bootstrap_relays,
|
||||
get_accounts,
|
||||
create_account,
|
||||
save_account,
|
||||
get_encrypted_key,
|
||||
get_private_key,
|
||||
connect_remote_account,
|
||||
load_account,
|
||||
import_account,
|
||||
connect_account,
|
||||
delete_account,
|
||||
login,
|
||||
get_current_profile,
|
||||
get_profile,
|
||||
get_contact_list,
|
||||
|
@ -48,49 +48,41 @@ async saveBootstrapRelays(relays: string) : Promise<Result<null, string>> {
|
||||
async getAccounts() : Promise<string[]> {
|
||||
return await TAURI_INVOKE("get_accounts");
|
||||
},
|
||||
async createAccount() : Promise<Result<Account, string>> {
|
||||
async createAccount(name: string, about: string, picture: string, password: string) : Promise<Result<string, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("create_account") };
|
||||
return { status: "ok", data: await TAURI_INVOKE("create_account", { name, about, picture, password }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
}
|
||||
},
|
||||
async saveAccount(nsec: string, password: string) : Promise<Result<string, string>> {
|
||||
async importAccount(key: string, password: string | null) : Promise<Result<string, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("save_account", { nsec, password }) };
|
||||
return { status: "ok", data: await TAURI_INVOKE("import_account", { key, password }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
}
|
||||
},
|
||||
async getEncryptedKey(npub: string, password: string) : Promise<Result<string, string>> {
|
||||
async connectAccount(uri: string) : Promise<Result<string, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("get_encrypted_key", { npub, password }) };
|
||||
return { status: "ok", data: await TAURI_INVOKE("connect_account", { uri }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
}
|
||||
},
|
||||
async getPrivateKey(npub: string) : Promise<Result<string, string>> {
|
||||
async deleteAccount(id: string) : Promise<Result<null, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("get_private_key", { npub }) };
|
||||
return { status: "ok", data: await TAURI_INVOKE("delete_account", { id }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
}
|
||||
},
|
||||
async connectRemoteAccount(uri: string) : Promise<Result<string, string>> {
|
||||
async login(account: string, password: string) : Promise<Result<string, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("connect_remote_account", { uri }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
}
|
||||
},
|
||||
async loadAccount(npub: string, bunker: string | null) : Promise<Result<boolean, string>> {
|
||||
try {
|
||||
return { status: "ok", data: await TAURI_INVOKE("load_account", { npub, bunker }) };
|
||||
return { status: "ok", data: await TAURI_INVOKE("login", { account, password }) };
|
||||
} catch (e) {
|
||||
if(e instanceof Error) throw e;
|
||||
else return { status: "error", error: e as any };
|
||||
@ -461,7 +453,6 @@ async setBadge(count: number) : Promise<void> {
|
||||
|
||||
/** user-defined types **/
|
||||
|
||||
export type Account = { npub: string; nsec: string }
|
||||
export type Column = { label: string; url: string; x: number; y: number; width: number; height: number }
|
||||
export type Meta = { content: string; images: string[]; videos: string[]; events: string[]; mentions: string[]; hashtags: string[] }
|
||||
export type Relays = { connected: string[]; read: string[] | null; write: string[] | null; both: string[] | null }
|
||||
|
20
src/components/back.tsx
Normal file
20
src/components/back.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import { cn } from "@/commons";
|
||||
import { useRouter } from "@tanstack/react-router";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export function GoBack({
|
||||
children,
|
||||
className,
|
||||
}: { children: ReactNode | ReactNode[]; className?: string }) {
|
||||
const { history } = useRouter();
|
||||
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => history.go(-1)}
|
||||
className={cn(className)}
|
||||
>
|
||||
{children}
|
||||
</button>
|
||||
);
|
||||
}
|
27
src/components/frame.tsx
Normal file
27
src/components/frame.tsx
Normal file
@ -0,0 +1,27 @@
|
||||
import { cn } from "@/commons";
|
||||
import { useRouteContext } from "@tanstack/react-router";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export function Frame({
|
||||
children,
|
||||
shadow,
|
||||
className,
|
||||
}: { children: ReactNode; shadow?: boolean; className?: string }) {
|
||||
const { platform } = useRouteContext({ strict: false });
|
||||
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
className,
|
||||
platform === "linux"
|
||||
? "bg-white dark:bg-neutral-950"
|
||||
: "bg-white dark:bg-white/10",
|
||||
shadow
|
||||
? "shadow-lg shadow-neutral-500/10 dark:shadow-none dark:ring-1 dark:ring-white/20"
|
||||
: "",
|
||||
)}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
@ -1,4 +1,6 @@
|
||||
export * from "./container";
|
||||
export * from "./frame";
|
||||
export * from "./back";
|
||||
export * from "./box";
|
||||
export * from "./spinner";
|
||||
export * from "./quote";
|
||||
|
@ -26,11 +26,11 @@ import { Route as CreateTopicImport } from './routes/create-topic'
|
||||
import { Route as CreateNewsfeedImport } from './routes/create-newsfeed'
|
||||
import { Route as CreateGroupImport } from './routes/create-group'
|
||||
import { Route as BootstrapRelaysImport } from './routes/bootstrap-relays'
|
||||
import { Route as AccountImport } from './routes/$account'
|
||||
import { Route as IndexImport } from './routes/index'
|
||||
import { Route as EditorIndexImport } from './routes/editor/index'
|
||||
import { Route as AccountIndexImport } from './routes/$account/index'
|
||||
import { Route as ZapIdImport } from './routes/zap.$id'
|
||||
import { Route as UsersPubkeyImport } from './routes/users/$pubkey'
|
||||
import { Route as UsersIdImport } from './routes/users.$id'
|
||||
import { Route as TrendingUsersImport } from './routes/trending.users'
|
||||
import { Route as TrendingNotesImport } from './routes/trending.notes'
|
||||
import { Route as SettingsWalletImport } from './routes/settings/wallet'
|
||||
@ -44,29 +44,23 @@ import { Route as SearchNotesImport } from './routes/search.notes'
|
||||
import { Route as EventsIdImport } from './routes/events/$id'
|
||||
import { Route as CreateNewsfeedUsersImport } from './routes/create-newsfeed.users'
|
||||
import { Route as CreateNewsfeedF2fImport } from './routes/create-newsfeed.f2f'
|
||||
import { Route as AuthCreateProfileImport } from './routes/auth/create-profile'
|
||||
import { Route as AccountPanelImport } from './routes/$account/panel'
|
||||
import { Route as AccountHomeImport } from './routes/$account/home'
|
||||
import { Route as AuthAccountBackupImport } from './routes/auth/$account.backup'
|
||||
import { Route as AccountBackupImport } from './routes/$account/backup'
|
||||
|
||||
// Create Virtual Routes
|
||||
|
||||
const LandingLazyImport = createFileRoute('/landing')()
|
||||
const AuthLazyImport = createFileRoute('/auth')()
|
||||
const AuthRemoteLazyImport = createFileRoute('/auth/remote')()
|
||||
const NewLazyImport = createFileRoute('/new')()
|
||||
const AuthNewLazyImport = createFileRoute('/auth/new')()
|
||||
const AuthImportLazyImport = createFileRoute('/auth/import')()
|
||||
const AuthConnectLazyImport = createFileRoute('/auth/connect')()
|
||||
const AccountPanelLazyImport = createFileRoute('/$account/panel')()
|
||||
|
||||
// Create/Update Routes
|
||||
|
||||
const LandingLazyRoute = LandingLazyImport.update({
|
||||
path: '/landing',
|
||||
const NewLazyRoute = NewLazyImport.update({
|
||||
path: '/new',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() => import('./routes/landing.lazy').then((d) => d.Route))
|
||||
|
||||
const AuthLazyRoute = AuthLazyImport.update({
|
||||
path: '/auth',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() => import('./routes/auth.lazy').then((d) => d.Route))
|
||||
} as any).lazy(() => import('./routes/new.lazy').then((d) => d.Route))
|
||||
|
||||
const TrendingRoute = TrendingImport.update({
|
||||
path: '/trending',
|
||||
@ -133,40 +127,50 @@ const BootstrapRelaysRoute = BootstrapRelaysImport.update({
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
|
||||
const AccountRoute = AccountImport.update({
|
||||
path: '/$account',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() => import('./routes/$account.lazy').then((d) => d.Route))
|
||||
|
||||
const IndexRoute = IndexImport.update({
|
||||
path: '/',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
} as any).lazy(() => import('./routes/index.lazy').then((d) => d.Route))
|
||||
|
||||
const EditorIndexRoute = EditorIndexImport.update({
|
||||
path: '/editor/',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
|
||||
const AccountIndexRoute = AccountIndexImport.update({
|
||||
path: '/$account/',
|
||||
const AuthNewLazyRoute = AuthNewLazyImport.update({
|
||||
path: '/auth/new',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() =>
|
||||
import('./routes/$account/index.lazy').then((d) => d.Route),
|
||||
)
|
||||
|
||||
const AuthRemoteLazyRoute = AuthRemoteLazyImport.update({
|
||||
path: '/remote',
|
||||
getParentRoute: () => AuthLazyRoute,
|
||||
} as any).lazy(() => import('./routes/auth/remote.lazy').then((d) => d.Route))
|
||||
} as any).lazy(() => import('./routes/auth/new.lazy').then((d) => d.Route))
|
||||
|
||||
const AuthImportLazyRoute = AuthImportLazyImport.update({
|
||||
path: '/import',
|
||||
getParentRoute: () => AuthLazyRoute,
|
||||
path: '/auth/import',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() => import('./routes/auth/import.lazy').then((d) => d.Route))
|
||||
|
||||
const AuthConnectLazyRoute = AuthConnectLazyImport.update({
|
||||
path: '/auth/connect',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() => import('./routes/auth/connect.lazy').then((d) => d.Route))
|
||||
|
||||
const AccountPanelLazyRoute = AccountPanelLazyImport.update({
|
||||
path: '/panel',
|
||||
getParentRoute: () => AccountRoute,
|
||||
} as any).lazy(() =>
|
||||
import('./routes/$account/panel.lazy').then((d) => d.Route),
|
||||
)
|
||||
|
||||
const ZapIdRoute = ZapIdImport.update({
|
||||
path: '/zap/$id',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
|
||||
const UsersPubkeyRoute = UsersPubkeyImport.update({
|
||||
path: '/users/$pubkey',
|
||||
const UsersIdRoute = UsersIdImport.update({
|
||||
path: '/users/$id',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any)
|
||||
|
||||
@ -235,26 +239,14 @@ const CreateNewsfeedF2fRoute = CreateNewsfeedF2fImport.update({
|
||||
getParentRoute: () => CreateNewsfeedRoute,
|
||||
} as any)
|
||||
|
||||
const AuthCreateProfileRoute = AuthCreateProfileImport.update({
|
||||
path: '/create-profile',
|
||||
getParentRoute: () => AuthLazyRoute,
|
||||
} as any)
|
||||
|
||||
const AccountPanelRoute = AccountPanelImport.update({
|
||||
path: '/$account/panel',
|
||||
getParentRoute: () => rootRoute,
|
||||
} as any).lazy(() =>
|
||||
import('./routes/$account/panel.lazy').then((d) => d.Route),
|
||||
)
|
||||
|
||||
const AccountHomeRoute = AccountHomeImport.update({
|
||||
path: '/$account/home',
|
||||
getParentRoute: () => rootRoute,
|
||||
path: '/home',
|
||||
getParentRoute: () => AccountRoute,
|
||||
} as any).lazy(() => import('./routes/$account/home.lazy').then((d) => d.Route))
|
||||
|
||||
const AuthAccountBackupRoute = AuthAccountBackupImport.update({
|
||||
path: '/$account/backup',
|
||||
getParentRoute: () => AuthLazyRoute,
|
||||
const AccountBackupRoute = AccountBackupImport.update({
|
||||
path: '/backup',
|
||||
getParentRoute: () => AccountRoute,
|
||||
} as any)
|
||||
|
||||
// Populate the FileRoutesByPath interface
|
||||
@ -268,6 +260,13 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof IndexImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/$account': {
|
||||
id: '/$account'
|
||||
path: '/$account'
|
||||
fullPath: '/$account'
|
||||
preLoaderRoute: typeof AccountImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/bootstrap-relays': {
|
||||
id: '/bootstrap-relays'
|
||||
path: '/bootstrap-relays'
|
||||
@ -359,40 +358,26 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof TrendingImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/auth': {
|
||||
id: '/auth'
|
||||
path: '/auth'
|
||||
fullPath: '/auth'
|
||||
preLoaderRoute: typeof AuthLazyImport
|
||||
'/new': {
|
||||
id: '/new'
|
||||
path: '/new'
|
||||
fullPath: '/new'
|
||||
preLoaderRoute: typeof NewLazyImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/landing': {
|
||||
id: '/landing'
|
||||
path: '/landing'
|
||||
fullPath: '/landing'
|
||||
preLoaderRoute: typeof LandingLazyImport
|
||||
parentRoute: typeof rootRoute
|
||||
'/$account/backup': {
|
||||
id: '/$account/backup'
|
||||
path: '/backup'
|
||||
fullPath: '/$account/backup'
|
||||
preLoaderRoute: typeof AccountBackupImport
|
||||
parentRoute: typeof AccountImport
|
||||
}
|
||||
'/$account/home': {
|
||||
id: '/$account/home'
|
||||
path: '/$account/home'
|
||||
path: '/home'
|
||||
fullPath: '/$account/home'
|
||||
preLoaderRoute: typeof AccountHomeImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/$account/panel': {
|
||||
id: '/$account/panel'
|
||||
path: '/$account/panel'
|
||||
fullPath: '/$account/panel'
|
||||
preLoaderRoute: typeof AccountPanelImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/auth/create-profile': {
|
||||
id: '/auth/create-profile'
|
||||
path: '/create-profile'
|
||||
fullPath: '/auth/create-profile'
|
||||
preLoaderRoute: typeof AuthCreateProfileImport
|
||||
parentRoute: typeof AuthLazyImport
|
||||
parentRoute: typeof AccountImport
|
||||
}
|
||||
'/create-newsfeed/f2f': {
|
||||
id: '/create-newsfeed/f2f'
|
||||
@ -485,11 +470,11 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof TrendingUsersImport
|
||||
parentRoute: typeof TrendingImport
|
||||
}
|
||||
'/users/$pubkey': {
|
||||
id: '/users/$pubkey'
|
||||
path: '/users/$pubkey'
|
||||
fullPath: '/users/$pubkey'
|
||||
preLoaderRoute: typeof UsersPubkeyImport
|
||||
'/users/$id': {
|
||||
id: '/users/$id'
|
||||
path: '/users/$id'
|
||||
fullPath: '/users/$id'
|
||||
preLoaderRoute: typeof UsersIdImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/zap/$id': {
|
||||
@ -499,25 +484,32 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof ZapIdImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/$account/panel': {
|
||||
id: '/$account/panel'
|
||||
path: '/panel'
|
||||
fullPath: '/$account/panel'
|
||||
preLoaderRoute: typeof AccountPanelLazyImport
|
||||
parentRoute: typeof AccountImport
|
||||
}
|
||||
'/auth/connect': {
|
||||
id: '/auth/connect'
|
||||
path: '/auth/connect'
|
||||
fullPath: '/auth/connect'
|
||||
preLoaderRoute: typeof AuthConnectLazyImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/auth/import': {
|
||||
id: '/auth/import'
|
||||
path: '/import'
|
||||
path: '/auth/import'
|
||||
fullPath: '/auth/import'
|
||||
preLoaderRoute: typeof AuthImportLazyImport
|
||||
parentRoute: typeof AuthLazyImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/auth/remote': {
|
||||
id: '/auth/remote'
|
||||
path: '/remote'
|
||||
fullPath: '/auth/remote'
|
||||
preLoaderRoute: typeof AuthRemoteLazyImport
|
||||
parentRoute: typeof AuthLazyImport
|
||||
}
|
||||
'/$account/': {
|
||||
id: '/$account/'
|
||||
path: '/$account'
|
||||
fullPath: '/$account'
|
||||
preLoaderRoute: typeof AccountIndexImport
|
||||
'/auth/new': {
|
||||
id: '/auth/new'
|
||||
path: '/auth/new'
|
||||
fullPath: '/auth/new'
|
||||
preLoaderRoute: typeof AuthNewLazyImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/editor/': {
|
||||
@ -527,13 +519,6 @@ declare module '@tanstack/react-router' {
|
||||
preLoaderRoute: typeof EditorIndexImport
|
||||
parentRoute: typeof rootRoute
|
||||
}
|
||||
'/auth/$account/backup': {
|
||||
id: '/auth/$account/backup'
|
||||
path: '/$account/backup'
|
||||
fullPath: '/auth/$account/backup'
|
||||
preLoaderRoute: typeof AuthAccountBackupImport
|
||||
parentRoute: typeof AuthLazyImport
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -541,6 +526,11 @@ declare module '@tanstack/react-router' {
|
||||
|
||||
export const routeTree = rootRoute.addChildren({
|
||||
IndexRoute,
|
||||
AccountRoute: AccountRoute.addChildren({
|
||||
AccountBackupRoute,
|
||||
AccountHomeRoute,
|
||||
AccountPanelLazyRoute,
|
||||
}),
|
||||
BootstrapRelaysRoute,
|
||||
CreateGroupRoute,
|
||||
CreateNewsfeedRoute: CreateNewsfeedRoute.addChildren({
|
||||
@ -567,19 +557,13 @@ export const routeTree = rootRoute.addChildren({
|
||||
TrendingNotesRoute,
|
||||
TrendingUsersRoute,
|
||||
}),
|
||||
AuthLazyRoute: AuthLazyRoute.addChildren({
|
||||
AuthCreateProfileRoute,
|
||||
AuthImportLazyRoute,
|
||||
AuthRemoteLazyRoute,
|
||||
AuthAccountBackupRoute,
|
||||
}),
|
||||
LandingLazyRoute,
|
||||
AccountHomeRoute,
|
||||
AccountPanelRoute,
|
||||
NewLazyRoute,
|
||||
EventsIdRoute,
|
||||
UsersPubkeyRoute,
|
||||
UsersIdRoute,
|
||||
ZapIdRoute,
|
||||
AccountIndexRoute,
|
||||
AuthConnectLazyRoute,
|
||||
AuthImportLazyRoute,
|
||||
AuthNewLazyRoute,
|
||||
EditorIndexRoute,
|
||||
})
|
||||
|
||||
@ -592,6 +576,7 @@ export const routeTree = rootRoute.addChildren({
|
||||
"filePath": "__root.tsx",
|
||||
"children": [
|
||||
"/",
|
||||
"/$account",
|
||||
"/bootstrap-relays",
|
||||
"/create-group",
|
||||
"/create-newsfeed",
|
||||
@ -605,20 +590,27 @@ export const routeTree = rootRoute.addChildren({
|
||||
"/store",
|
||||
"/topic",
|
||||
"/trending",
|
||||
"/auth",
|
||||
"/landing",
|
||||
"/$account/home",
|
||||
"/$account/panel",
|
||||
"/new",
|
||||
"/events/$id",
|
||||
"/users/$pubkey",
|
||||
"/users/$id",
|
||||
"/zap/$id",
|
||||
"/$account/",
|
||||
"/auth/connect",
|
||||
"/auth/import",
|
||||
"/auth/new",
|
||||
"/editor/"
|
||||
]
|
||||
},
|
||||
"/": {
|
||||
"filePath": "index.tsx"
|
||||
},
|
||||
"/$account": {
|
||||
"filePath": "$account.tsx",
|
||||
"children": [
|
||||
"/$account/backup",
|
||||
"/$account/home",
|
||||
"/$account/panel"
|
||||
]
|
||||
},
|
||||
"/bootstrap-relays": {
|
||||
"filePath": "bootstrap-relays.tsx"
|
||||
},
|
||||
@ -678,27 +670,16 @@ export const routeTree = rootRoute.addChildren({
|
||||
"/trending/users"
|
||||
]
|
||||
},
|
||||
"/auth": {
|
||||
"filePath": "auth.lazy.tsx",
|
||||
"children": [
|
||||
"/auth/create-profile",
|
||||
"/auth/import",
|
||||
"/auth/remote",
|
||||
"/auth/$account/backup"
|
||||
]
|
||||
"/new": {
|
||||
"filePath": "new.lazy.tsx"
|
||||
},
|
||||
"/landing": {
|
||||
"filePath": "landing.lazy.tsx"
|
||||
"/$account/backup": {
|
||||
"filePath": "$account/backup.tsx",
|
||||
"parent": "/$account"
|
||||
},
|
||||
"/$account/home": {
|
||||
"filePath": "$account/home.tsx"
|
||||
},
|
||||
"/$account/panel": {
|
||||
"filePath": "$account/panel.tsx"
|
||||
},
|
||||
"/auth/create-profile": {
|
||||
"filePath": "auth/create-profile.tsx",
|
||||
"parent": "/auth"
|
||||
"filePath": "$account/home.tsx",
|
||||
"parent": "/$account"
|
||||
},
|
||||
"/create-newsfeed/f2f": {
|
||||
"filePath": "create-newsfeed.f2f.tsx",
|
||||
@ -751,29 +732,27 @@ export const routeTree = rootRoute.addChildren({
|
||||
"filePath": "trending.users.tsx",
|
||||
"parent": "/trending"
|
||||
},
|
||||
"/users/$pubkey": {
|
||||
"filePath": "users/$pubkey.tsx"
|
||||
"/users/$id": {
|
||||
"filePath": "users.$id.tsx"
|
||||
},
|
||||
"/zap/$id": {
|
||||
"filePath": "zap.$id.tsx"
|
||||
},
|
||||
"/$account/panel": {
|
||||
"filePath": "$account/panel.lazy.tsx",
|
||||
"parent": "/$account"
|
||||
},
|
||||
"/auth/connect": {
|
||||
"filePath": "auth/connect.lazy.tsx"
|
||||
},
|
||||
"/auth/import": {
|
||||
"filePath": "auth/import.lazy.tsx",
|
||||
"parent": "/auth"
|
||||
"filePath": "auth/import.lazy.tsx"
|
||||
},
|
||||
"/auth/remote": {
|
||||
"filePath": "auth/remote.lazy.tsx",
|
||||
"parent": "/auth"
|
||||
},
|
||||
"/$account/": {
|
||||
"filePath": "$account/index.tsx"
|
||||
"/auth/new": {
|
||||
"filePath": "auth/new.lazy.tsx"
|
||||
},
|
||||
"/editor/": {
|
||||
"filePath": "editor/index.tsx"
|
||||
},
|
||||
"/auth/$account/backup": {
|
||||
"filePath": "auth/$account.backup.tsx",
|
||||
"parent": "/auth"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -13,7 +13,7 @@ import { getCurrentWindow } from "@tauri-apps/api/window";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { memo, useCallback, useState } from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/$account/")({
|
||||
export const Route = createLazyFileRoute("/$account")({
|
||||
component: Screen,
|
||||
});
|
||||
|
@ -1,7 +1,7 @@
|
||||
import { NostrAccount, NostrQuery } from "@/system";
|
||||
import { createFileRoute } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createFileRoute("/$account/")({
|
||||
export const Route = createFileRoute("/$account")({
|
||||
beforeLoad: async ({ params }) => {
|
||||
const settings = await NostrQuery.getUserSettings();
|
||||
const accounts = await NostrAccount.getAccounts();
|
@ -8,7 +8,7 @@ import { writeText } from "@tauri-apps/plugin-clipboard-manager";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState } from "react";
|
||||
|
||||
export const Route = createFileRoute("/auth/$account/backup")({
|
||||
export const Route = createFileRoute("/$account/backup")({
|
||||
component: Screen,
|
||||
});
|
||||
|
@ -1,16 +0,0 @@
|
||||
import { Container } from "@/components";
|
||||
import { Outlet, createLazyFileRoute } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createLazyFileRoute("/auth")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
return (
|
||||
<Container withDrag>
|
||||
<div className="max-w-sm mx-auto size-full">
|
||||
<Outlet />
|
||||
</div>
|
||||
</Container>
|
||||
);
|
||||
}
|
105
src/routes/auth/connect.lazy.tsx
Normal file
105
src/routes/auth/connect.lazy.tsx
Normal file
@ -0,0 +1,105 @@
|
||||
import { commands } from "@/commands.gen";
|
||||
import { Frame, GoBack, Spinner } from "@/components";
|
||||
import { createLazyFileRoute } from "@tanstack/react-router";
|
||||
import { readText } from "@tauri-apps/plugin-clipboard-manager";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState, useTransition } from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/auth/connect")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const navigate = Route.useNavigate();
|
||||
|
||||
const [uri, setUri] = useState("");
|
||||
const [isPending, startTransition] = useTransition();
|
||||
|
||||
const pasteFromClipboard = async () => {
|
||||
const val = await readText();
|
||||
setUri(val);
|
||||
};
|
||||
|
||||
const submit = () => {
|
||||
startTransition(async () => {
|
||||
if (!uri.startsWith("bunker://")) {
|
||||
await message(
|
||||
"You need to enter a valid Connect URI starts with bunker://",
|
||||
{ title: "Nostr Connect", kind: "info" },
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await commands.connectAccount(uri);
|
||||
|
||||
if (res.status === "ok") {
|
||||
navigate({ to: "/", replace: true });
|
||||
} else {
|
||||
await message(res.error, { title: "Nostr Connect", kind: "error" });
|
||||
return;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="size-full flex items-center justify-center"
|
||||
>
|
||||
<div className="w-[320px] flex flex-col gap-8">
|
||||
<div className="flex flex-col gap-1 text-center">
|
||||
<h1 className="leading-tight text-xl font-semibold">Nostr Connect</h1>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<Frame
|
||||
className="flex flex-col gap-1 p-3 rounded-xl overflow-hidden"
|
||||
shadow
|
||||
>
|
||||
<label
|
||||
htmlFor="uri"
|
||||
className="font-medium text-neutral-900 dark:text-neutral-100"
|
||||
>
|
||||
Connection String
|
||||
</label>
|
||||
<div className="relative">
|
||||
<input
|
||||
name="uri"
|
||||
type="text"
|
||||
placeholder="bunker://..."
|
||||
value={uri}
|
||||
onChange={(e) => setUri(e.target.value)}
|
||||
className="pl-3 pr-12 rounded-lg w-full h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => pasteFromClipboard()}
|
||||
className="absolute top-1/2 right-2 transform -translate-y-1/2 text-xs font-semibold text-blue-500"
|
||||
>
|
||||
Paste
|
||||
</button>
|
||||
</div>
|
||||
</Frame>
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => submit()}
|
||||
disabled={isPending}
|
||||
className="inline-flex items-center justify-center w-full h-9 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
{isPending ? <Spinner /> : "Continue"}
|
||||
</button>
|
||||
{isPending ? (
|
||||
<p className="mt-2 text-sm text-center text-neutral-600 dark:text-neutral-400">
|
||||
Waiting confirmation...
|
||||
</p>
|
||||
) : (
|
||||
<GoBack className="mt-2 w-full text-sm text-neutral-600 dark:text-neutral-400 inline-flex items-center justify-center">
|
||||
Go back to previous screen
|
||||
</GoBack>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -1,139 +0,0 @@
|
||||
import { Spinner } from "@/components";
|
||||
import { PlusIcon } from "@/components";
|
||||
import { AvatarUploader } from "@/components/avatarUploader";
|
||||
import { NostrAccount } from "@/system";
|
||||
import type { Metadata } from "@/types";
|
||||
import { createFileRoute, useNavigate } from "@tanstack/react-router";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState } from "react";
|
||||
import { useForm } from "react-hook-form";
|
||||
|
||||
export const Route = createFileRoute("/auth/create-profile")({
|
||||
loader: async () => {
|
||||
const account = await NostrAccount.createAccount();
|
||||
return account;
|
||||
},
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const account = Route.useLoaderData();
|
||||
const navigate = useNavigate();
|
||||
const { register, handleSubmit } = useForm();
|
||||
|
||||
const [picture, setPicture] = useState<string>("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const onSubmit = async (data: {
|
||||
name: string;
|
||||
about: string;
|
||||
website: string;
|
||||
}) => {
|
||||
setLoading(true);
|
||||
|
||||
try {
|
||||
// Save account keys
|
||||
const save = await NostrAccount.saveAccount(account.nsec);
|
||||
|
||||
// Then create profile
|
||||
if (save) {
|
||||
const profile: Metadata = { ...data, picture };
|
||||
const eventId = await NostrAccount.createProfile(profile);
|
||||
|
||||
if (eventId) {
|
||||
navigate({
|
||||
to: "/auth/$account/backup",
|
||||
params: { account: account.npub },
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
setLoading(false);
|
||||
await message(String(e), { title: "Create Profile", kind: "error" });
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center size-full gap-4">
|
||||
<div className="text-center">
|
||||
<h3 className="text-xl font-semibold">Let's set up your profile.</h3>
|
||||
</div>
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="w-full mb-0">
|
||||
<div className="flex flex-col gap-3 w-full p-3 overflow-hidden bg-white rounded-xl shadow-primary dark:bg-white/10 dark:ring-1 ring-white/15">
|
||||
<div className="self-center relative rounded-full size-20 bg-neutral-200 dark:bg-white/70 my-3">
|
||||
{picture ? (
|
||||
<img
|
||||
src={picture}
|
||||
alt="avatar"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
className="absolute inset-0 z-10 object-cover w-full h-full rounded-full"
|
||||
/>
|
||||
) : null}
|
||||
<AvatarUploader
|
||||
setPicture={setPicture}
|
||||
className="absolute inset-0 z-20 flex items-center justify-center w-full h-full text-white rounded-full dark:text-black bg-black/10 hover:bg-black/20 dark:bg-white/10 dark:hover:bg-white/20"
|
||||
>
|
||||
<PlusIcon className="size-8" />
|
||||
</AvatarUploader>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label htmlFor="display_name" className="font-medium">
|
||||
Display Name *
|
||||
</label>
|
||||
<input
|
||||
type={"text"}
|
||||
{...register("display_name", { required: true, minLength: 1 })}
|
||||
placeholder="e.g. Alice in Nostrland"
|
||||
spellCheck={false}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label htmlFor="name" className="font-medium">
|
||||
Name
|
||||
</label>
|
||||
<input
|
||||
type={"text"}
|
||||
{...register("name")}
|
||||
placeholder="e.g. alice"
|
||||
spellCheck={false}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label htmlFor="about" className="font-medium">
|
||||
Bio
|
||||
</label>
|
||||
<textarea
|
||||
{...register("about")}
|
||||
placeholder="e.g. Artist, anime-lover, and k-pop fan"
|
||||
spellCheck={false}
|
||||
className="relative h-24 w-full resize-none rounded-lg border-transparent bg-neutral-100 px-3 py-2 !outline-none placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label htmlFor="website" className="font-medium">
|
||||
Website
|
||||
</label>
|
||||
<input
|
||||
type="url"
|
||||
{...register("website")}
|
||||
placeholder="e.g. https://alice.me"
|
||||
spellCheck={false}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-500 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading}
|
||||
className="inline-flex items-center justify-center w-full h-9 mt-4 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
{loading ? <Spinner /> : "Continue"}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -1,8 +1,10 @@
|
||||
import { Spinner } from "@/components";
|
||||
import { NostrAccount } from "@/system";
|
||||
import { commands } from "@/commands.gen";
|
||||
import { Frame, GoBack } from "@/components";
|
||||
import { Spinner } from "@/components/spinner";
|
||||
import { createLazyFileRoute } from "@tanstack/react-router";
|
||||
import { readText } from "@tauri-apps/plugin-clipboard-manager";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState } from "react";
|
||||
import { useState, useTransition } from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/auth/import")({
|
||||
component: Screen,
|
||||
@ -13,77 +15,118 @@ function Screen() {
|
||||
|
||||
const [key, setKey] = useState("");
|
||||
const [password, setPassword] = useState("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [isPending, startTransition] = useTransition();
|
||||
|
||||
const submit = async () => {
|
||||
if (!key.startsWith("nsec1")) {
|
||||
return await message(
|
||||
"You need to enter a valid private key starts with nsec or ncryptsec",
|
||||
{ title: "Import Key", kind: "info" },
|
||||
);
|
||||
}
|
||||
const pasteFromClipboard = async () => {
|
||||
const val = await readText();
|
||||
setKey(val);
|
||||
};
|
||||
|
||||
try {
|
||||
setLoading(true);
|
||||
|
||||
const npub = await NostrAccount.saveAccount(key, password);
|
||||
|
||||
if (npub) {
|
||||
navigate({ to: "/", replace: true });
|
||||
const submit = () => {
|
||||
startTransition(async () => {
|
||||
if (!key.startsWith("nsec1") && !key.startsWith("ncryptsec")) {
|
||||
await message(
|
||||
"You need to enter a valid private key starts with nsec or ncryptsec",
|
||||
{ title: "Login", kind: "info" },
|
||||
);
|
||||
return;
|
||||
}
|
||||
} catch (e) {
|
||||
setLoading(false);
|
||||
await message(String(e), { title: "Import Key", kind: "error" });
|
||||
}
|
||||
|
||||
if (key.startsWith("nsec1") && !password.length) {
|
||||
await message("You must set password to secure your key", {
|
||||
title: "Login",
|
||||
kind: "info",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await commands.importAccount(key, password);
|
||||
|
||||
if (res.status === "ok") {
|
||||
navigate({ to: "/", replace: true });
|
||||
} else {
|
||||
await message(res.error, {
|
||||
title: "Import Private Ket",
|
||||
kind: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center size-full gap-4">
|
||||
<div className="text-center">
|
||||
<h3 className="text-xl font-semibold">Continue with Private Key</h3>
|
||||
</div>
|
||||
<div className="flex flex-col w-full">
|
||||
<div className="flex flex-col gap-3 w-full p-3 overflow-hidden bg-white rounded-xl shadow-primary dark:bg-white/10 dark:ring-1 ring-white/15">
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="key"
|
||||
className="font-medium text-neutral-900 dark:text-neutral-100"
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="size-full flex items-center justify-center"
|
||||
>
|
||||
<div className="w-[320px] flex flex-col gap-8">
|
||||
<div className="flex flex-col gap-1 text-center">
|
||||
<h1 className="leading-tight text-xl font-semibold">
|
||||
Import Private Key
|
||||
</h1>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<Frame
|
||||
className="flex flex-col gap-3 p-3 rounded-xl overflow-hidden"
|
||||
shadow
|
||||
>
|
||||
<div className="flex flex-col gap-1.5">
|
||||
<label
|
||||
htmlFor="key"
|
||||
className="text-sm font-medium text-neutral-800 dark:text-neutral-200"
|
||||
>
|
||||
Private Key
|
||||
</label>
|
||||
<div className="relative">
|
||||
<input
|
||||
name="key"
|
||||
type="password"
|
||||
placeholder="nsec or ncryptsec..."
|
||||
value={key}
|
||||
onChange={(e) => setKey(e.target.value)}
|
||||
className="pl-3 pr-12 rounded-lg w-full h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none placeholder:text-neutral-400 dark:placeholder:text-neutral-600"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => pasteFromClipboard()}
|
||||
className="absolute uppercase top-1/2 right-2 transform -translate-y-1/2 text-xs font-semibold text-blue-500"
|
||||
>
|
||||
Paste
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{key.length && !key.startsWith("ncryptsec") ? (
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="password"
|
||||
className="text-sm font-medium text-neutral-800 dark:text-neutral-200"
|
||||
>
|
||||
Set password to secure your key
|
||||
</label>
|
||||
<input
|
||||
name="password"
|
||||
type="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
className="px-3 rounded-lg h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
) : null}
|
||||
</Frame>
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => submit()}
|
||||
disabled={isPending}
|
||||
className="inline-flex items-center justify-center w-full h-9 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
Private Key
|
||||
</label>
|
||||
<input
|
||||
name="key"
|
||||
type="text"
|
||||
placeholder="nsec or ncryptsec..."
|
||||
value={key}
|
||||
onChange={(e) => setKey(e.target.value)}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="password"
|
||||
className="font-medium text-neutral-900 dark:text-neutral-100"
|
||||
>
|
||||
Password (Optional)
|
||||
</label>
|
||||
<input
|
||||
name="password"
|
||||
type="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
{isPending ? <Spinner /> : "Continue"}
|
||||
</button>
|
||||
<GoBack className="mt-2 w-full text-sm text-neutral-600 dark:text-neutral-400 inline-flex items-center justify-center">
|
||||
Go back to previous screen
|
||||
</GoBack>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => submit()}
|
||||
disabled={loading}
|
||||
className="inline-flex items-center justify-center w-full h-9 mt-4 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
{loading ? <Spinner /> : "Login"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
166
src/routes/auth/new.lazy.tsx
Normal file
166
src/routes/auth/new.lazy.tsx
Normal file
@ -0,0 +1,166 @@
|
||||
import { commands } from "@/commands.gen";
|
||||
import { Frame, GoBack, Spinner } from "@/components";
|
||||
import { NostrQuery } from "@/system";
|
||||
import { Plus } from "@phosphor-icons/react";
|
||||
import { createLazyFileRoute } from "@tanstack/react-router";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState, useTransition } from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/auth/new")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const navigate = Route.useNavigate();
|
||||
|
||||
const [password, setPassword] = useState("");
|
||||
const [picture, setPicture] = useState<string>("");
|
||||
const [name, setName] = useState("");
|
||||
const [about, setAbout] = useState("");
|
||||
const [isPending, startTransition] = useTransition();
|
||||
|
||||
const uploadAvatar = async () => {
|
||||
const file = await NostrQuery.upload();
|
||||
|
||||
if (file) {
|
||||
setPicture(file);
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
const submit = () => {
|
||||
startTransition(async () => {
|
||||
if (!name.length) {
|
||||
await message("Please add your name", {
|
||||
title: "New Identity",
|
||||
kind: "info",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!password.length) {
|
||||
await message("You must set password to secure your account", {
|
||||
title: "New Identity",
|
||||
kind: "info",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await commands.createAccount(name, picture, about, password);
|
||||
|
||||
if (res.status === "ok") {
|
||||
navigate({
|
||||
to: "/",
|
||||
replace: true,
|
||||
});
|
||||
} else {
|
||||
await message(res.error, {
|
||||
title: "New Identity",
|
||||
kind: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="size-full flex items-center justify-center"
|
||||
>
|
||||
<div className="w-[320px] flex flex-col gap-8">
|
||||
<div className="flex flex-col gap-1 text-center">
|
||||
<h1 className="leading-tight text-xl font-semibold">New Identity</h1>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<Frame
|
||||
className="flex flex-col gap-3 p-3 rounded-xl overflow-hidden"
|
||||
shadow
|
||||
>
|
||||
<div className="self-center relative rounded-full size-20 bg-neutral-100 dark:bg-neutral-900 my-3">
|
||||
{picture.length ? (
|
||||
<img
|
||||
src={picture}
|
||||
alt="avatar"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
className="absolute inset-0 z-10 object-cover w-full h-full rounded-full"
|
||||
/>
|
||||
) : null}
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => uploadAvatar()}
|
||||
className="absolute inset-0 z-20 flex items-center justify-center w-full h-full rounded-full bg-black/10 hover:bg-black/20 dark:bg-white/10 dark:hover:bg-white/20"
|
||||
>
|
||||
<Plus className="size-5" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="name"
|
||||
className="text-sm font-medium text-neutral-800 dark:text-neutral-200"
|
||||
>
|
||||
Name *
|
||||
</label>
|
||||
<input
|
||||
name="name"
|
||||
type="text"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
placeholder="e.g. Alice"
|
||||
spellCheck={false}
|
||||
className="px-3 rounded-lg h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none placeholder:text-neutral-400 dark:text-neutral-600"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="about"
|
||||
className="text-sm font-medium text-neutral-800 dark:text-neutral-200"
|
||||
>
|
||||
About
|
||||
</label>
|
||||
<textarea
|
||||
name="about"
|
||||
value={about}
|
||||
onChange={(e) => setAbout(e.target.value)}
|
||||
placeholder="e.g. Artist, anime-lover, and k-pop fan"
|
||||
spellCheck={false}
|
||||
className="px-3 py-1.5 rounded-lg min-h-16 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none placeholder:text-neutral-400 dark:text-neutral-600"
|
||||
/>
|
||||
</div>
|
||||
<div className="h-px w-full mt-2 bg-neutral-100 dark:bg-neutral-900" />
|
||||
<div className="flex flex-col gap-1">
|
||||
<label
|
||||
htmlFor="password"
|
||||
className="text-sm font-medium text-neutral-800 dark:text-neutral-200"
|
||||
>
|
||||
Set password to secure your account *
|
||||
</label>
|
||||
<input
|
||||
name="password"
|
||||
type="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
className="px-3 rounded-lg h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none placeholder:text-neutral-400 dark:text-neutral-600"
|
||||
/>
|
||||
</div>
|
||||
</Frame>
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => submit()}
|
||||
disabled={isPending}
|
||||
className="inline-flex items-center justify-center w-full h-9 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
{isPending ? <Spinner /> : "Continue"}
|
||||
</button>
|
||||
<GoBack className="mt-2 w-full text-sm text-neutral-600 dark:text-neutral-400 inline-flex items-center justify-center">
|
||||
Go back to previous screen
|
||||
</GoBack>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -1,79 +0,0 @@
|
||||
import { Spinner } from "@/components";
|
||||
import { NostrAccount } from "@/system";
|
||||
import { createLazyFileRoute } from "@tanstack/react-router";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState } from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/auth/remote")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const navigate = Route.useNavigate();
|
||||
|
||||
const [uri, setUri] = useState("");
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const submit = async () => {
|
||||
if (!uri.startsWith("bunker://")) {
|
||||
return await message(
|
||||
"You need to enter a valid Connect URI starts with bunker://",
|
||||
{ title: "Nostr Connect", kind: "info" },
|
||||
);
|
||||
}
|
||||
|
||||
try {
|
||||
setLoading(true);
|
||||
|
||||
const remoteAccount = await NostrAccount.connectRemoteAccount(uri);
|
||||
|
||||
if (remoteAccount?.length) {
|
||||
navigate({ to: "/", replace: true });
|
||||
}
|
||||
} catch (e) {
|
||||
setLoading(false);
|
||||
await message(String(e), { title: "Nostr Connect", kind: "error" });
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center size-full gap-4">
|
||||
<div className="text-center">
|
||||
<h3 className="text-xl font-semibold">Continue with Nostr Connect</h3>
|
||||
</div>
|
||||
<div className="flex flex-col w-full">
|
||||
<div className="flex flex-col gap-1 w-full p-3 overflow-hidden bg-white rounded-xl shadow-primary dark:bg-white/10 dark:ring-1 ring-white/15">
|
||||
<label
|
||||
htmlFor="uri"
|
||||
className="font-medium text-neutral-900 dark:text-neutral-100"
|
||||
>
|
||||
Connect URI
|
||||
</label>
|
||||
<input
|
||||
name="uri"
|
||||
type="text"
|
||||
placeholder="bunker://..."
|
||||
value={uri}
|
||||
onChange={(e) => setUri(e.target.value)}
|
||||
className="px-3 border-transparent rounded-lg h-11 bg-neutral-100 placeholder:text-neutral-600 focus:border-blue-500 focus:ring-0 dark:bg-white/10 dark:placeholder:text-neutral-400"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => submit()}
|
||||
disabled={loading}
|
||||
className="inline-flex items-center justify-center w-full h-9 mt-4 text-sm font-semibold text-white bg-blue-500 rounded-lg shrink-0 hover:bg-blue-600 disabled:opacity-50"
|
||||
>
|
||||
{loading ? <Spinner /> : "Login"}
|
||||
</button>
|
||||
{loading ? (
|
||||
<p className="text-sm text-center text-neutral-600 dark:text-neutral-400">
|
||||
Waiting confirmation...
|
||||
</p>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
211
src/routes/index.lazy.tsx
Normal file
211
src/routes/index.lazy.tsx
Normal file
@ -0,0 +1,211 @@
|
||||
import { commands } from "@/commands.gen";
|
||||
import { displayNpub } from "@/commons";
|
||||
import { Frame, Spinner, User } from "@/components";
|
||||
import { ArrowRight, DotsThree, GearSix, Plus } from "@phosphor-icons/react";
|
||||
import { Link, createLazyFileRoute } from "@tanstack/react-router";
|
||||
import { Menu, MenuItem } from "@tauri-apps/api/menu";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useState,
|
||||
useTransition,
|
||||
} from "react";
|
||||
|
||||
export const Route = createLazyFileRoute("/")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const context = Route.useRouteContext();
|
||||
const navigate = Route.useNavigate();
|
||||
|
||||
const currentDate = useMemo(
|
||||
() =>
|
||||
new Date().toLocaleString("default", {
|
||||
weekday: "long",
|
||||
month: "long",
|
||||
day: "numeric",
|
||||
}),
|
||||
[],
|
||||
);
|
||||
|
||||
const [accounts, setAccounts] = useState([]);
|
||||
const [value, setValue] = useState("");
|
||||
const [autoLogin, setAutoLogin] = useState(false);
|
||||
const [password, setPassword] = useState("");
|
||||
const [isPending, startTransition] = useTransition();
|
||||
|
||||
const deleteAccount = async (account: string) => {
|
||||
const res = await commands.deleteAccount(account);
|
||||
|
||||
if (res.status === "ok") {
|
||||
setAccounts((prev) => prev.filter((item) => item !== account));
|
||||
}
|
||||
};
|
||||
|
||||
const selectAccount = (account: string) => {
|
||||
setValue(account);
|
||||
|
||||
if (account.includes("_nostrconnect")) {
|
||||
setAutoLogin(true);
|
||||
}
|
||||
};
|
||||
|
||||
const loginWith = () => {
|
||||
startTransition(async () => {
|
||||
const res = await commands.login(value, password);
|
||||
|
||||
if (res.status === "ok") {
|
||||
navigate({
|
||||
to: "/$account/home",
|
||||
params: { account: res.data },
|
||||
replace: true,
|
||||
});
|
||||
} else {
|
||||
await message(res.error, { title: "Login", kind: "error" });
|
||||
return;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const showContextMenu = useCallback(
|
||||
async (e: React.MouseEvent, account: string) => {
|
||||
e.stopPropagation();
|
||||
|
||||
const menuItems = await Promise.all([
|
||||
MenuItem.new({
|
||||
text: "Delete account",
|
||||
action: async () => await deleteAccount(account),
|
||||
}),
|
||||
]);
|
||||
|
||||
const menu = await Menu.new({
|
||||
items: menuItems,
|
||||
});
|
||||
|
||||
await menu.popup().catch((e) => console.error(e));
|
||||
},
|
||||
[],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (autoLogin) {
|
||||
loginWith();
|
||||
}
|
||||
}, [autoLogin, value]);
|
||||
|
||||
useEffect(() => {
|
||||
setAccounts(context.accounts);
|
||||
}, [context.accounts]);
|
||||
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="relative size-full flex items-center justify-center"
|
||||
>
|
||||
<div className="w-[320px] flex flex-col gap-8">
|
||||
<div className="flex flex-col gap-1 text-center">
|
||||
<h3 className="leading-tight text-neutral-700 dark:text-neutral-300">
|
||||
{currentDate}
|
||||
</h3>
|
||||
<h1 className="leading-tight text-xl font-semibold">Welcome back!</h1>
|
||||
</div>
|
||||
<Frame
|
||||
className="flex flex-col w-full divide-y divide-neutral-100 dark:divide-white/5 rounded-xl overflow-hidden"
|
||||
shadow
|
||||
>
|
||||
{accounts.map((account) => (
|
||||
<div
|
||||
key={account}
|
||||
onClick={() => selectAccount(account)}
|
||||
onKeyDown={() => selectAccount(account)}
|
||||
className="group flex items-center gap-2 hover:bg-black/5 dark:hover:bg-white/5 p-3"
|
||||
>
|
||||
<User.Provider pubkey={account.replace("_nostrconnect", "")}>
|
||||
<User.Root className="flex-1 flex items-center gap-2.5">
|
||||
<User.Avatar className="rounded-full size-10" />
|
||||
{value === account && !value.includes("_nostrconnect") ? (
|
||||
<div className="flex-1 flex items-center gap-2">
|
||||
<input
|
||||
name="password"
|
||||
type="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") loginWith();
|
||||
}}
|
||||
placeholder="Password"
|
||||
className="px-3 rounded-full w-full h-10 bg-transparent border border-neutral-200 dark:border-neutral-500 focus:border-blue-500 focus:outline-none placeholder:text-neutral-400 dark:placeholder:text-neutral-600"
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className="inline-flex flex-col items-start">
|
||||
<div className="inline-flex items-center gap-1.5">
|
||||
<User.Name className="max-w-[6rem] truncate font-medium leading-tight" />
|
||||
{account.includes("_nostrconnect") ? (
|
||||
<div className="text-[8px] border border-blue-500 text-blue-500 px-1.5 rounded-full">
|
||||
Nostr Connect
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
<span className="text-sm text-neutral-700 dark:text-neutral-300">
|
||||
{displayNpub(account.replace("_nostrconnect", ""), 16)}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</User.Root>
|
||||
</User.Provider>
|
||||
<div className="inline-flex items-center justify-center size-8 shrink-0">
|
||||
{value === account ? (
|
||||
isPending ? (
|
||||
<Spinner />
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => loginWith()}
|
||||
className="rounded-full size-10 inline-flex items-center justify-center"
|
||||
>
|
||||
<ArrowRight className="size-5" />
|
||||
</button>
|
||||
)
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
onClick={(e) => showContextMenu(e, account)}
|
||||
className="rounded-full size-10 hidden group-hover:inline-flex items-center justify-center"
|
||||
>
|
||||
<DotsThree className="size-5" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
<Link
|
||||
to="/new"
|
||||
className="flex items-center justify-between hover:bg-black/5 dark:hover:bg-white/5"
|
||||
>
|
||||
<div className="flex items-center gap-2.5 p-3">
|
||||
<div className="inline-flex items-center justify-center rounded-full size-10 bg-neutral-200 dark:bg-white/10">
|
||||
<Plus className="size-5" />
|
||||
</div>
|
||||
<span className="truncate text-sm font-medium leading-tight">
|
||||
New account
|
||||
</span>
|
||||
</div>
|
||||
</Link>
|
||||
</Frame>
|
||||
</div>
|
||||
<div className="absolute bottom-2 right-2">
|
||||
<Link
|
||||
to="/bootstrap-relays"
|
||||
className="h-8 w-max text-xs px-3 inline-flex items-center justify-center gap-1.5 bg-black/5 hover:bg-black/10 dark:bg-white/5 dark:hover:bg-white/10 rounded-full"
|
||||
>
|
||||
<GearSix className="size-4" />
|
||||
Manage Relays
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -1,140 +1,22 @@
|
||||
import { checkForAppUpdates, displayNpub } from "@/commons";
|
||||
import { Spinner } from "@/components";
|
||||
import { PlusIcon, RelayIcon } from "@/components";
|
||||
import { User } from "@/components/user";
|
||||
import { checkForAppUpdates } from "@/commons";
|
||||
import { NostrAccount } from "@/system";
|
||||
import { Link } from "@tanstack/react-router";
|
||||
import { createFileRoute, redirect } from "@tanstack/react-router";
|
||||
import { message } from "@tauri-apps/plugin-dialog";
|
||||
import { useState } from "react";
|
||||
|
||||
export const Route = createFileRoute("/")({
|
||||
beforeLoad: async () => {
|
||||
// Check for app updates
|
||||
// TODO: move this function to rust
|
||||
await checkForAppUpdates(true);
|
||||
|
||||
// Get all accounts
|
||||
// TODO: use emit & listen
|
||||
const accounts = await NostrAccount.getAccounts();
|
||||
|
||||
if (accounts.length < 1) {
|
||||
throw redirect({
|
||||
to: "/landing",
|
||||
to: "/new",
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
|
||||
return { accounts };
|
||||
},
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const navigate = Route.useNavigate();
|
||||
const context = Route.useRouteContext();
|
||||
|
||||
const [loading, setLoading] = useState({ npub: "", status: false });
|
||||
|
||||
const select = async (npub: string) => {
|
||||
try {
|
||||
setLoading({ npub, status: true });
|
||||
|
||||
const status = await NostrAccount.loadAccount(npub);
|
||||
|
||||
if (status) {
|
||||
return navigate({
|
||||
to: "/$account/home",
|
||||
params: { account: npub },
|
||||
replace: true,
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
setLoading({ npub: "", status: false });
|
||||
await message(String(e), {
|
||||
title: "Account",
|
||||
kind: "error",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const currentDate = new Date().toLocaleString("default", {
|
||||
weekday: "long",
|
||||
month: "long",
|
||||
day: "numeric",
|
||||
});
|
||||
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="relative flex flex-col items-center justify-between w-full h-full"
|
||||
>
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="absolute top-0 left-0 h-14 w-full"
|
||||
/>
|
||||
<div className="flex items-end justify-center flex-1 w-full px-4 pb-10">
|
||||
<div className="text-center">
|
||||
<h2 className="mb-1 text-lg text-neutral-700 dark:text-neutral-300">
|
||||
{currentDate}
|
||||
</h2>
|
||||
<h2 className="text-2xl font-semibold">Welcome back!</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col items-center flex-1 w-full gap-3">
|
||||
<div className="flex flex-col w-full max-w-sm mx-auto overflow-hidden bg-white divide-y divide-neutral-100 dark:divide-white/5 rounded-xl shadow-primary dark:bg-white/10 dark:ring-1 ring-white/15">
|
||||
{context.accounts.map((account) => (
|
||||
<div
|
||||
key={account}
|
||||
onClick={() => select(account)}
|
||||
onKeyDown={() => select(account)}
|
||||
className="flex items-center justify-between hover:bg-black/5 dark:hover:bg-white/5"
|
||||
>
|
||||
<User.Provider pubkey={account}>
|
||||
<User.Root className="flex items-center gap-2.5 p-3">
|
||||
<User.Avatar className="rounded-full size-10" />
|
||||
<div className="inline-flex flex-col items-start">
|
||||
<User.Name className="max-w-[6rem] truncate font-medium leading-tight" />
|
||||
<span className="text-sm text-neutral-700 dark:text-neutral-300">
|
||||
{displayNpub(account, 16)}
|
||||
</span>
|
||||
</div>
|
||||
</User.Root>
|
||||
</User.Provider>
|
||||
<div className="inline-flex items-center justify-center size-10">
|
||||
{loading.npub === account ? (
|
||||
loading.status ? (
|
||||
<Spinner />
|
||||
) : null
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
<Link
|
||||
to="/landing"
|
||||
className="flex items-center justify-between hover:bg-black/5 dark:hover:bg-white/5"
|
||||
>
|
||||
<div className="flex items-center gap-2.5 p-3">
|
||||
<div className="inline-flex items-center justify-center rounded-full size-10 bg-neutral-200 dark:bg-white/10">
|
||||
<PlusIcon className="size-5" />
|
||||
</div>
|
||||
<span className="max-w-[6rem] truncate text-sm font-medium leading-tight">
|
||||
Add account
|
||||
</span>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="w-full max-w-sm mx-auto">
|
||||
<Link
|
||||
to="/bootstrap-relays"
|
||||
className="inline-flex items-center justify-center w-full h-8 gap-2 px-2 text-xs font-medium rounded-lg bg-black/5 dark:bg-white/5 hover:bg-black/10 dark:hover:bg-white/10 text-neutral-700 dark:text-white/40"
|
||||
>
|
||||
<RelayIcon className="size-4" />
|
||||
Custom Bootstrap Relays
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-1" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,62 +0,0 @@
|
||||
import { KeyIcon, RemoteIcon } from "@/components";
|
||||
import { Link, createLazyFileRoute } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createLazyFileRoute("/landing")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="flex flex-col items-center justify-center w-screen h-screen"
|
||||
>
|
||||
<div className="w-full max-w-xs mx-auto lg:max-w-md">
|
||||
<div className="flex flex-col w-full gap-2 px-2 bg-white rounded-xl shadow-primary dark:bg-white/20 dark:ring-1 ring-neutral-800/50">
|
||||
<div className="flex items-center h-20 border-b border-neutral-100 dark:border-white/5">
|
||||
<Link
|
||||
to="/auth/create-profile"
|
||||
className="flex items-center justify-center w-full gap-2 px-2 rounded-lg h-14 hover:bg-neutral-100 dark:hover:bg-white/10"
|
||||
>
|
||||
<div className="inline-flex items-center justify-center rounded-full size-9 shrink-0">
|
||||
<img
|
||||
src="/icon.jpeg"
|
||||
alt="App Icon"
|
||||
className="object-cover rounded-full size-9"
|
||||
/>
|
||||
</div>
|
||||
<div className="inline-flex flex-col flex-1">
|
||||
<span className="font-semibold leading-tight">
|
||||
Create new account
|
||||
</span>
|
||||
<span className="text-sm leading-tight text-neutral-500">
|
||||
Use everywhere
|
||||
</span>
|
||||
</div>
|
||||
</Link>
|
||||
</div>
|
||||
<div className="flex flex-col gap-1 pb-2.5">
|
||||
<Link
|
||||
to="/auth/import"
|
||||
className="inline-flex items-center w-full gap-2 px-2 rounded-lg h-11 hover:bg-neutral-100 dark:hover:bg-white/10"
|
||||
>
|
||||
<div className="inline-flex items-center justify-center size-9">
|
||||
<KeyIcon className="size-5 text-neutral-600 dark:text-neutral-400" />
|
||||
</div>
|
||||
Login with Private Key
|
||||
</Link>
|
||||
<Link
|
||||
to="/auth/remote"
|
||||
className="inline-flex items-center w-full gap-2 px-2 rounded-lg h-11 hover:bg-neutral-100 dark:hover:bg-white/10"
|
||||
>
|
||||
<div className="inline-flex items-center justify-center size-9">
|
||||
<RemoteIcon className="size-5 text-neutral-600 dark:text-neutral-400" />
|
||||
</div>
|
||||
Nostr Connect
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
45
src/routes/new.lazy.tsx
Normal file
45
src/routes/new.lazy.tsx
Normal file
@ -0,0 +1,45 @@
|
||||
import { Link, createLazyFileRoute } from "@tanstack/react-router";
|
||||
|
||||
export const Route = createLazyFileRoute("/new")({
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
return (
|
||||
<div
|
||||
data-tauri-drag-region
|
||||
className="size-full flex items-center justify-center"
|
||||
>
|
||||
<div className="w-[320px] flex flex-col gap-8">
|
||||
<div className="flex flex-col gap-1 text-center">
|
||||
<h1 className="leading-tight text-xl font-semibold">
|
||||
Welcome to Nostr.
|
||||
</h1>
|
||||
</div>
|
||||
<div className="flex flex-col gap-4">
|
||||
<Link
|
||||
to="/auth/new"
|
||||
className="w-full h-10 bg-blue-500 font-medium hover:bg-blue-600 text-white rounded-lg inline-flex items-center justify-center shadow"
|
||||
>
|
||||
Create a new identity
|
||||
</Link>
|
||||
<div className="w-full h-px bg-black/5 dark:bg-white/5" />
|
||||
<div className="flex flex-col gap-2">
|
||||
<Link
|
||||
to="/auth/connect"
|
||||
className="w-full h-10 bg-white hover:bg-neutral-100 dark:hover:bg-neutral-100 dark:bg-white dark:text-black rounded-lg inline-flex items-center justify-center"
|
||||
>
|
||||
Login with Nostr Connect
|
||||
</Link>
|
||||
<Link
|
||||
to="/auth/import"
|
||||
className="w-full h-10 bg-white hover:bg-neutral-100 dark:hover:bg-neutral-100 dark:bg-white dark:text-black rounded-lg inline-flex items-center justify-center"
|
||||
>
|
||||
Login with Private Key
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -11,19 +11,19 @@ import { Await } from "@tanstack/react-router";
|
||||
import { Suspense, useCallback } from "react";
|
||||
import { WindowVirtualizer } from "virtua";
|
||||
|
||||
export const Route = createFileRoute("/users/$pubkey")({
|
||||
export const Route = createFileRoute("/users/$id")({
|
||||
beforeLoad: async () => {
|
||||
const settings = await NostrQuery.getUserSettings();
|
||||
return { settings };
|
||||
},
|
||||
loader: async ({ params }) => {
|
||||
return { data: defer(NostrQuery.getUserEvents(params.pubkey)) };
|
||||
return { data: defer(NostrQuery.getUserEvents(params.id)) };
|
||||
},
|
||||
component: Screen,
|
||||
});
|
||||
|
||||
function Screen() {
|
||||
const { pubkey } = Route.useParams();
|
||||
const { id } = Route.useParams();
|
||||
const { data } = Route.useLoaderData();
|
||||
|
||||
const renderItem = useCallback(
|
||||
@ -52,7 +52,7 @@ function Screen() {
|
||||
<Container withDrag>
|
||||
<Box className="px-0 scrollbar-none bg-black/5 dark:bg-white/5">
|
||||
<WindowVirtualizer>
|
||||
<User.Provider pubkey={pubkey}>
|
||||
<User.Provider pubkey={id}>
|
||||
<User.Root>
|
||||
<User.Cover className="object-cover w-full h-44" />
|
||||
<div className="relative flex flex-col px-3 -mt-8">
|
@ -1,14 +1,11 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
|
||||
import harmonyPalette from "@evilmartians/harmony/tailwind";
|
||||
|
||||
export default {
|
||||
content: [
|
||||
"./src/**/*.{js,ts,jsx,tsx}",
|
||||
"index.html",
|
||||
],
|
||||
theme: {
|
||||
colors: harmonyPalette,
|
||||
extend: {
|
||||
keyframes: {
|
||||
slideDownAndFade: {
|
||||
|
Loading…
Reference in New Issue
Block a user