-
+
diff --git a/packages/app/src/Pages/Notifications.tsx b/packages/app/src/Pages/Notifications.tsx
index 1bd77d0b..13633a57 100644
--- a/packages/app/src/Pages/Notifications.tsx
+++ b/packages/app/src/Pages/Notifications.tsx
@@ -86,7 +86,7 @@ export default function NotificationsPage() {
const timeGrouped = useMemo(() => {
return orderDescending([...notifications])
- .filter(a => !isMuted(a.pubkey))
+ .filter(a => !isMuted(a.pubkey) && findTag(a, "p") === login.publicKey)
.reduce((acc, v) => {
const key = `${timeKey(v)}:${notificationContext(v as TaggedRawEvent)?.encode()}:${v.kind}`;
if (acc.has(key)) {
diff --git a/packages/app/src/Pages/Root.tsx b/packages/app/src/Pages/Root.tsx
index 9fd13325..831fe3eb 100644
--- a/packages/app/src/Pages/Root.tsx
+++ b/packages/app/src/Pages/Root.tsx
@@ -333,11 +333,19 @@ export const RootRoutes = [
},
{
path: "trending/people",
- element: ,
+ element: (
+
+
+
+ ),
},
{
path: "suggested",
- element:
,
+ element: (
+
+
+
+ ),
},
{
path: "/t/:tag",
diff --git a/packages/app/src/Pages/SettingsPage.tsx b/packages/app/src/Pages/SettingsPage.tsx
index 0dbe3a2a..9a1f6069 100644
--- a/packages/app/src/Pages/SettingsPage.tsx
+++ b/packages/app/src/Pages/SettingsPage.tsx
@@ -29,31 +29,33 @@ export const SettingsRoutes: RouteObject[] = [
{
path: "",
element:
,
+ children: [
+ {
+ path: "profile",
+ element:
,
+ },
+ {
+ path: "relays",
+ element:
,
+ },
+ {
+ path: "relays/:id",
+ element:
,
+ },
+ {
+ path: "preferences",
+ element:
,
+ },
+ {
+ path: "accounts",
+ element:
,
+ },
+ {
+ path: "keys",
+ element:
,
+ },
+ ...ManageHandleRoutes,
+ ...WalletSettingsRoutes,
+ ],
},
- {
- path: "profile",
- element:
,
- },
- {
- path: "relays",
- element:
,
- },
- {
- path: "relays/:id",
- element:
,
- },
- {
- path: "preferences",
- element:
,
- },
- {
- path: "accounts",
- element:
,
- },
- {
- path: "keys",
- element:
,
- },
- ...ManageHandleRoutes,
- ...WalletSettingsRoutes,
];
diff --git a/packages/app/src/Pages/Verification.css b/packages/app/src/Pages/Verification.css
deleted file mode 100644
index 2e075c01..00000000
--- a/packages/app/src/Pages/Verification.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.verification a {
- color: var(--highlight);
-}
diff --git a/packages/app/src/Pages/WalletPage.tsx b/packages/app/src/Pages/WalletPage.tsx
index e6ca2f92..8364f95c 100644
--- a/packages/app/src/Pages/WalletPage.tsx
+++ b/packages/app/src/Pages/WalletPage.tsx
@@ -204,15 +204,11 @@ export default function WalletPage() {
}
return (
-
+
{error && {error}}
{walletList()}
{unlockWallet()}
{walletInfo()}
-
-
);
}
diff --git a/packages/app/src/Pages/ZapPool.css b/packages/app/src/Pages/ZapPool.css
index 611dfd07..124c0d6f 100644
--- a/packages/app/src/Pages/ZapPool.css
+++ b/packages/app/src/Pages/ZapPool.css
@@ -1,3 +1,7 @@
.zap-pool input[type="range"] {
width: 200px;
}
+
+.zap-pool h4 {
+ margin: 0;
+}
diff --git a/packages/app/src/Pages/ZapPool.tsx b/packages/app/src/Pages/ZapPool.tsx
index b600d1b8..53ae5fd1 100644
--- a/packages/app/src/Pages/ZapPool.tsx
+++ b/packages/app/src/Pages/ZapPool.tsx
@@ -92,7 +92,7 @@ export default function ZapPoolPage() {
const sumPending = zapPool.reduce((acc, v) => acc + v.sum, 0);
return (
-
+
@@ -150,7 +150,7 @@ export default function ZapPoolPage() {
)}
-
+
b.pubkey === bech32ToHex(SnortPubKey) && b.type === ZapPoolRecipientType.Generic) ?? {
@@ -166,7 +166,7 @@ export default function ZapPoolPage() {
{relayConnections.map(a => (
-
+
{getRelayName(a.address)}
{UploaderServices.map(a => (
-
+
{a.name}
{DataProviders.map(a => (
-
+
{a.name}
+
@@ -45,6 +45,9 @@ export default function DiscoverFollows() {
{sortedReccomends.length > 0 &&
}
+
+
+
);
diff --git a/packages/app/src/Pages/new/GetVerified.tsx b/packages/app/src/Pages/new/GetVerified.tsx
index e05812da..5f317bfc 100644
--- a/packages/app/src/Pages/new/GetVerified.tsx
+++ b/packages/app/src/Pages/new/GetVerified.tsx
@@ -4,7 +4,7 @@ import { useNavigate } from "react-router-dom";
import { useUserProfile } from "@snort/system-react";
import Logo from "Element/Logo";
-import { Nip5Services } from "Pages/Verification";
+import { Nip5Services } from "Pages/NostrAddressPage";
import Nip5Service from "Element/Nip5Service";
import ProfileImage from "Element/ProfileImage";
import useLogin from "Hooks/useLogin";
diff --git a/packages/app/src/Pages/new/NewUserFlow.tsx b/packages/app/src/Pages/new/NewUserFlow.tsx
index 07ad76c7..465a4d0a 100644
--- a/packages/app/src/Pages/new/NewUserFlow.tsx
+++ b/packages/app/src/Pages/new/NewUserFlow.tsx
@@ -90,7 +90,7 @@ export default function NewUserFlow() {
const navigate = useNavigate();
return (
-
+
@@ -98,31 +98,25 @@ export default function NewUserFlow() {
-
-
-
-
-
+
+
+
diff --git a/packages/app/src/Pages/new/ProfileSetup.tsx b/packages/app/src/Pages/new/ProfileSetup.tsx
index 0440efd8..5ff09f03 100644
--- a/packages/app/src/Pages/new/ProfileSetup.tsx
+++ b/packages/app/src/Pages/new/ProfileSetup.tsx
@@ -47,7 +47,7 @@ export default function ProfileSetup() {
};
return (
-
+
diff --git a/packages/app/src/Pages/settings/Keys.css b/packages/app/src/Pages/settings/Keys.css
index 49e8791e..5d5b7172 100644
--- a/packages/app/src/Pages/settings/Keys.css
+++ b/packages/app/src/Pages/settings/Keys.css
@@ -1,4 +1,4 @@
-.export-keys > .copy {
+.copy.dashed {
padding: 12px 16px;
border: 2px dashed #222222;
border-radius: 16px;
diff --git a/packages/app/src/Pages/settings/Keys.tsx b/packages/app/src/Pages/settings/Keys.tsx
index 00958e95..a678ffec 100644
--- a/packages/app/src/Pages/settings/Keys.tsx
+++ b/packages/app/src/Pages/settings/Keys.tsx
@@ -10,18 +10,18 @@ import { hexToBech32 } from "SnortUtils";
export default function ExportKeys() {
const { publicKey, privateKey, generatedEntropy } = useLogin();
return (
-
+
-
-
+
+
{privateKey && (
<>
-
+
>
)}
{generatedEntropy && (
@@ -29,7 +29,7 @@ export default function ExportKeys() {
-
+
>
)}
diff --git a/packages/app/src/Pages/settings/Preferences.css b/packages/app/src/Pages/settings/Preferences.css
index 0faaa21c..4c6af107 100644
--- a/packages/app/src/Pages/settings/Preferences.css
+++ b/packages/app/src/Pages/settings/Preferences.css
@@ -1,8 +1,14 @@
.preferences small {
- margin-top: 0.5em;
color: var(--font-secondary-color);
}
.preferences select {
min-width: 100px;
}
+
+.preferences h4 {
+ margin: 0;
+ font-size: 16px;
+ font-weight: 600;
+ line-height: 22px; /* 137.5% */
+}
diff --git a/packages/app/src/Pages/settings/Preferences.tsx b/packages/app/src/Pages/settings/Preferences.tsx
index 6ea3faa9..da9e61cc 100644
--- a/packages/app/src/Pages/settings/Preferences.tsx
+++ b/packages/app/src/Pages/settings/Preferences.tsx
@@ -32,6 +32,7 @@ export const AllLanguageCodes = [
const PreferencesPage = () => {
const { formatMessage } = useIntl();
const login = useLogin();
+ console.debug(login);
const perf = login.preferences;
const [emoji, setEmoji] = useState
>([]);
@@ -42,17 +43,15 @@ const PreferencesPage = () => {
}, []);
return (
-
+
-
-
+
-
-
+
-
-
+
-
-
-
+
+
+
-
+
-
+
-
-
-
+
+
+
-
+
@@ -175,12 +171,10 @@ const PreferencesPage = () => {
/>
-
-
+
-
-
-
+
+
+
-
+
@@ -207,12 +201,12 @@ const PreferencesPage = () => {
/>
-
-
-
-
+
+
+
+
-
+
@@ -231,7 +225,7 @@ const PreferencesPage = () => {
{perf.imgProxyConfig && (
-
+
@@ -307,11 +301,11 @@ const PreferencesPage = () => {
)}
-
-
-
+
+
+
-
+
@@ -324,43 +318,39 @@ const PreferencesPage = () => {
/>
-
-
-
-
-
-
-
-
-
-
+ );
+ })}
+
-
-
-
+
+
+
-
+
@@ -373,11 +363,11 @@ const PreferencesPage = () => {
/>
-
-
-
+
+
+
-
+
@@ -390,37 +380,33 @@ const PreferencesPage = () => {
/>
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
-
-
+
+
+
-
+
diff --git a/packages/app/src/Pages/settings/Profile.css b/packages/app/src/Pages/settings/Profile.css
index 5e86ff7f..e83c25f7 100644
--- a/packages/app/src/Pages/settings/Profile.css
+++ b/packages/app/src/Pages/settings/Profile.css
@@ -1,53 +1,51 @@
+.settings h4 {
+ font-size: 16px;
+ font-weight: 600;
+ margin: 0;
+}
+
.settings .avatar {
- width: 256px;
- height: 256px;
+ width: 64px;
+ height: 64px;
background-size: cover;
border-radius: 100%;
- cursor: pointer;
- margin-bottom: 20px;
}
.settings .banner {
- width: 300px;
- height: 150px;
+ width: 100%;
+ height: 100%;
background-size: cover;
- margin-bottom: 20px;
+ border-radius: 12px;
}
.settings .image-settings {
- display: block;
- align-items: center;
- justify-content: center;
-}
-
-.settings .image-setting {
- display: flex;
- justify-content: space-between;
-}
-
-.settings .image-setting > div:first-child {
- align-self: center;
-}
-
-.avatar .edit,
-.banner .edit {
- display: flex;
- align-items: center;
- justify-content: center;
+ position: relative;
width: 100%;
- height: 100%;
- background-color: var(--bg-color);
- cursor: pointer;
- opacity: 0;
- border-radius: 100%;
+ height: 145px;
+ margin-block-end: 45px;
}
-.avatar .edit.new {
- opacity: 0.5;
+.settings .image-settings > div {
+ position: absolute;
}
-.avatar .edit:hover {
- opacity: 0.5;
+.settings .image-settings .avatar-stack {
+ bottom: -32px;
+}
+
+.settings .image-settings .avatar-stack .btn-rnd {
+ position: absolute;
+ padding: 0;
+ width: 32px;
+ height: 32px;
+ right: -10px;
+ bottom: -10px;
+}
+
+.settings .image-settings .banner button {
+ right: 16px;
+ top: 12px;
+ position: absolute;
}
.settings .editor textarea {
@@ -59,3 +57,8 @@
.settings .actions {
margin-top: 16px;
}
+
+.settings small {
+ font-size: 14px;
+ color: var(--font-secondary-color);
+}
diff --git a/packages/app/src/Pages/settings/Profile.tsx b/packages/app/src/Pages/settings/Profile.tsx
index 0fcb459c..1edd3080 100644
--- a/packages/app/src/Pages/settings/Profile.tsx
+++ b/packages/app/src/Pages/settings/Profile.tsx
@@ -13,10 +13,8 @@ import useFileUpload from "Upload";
import AsyncButton from "Element/AsyncButton";
import { UserCache } from "Cache";
import useLogin from "Hooks/useLogin";
-import AvatarEditor from "Element/AvatarEditor";
import Icon from "Icons/Icon";
-
-import messages from "./messages";
+import Avatar from "Element/Avatar";
export interface ProfileSettingsProps {
avatar?: boolean;
@@ -31,7 +29,6 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
const uploader = useFileUpload();
const [name, setName] = useState
();
- const [displayName, setDisplayName] = useState();
const [picture, setPicture] = useState();
const [banner, setBanner] = useState();
const [about, setAbout] = useState();
@@ -39,12 +36,9 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
const [nip05, setNip05] = useState();
const [lud16, setLud16] = useState();
- const avatarPicture = (picture?.length ?? 0) === 0 ? Nostrich : picture;
-
useEffect(() => {
if (user) {
setName(user.name);
- setDisplayName(user.display_name);
setPicture(user.picture);
setBanner(user.banner);
setAbout(user.about);
@@ -59,7 +53,6 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
const userCopy = {
...user,
name,
- display_name: displayName,
about,
picture,
banner,
@@ -107,69 +100,62 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
}
}
+ async function setNewAvatar() {
+ const rsp = await uploadFile();
+ if (rsp) {
+ setPicture(rsp);
+ }
+ }
+
function editor() {
return (
-
-
-
- :
-
-
-
setName(e.target.value)} />
+
+
+
+
+
+ setName(e.target.value)} />
+
+
+
+
+
+
+
+
+
+
+
+ setWebsite(e.target.value)} />
+
+
+
+
+
+
+
setNip05(e.target.value)} />
+
+
+
+
+
+
+
-
-
- :
-
-
- setDisplayName(e.target.value)} />
-
-
-
-
-
- :
-
-
- setWebsite(e.target.value)} />
-
-
-
-
- :
-
-
- setNip05(e.target.value)} />
-
-
-
-
-
- :
-
-
- setLud16(e.target.value)} />
-
-
-
-
-
+
+
+
+
+ setLud16(e.target.value)} />
+
saveProfile()}>
+
+
);
}
@@ -179,28 +165,23 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
return (
<>
- {(props.avatar ?? true) && (
-
-
- :
-
-
setPicture(p)} />
+ {(props.banner ?? true) && (
+
)}
- {(props.banner ?? true) && (
-
-
- :
-
-
+ {(props.avatar ?? true) && (
+
)}
@@ -209,12 +190,5 @@ export default function ProfileSettings(props: ProfileSettingsProps) {
);
}
- return (
-
-
-
-
- {settings()}
-
- );
+ return {settings()}
;
}
diff --git a/packages/app/src/Pages/settings/RelayInfo.tsx b/packages/app/src/Pages/settings/RelayInfo.tsx
index cf292887..6c5bca22 100644
--- a/packages/app/src/Pages/settings/RelayInfo.tsx
+++ b/packages/app/src/Pages/settings/RelayInfo.tsx
@@ -22,7 +22,7 @@ const RelayInfo = () => {
navigate("/settings/relays")}>
-
+
{stats?.info?.name}
{stats?.info?.description}
diff --git a/packages/app/src/Pages/settings/Root.css b/packages/app/src/Pages/settings/Root.css
index abc47f67..b5d57ee6 100644
--- a/packages/app/src/Pages/settings/Root.css
+++ b/packages/app/src/Pages/settings/Root.css
@@ -1,19 +1,29 @@
+.settings-nav {
+ display: grid;
+ grid-template-columns: 237px auto;
+}
+
+.settings-nav > div {
+ border: 1px solid var(--gray-superdark);
+}
+
+.settings-nav > div:nth-child(2) {
+ padding: 12px 16px;
+}
+
.settings-nav .card {
cursor: pointer;
}
.settings-row {
display: grid;
- grid-template-columns: 22px 1fr 8px;
+ grid-template-columns: 24px 1fr 24px;
align-items: center;
- font-weight: 600;
- font-size: 16px;
- padding: 0.8em 1em;
- background: var(--note-bg);
- border-radius: 10px;
cursor: pointer;
- gap: 10px;
- margin-bottom: 5px;
+ padding: 12px 16px;
+ gap: 8px;
+ font-size: 16px;
+ font-weight: 600;
}
.settings-row.inner {
@@ -24,12 +34,12 @@
}
.settings-group-header {
- font-weight: 600;
+ align-items: center;
+ cursor: pointer;
+ padding: 12px 16px;
+ gap: 8px;
font-size: 16px;
- padding: 0.8em 1em;
- background-color: var(--note-bg);
- border-radius: 10px;
- margin-bottom: 5px;
+ font-weight: 600;
}
.settings-row:hover,
@@ -41,11 +51,6 @@
margin-left: auto;
}
-.settings-row svg {
- width: 100%;
- height: 100%;
-}
-
.settings-group-header .collapse-icon > svg {
width: 8px;
}
diff --git a/packages/app/src/Pages/settings/Root.tsx b/packages/app/src/Pages/settings/Root.tsx
index 1e3a7357..0eac3878 100644
--- a/packages/app/src/Pages/settings/Root.tsx
+++ b/packages/app/src/Pages/settings/Root.tsx
@@ -1,12 +1,11 @@
import "./Root.css";
import { FormattedMessage } from "react-intl";
-import { useNavigate } from "react-router-dom";
+import { Outlet, useNavigate } from "react-router-dom";
import Icon from "Icons/Icon";
import { LoginStore, logout } from "Login";
import useLogin from "Hooks/useLogin";
import { unwrap } from "SnortUtils";
import { getCurrentSubscription } from "Subscription";
-import { CollapsedSection } from "Element/Collapsed";
import messages from "./messages";
@@ -21,80 +20,72 @@ const SettingsIndex = () => {
}
return (
- <>
-
-
-
-
-
- }
- className="settings-group-header">
-
-
navigate("profile")}>
-
-
-
-
-
navigate("relays")}>
-
-
-
-
-
navigate("keys")}>
-
-
-
-
-
navigate("handle")}>
-
-
-
-
-
navigate("/subscribe/manage")}>
-
-
-
-
- {sub && (
-
navigate("accounts")}>
-
-
-
-
- )}
+
+
+
navigate("profile")}>
+
+
+
+
+
navigate("relays")}>
+
+
+
+
+
navigate("keys")}>
+
+
+
+
+
navigate("handle")}>
+
+
+
+
+
navigate("/subscribe/manage")}>
+
+
+
+
+ {sub && (
+
navigate("accounts")}>
+
+
+
-
+ )}
navigate("preferences")}>
-
+
-
+
navigate("wallet")}>
-
+
-
+
navigate("/donate")}>
-
+
-
+
navigate("/zap-pool")}>
-
+
-
+
-
+
-
+
- >
+
+
+
+
);
};
diff --git a/packages/app/src/Pages/settings/WalletSettings.css b/packages/app/src/Pages/settings/WalletSettings.css
index d24cef79..4d2f85b9 100644
--- a/packages/app/src/Pages/settings/WalletSettings.css
+++ b/packages/app/src/Pages/settings/WalletSettings.css
@@ -5,10 +5,10 @@
grid-gap: 10px;
}
-.wallet-grid .card {
+.wallet-grid > div {
cursor: pointer;
display: flex;
flex-direction: column;
- justify-content: flex-end;
align-items: center;
+ justify-content: space-between;
}
diff --git a/packages/app/src/Pages/settings/WalletSettings.tsx b/packages/app/src/Pages/settings/WalletSettings.tsx
index 818d5020..26540973 100644
--- a/packages/app/src/Pages/settings/WalletSettings.tsx
+++ b/packages/app/src/Pages/settings/WalletSettings.tsx
@@ -1,7 +1,7 @@
import "./WalletSettings.css";
import LndLogo from "lnd-logo.png";
import { FormattedMessage } from "react-intl";
-import { RouteObject, useNavigate } from "react-router-dom";
+import { Link, RouteObject, useNavigate } from "react-router-dom";
import BlueWallet from "Icons/BlueWallet";
import ConnectLNC from "Pages/settings/wallet/LNC";
@@ -15,21 +15,26 @@ const WalletSettings = () => {
const navigate = useNavigate();
return (
<>
+
+
+
-
navigate("/settings/wallet/lnc")}>
+
navigate("/settings/wallet/lnc")}>
-
LND with LNC
+
LND with LNC
-
navigate("/settings/wallet/lndhub")}>
+
navigate("/settings/wallet/lndhub")}>
-
LNDHub
+ LNDHub
-
navigate("/settings/wallet/nwc")}>
+
navigate("/settings/wallet/nwc")}>
-
Nostr Wallet Connect
+ Nostr Wallet Connect
>
diff --git a/packages/app/src/Pages/settings/handle/LNAddress.tsx b/packages/app/src/Pages/settings/handle/LNAddress.tsx
index 0adea2f4..562dc571 100644
--- a/packages/app/src/Pages/settings/handle/LNAddress.tsx
+++ b/packages/app/src/Pages/settings/handle/LNAddress.tsx
@@ -42,7 +42,7 @@ export default function LNForwardAddress({ handle }: { handle: ManageHandle }) {
}
return (
-
+
diff --git a/packages/app/src/Pages/settings/handle/ListHandles.tsx b/packages/app/src/Pages/settings/handle/ListHandles.tsx
index c7f37b90..b209710a 100644
--- a/packages/app/src/Pages/settings/handle/ListHandles.tsx
+++ b/packages/app/src/Pages/settings/handle/ListHandles.tsx
@@ -29,37 +29,33 @@ export default function ListHandles() {
defaultMessage="It looks like you dont have any, check {link} to buy one!"
values={{
link: (
-
-
+
+
),
}}
/>
)}
{handles.map(a => (
-
-
-
- {a.handle}@
-
- {a.domain}
-
-
-
-
-
-
+
+
+ {a.handle}@
+
+ {a.domain}
+
+
+
))}
{handles.length > 0 && (
-