update trending profile ui

This commit is contained in:
Ren Amamiya
2023-07-03 17:16:54 +07:00
parent 10c27fd627
commit 1b8eaa2988
6 changed files with 112 additions and 53 deletions

84
pnpm-lock.yaml generated
View File

@@ -389,13 +389,13 @@ packages:
requiresBuild: true requiresBuild: true
optional: true optional: true
/@eslint-community/eslint-utils@4.4.0(eslint@8.43.0): /@eslint-community/eslint-utils@4.4.0(eslint@8.44.0):
resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==} resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies: peerDependencies:
eslint: ^6.0.0 || ^7.0.0 || >=8.0.0 eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
dependencies: dependencies:
eslint: 8.43.0 eslint: 8.44.0
eslint-visitor-keys: 3.4.1 eslint-visitor-keys: 3.4.1
dev: false dev: false
@@ -404,13 +404,13 @@ packages:
engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0} engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
dev: false dev: false
/@eslint/eslintrc@2.0.3: /@eslint/eslintrc@2.1.0:
resolution: {integrity: sha512-+5gy6OQfk+xx3q0d6jGZZC3f3KzAkXc/IanVxd1is/VIIziRqqt3ongQz0FiTUXqTk0c7aDB3OaFuKnuSoJicQ==} resolution: {integrity: sha512-Lj7DECXqIVCqnqjjHMPna4vn6GJcMgul/wuS0je9OZ9gsL0zzDpKPVtcG1HaDVc+9y+qgXneTeUMbCqXJNpH1A==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dependencies: dependencies:
ajv: 6.12.6 ajv: 6.12.6
debug: 4.3.4 debug: 4.3.4
espree: 9.5.2 espree: 9.6.0
globals: 13.20.0 globals: 13.20.0
ignore: 5.2.4 ignore: 5.2.4
import-fresh: 3.3.0 import-fresh: 3.3.0
@@ -421,8 +421,8 @@ packages:
- supports-color - supports-color
dev: false dev: false
/@eslint/js@8.43.0: /@eslint/js@8.44.0:
resolution: {integrity: sha512-s2UHCoiXfxMvmfzqoN+vrQ84ahUSYde9qNO1MdxmoEhyHWsfmwOpFlwYV+ePJEVc7gFnATGUi376WowX1N7tFg==} resolution: {integrity: sha512-Ag+9YM4ocKQx9AarydN0KY2j0ErMHNIocPDrVo8zAE44xLTjEtz81OdR68/cydGtk6m6jDb5Za3r2useMzYmSw==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dev: false dev: false
@@ -603,14 +603,14 @@ packages:
'@noble/hashes': 1.3.1 '@noble/hashes': 1.3.1
'@noble/secp256k1': 2.0.0 '@noble/secp256k1': 2.0.0
'@scure/base': 1.1.1 '@scure/base': 1.1.1
'@typescript-eslint/eslint-plugin': 5.60.1(@typescript-eslint/parser@5.60.1)(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/eslint-plugin': 5.60.1(@typescript-eslint/parser@5.60.1)(eslint@8.44.0)(typescript@4.9.5)
'@typescript-eslint/parser': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/parser': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
debug: 4.3.4 debug: 4.3.4
esbuild: 0.17.19 esbuild: 0.17.19
esbuild-plugin-alias: 0.2.1 esbuild-plugin-alias: 0.2.1
eslint: 8.43.0 eslint: 8.44.0
eslint-config-prettier: 8.8.0(eslint@8.43.0) eslint-config-prettier: 8.8.0(eslint@8.44.0)
eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.60.1)(eslint@8.43.0) eslint-plugin-import: 2.27.5(@typescript-eslint/parser@5.60.1)(eslint@8.44.0)
esm-loader-typescript: 1.0.5 esm-loader-typescript: 1.0.5
eventemitter3: 5.0.1 eventemitter3: 5.0.1
light-bolt11-decoder: 3.0.0 light-bolt11-decoder: 3.0.0
@@ -1494,7 +1494,7 @@ packages:
resolution: {integrity: sha512-W8F4eoTIvzXeNrT3JroQPimZLXnlJA8smYygHZUKFPVoYwgs/OhJkA1VBhL3iSs57OQkuINqHlY4SmMT5wtnJg==} resolution: {integrity: sha512-W8F4eoTIvzXeNrT3JroQPimZLXnlJA8smYygHZUKFPVoYwgs/OhJkA1VBhL3iSs57OQkuINqHlY4SmMT5wtnJg==}
dev: true dev: true
/@typescript-eslint/eslint-plugin@5.60.1(@typescript-eslint/parser@5.60.1)(eslint@8.43.0)(typescript@4.9.5): /@typescript-eslint/eslint-plugin@5.60.1(@typescript-eslint/parser@5.60.1)(eslint@8.44.0)(typescript@4.9.5):
resolution: {integrity: sha512-KSWsVvsJsLJv3c4e73y/Bzt7OpqMCADUO846bHcuWYSYM19bldbAeDv7dYyV0jwkbMfJ2XdlzwjhXtuD7OY6bw==} resolution: {integrity: sha512-KSWsVvsJsLJv3c4e73y/Bzt7OpqMCADUO846bHcuWYSYM19bldbAeDv7dYyV0jwkbMfJ2XdlzwjhXtuD7OY6bw==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies: peerDependencies:
@@ -1506,12 +1506,12 @@ packages:
optional: true optional: true
dependencies: dependencies:
'@eslint-community/regexpp': 4.5.1 '@eslint-community/regexpp': 4.5.1
'@typescript-eslint/parser': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/parser': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
'@typescript-eslint/scope-manager': 5.60.1 '@typescript-eslint/scope-manager': 5.60.1
'@typescript-eslint/type-utils': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/type-utils': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
'@typescript-eslint/utils': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/utils': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
debug: 4.3.4 debug: 4.3.4
eslint: 8.43.0 eslint: 8.44.0
grapheme-splitter: 1.0.4 grapheme-splitter: 1.0.4
ignore: 5.2.4 ignore: 5.2.4
natural-compare-lite: 1.4.0 natural-compare-lite: 1.4.0
@@ -1522,7 +1522,7 @@ packages:
- supports-color - supports-color
dev: false dev: false
/@typescript-eslint/parser@5.60.1(eslint@8.43.0)(typescript@4.9.5): /@typescript-eslint/parser@5.60.1(eslint@8.44.0)(typescript@4.9.5):
resolution: {integrity: sha512-pHWlc3alg2oSMGwsU/Is8hbm3XFbcrb6P5wIxcQW9NsYBfnrubl/GhVVD/Jm/t8HXhA2WncoIRfBtnCgRGV96Q==} resolution: {integrity: sha512-pHWlc3alg2oSMGwsU/Is8hbm3XFbcrb6P5wIxcQW9NsYBfnrubl/GhVVD/Jm/t8HXhA2WncoIRfBtnCgRGV96Q==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies: peerDependencies:
@@ -1536,7 +1536,7 @@ packages:
'@typescript-eslint/types': 5.60.1 '@typescript-eslint/types': 5.60.1
'@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5) '@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5)
debug: 4.3.4 debug: 4.3.4
eslint: 8.43.0 eslint: 8.44.0
typescript: 4.9.5 typescript: 4.9.5
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
@@ -1550,7 +1550,7 @@ packages:
'@typescript-eslint/visitor-keys': 5.60.1 '@typescript-eslint/visitor-keys': 5.60.1
dev: false dev: false
/@typescript-eslint/type-utils@5.60.1(eslint@8.43.0)(typescript@4.9.5): /@typescript-eslint/type-utils@5.60.1(eslint@8.44.0)(typescript@4.9.5):
resolution: {integrity: sha512-vN6UztYqIu05nu7JqwQGzQKUJctzs3/Hg7E2Yx8rz9J+4LgtIDFWjjl1gm3pycH0P3mHAcEUBd23LVgfrsTR8A==} resolution: {integrity: sha512-vN6UztYqIu05nu7JqwQGzQKUJctzs3/Hg7E2Yx8rz9J+4LgtIDFWjjl1gm3pycH0P3mHAcEUBd23LVgfrsTR8A==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies: peerDependencies:
@@ -1561,9 +1561,9 @@ packages:
optional: true optional: true
dependencies: dependencies:
'@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5) '@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5)
'@typescript-eslint/utils': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/utils': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
debug: 4.3.4 debug: 4.3.4
eslint: 8.43.0 eslint: 8.44.0
tsutils: 3.21.0(typescript@4.9.5) tsutils: 3.21.0(typescript@4.9.5)
typescript: 4.9.5 typescript: 4.9.5
transitivePeerDependencies: transitivePeerDependencies:
@@ -1596,19 +1596,19 @@ packages:
- supports-color - supports-color
dev: false dev: false
/@typescript-eslint/utils@5.60.1(eslint@8.43.0)(typescript@4.9.5): /@typescript-eslint/utils@5.60.1(eslint@8.44.0)(typescript@4.9.5):
resolution: {integrity: sha512-tiJ7FFdFQOWssFa3gqb94Ilexyw0JVxj6vBzaSpfN/8IhoKkDuSAenUKvsSHw2A/TMpJb26izIszTXaqygkvpQ==} resolution: {integrity: sha512-tiJ7FFdFQOWssFa3gqb94Ilexyw0JVxj6vBzaSpfN/8IhoKkDuSAenUKvsSHw2A/TMpJb26izIszTXaqygkvpQ==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
peerDependencies: peerDependencies:
eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 eslint: ^6.0.0 || ^7.0.0 || ^8.0.0
dependencies: dependencies:
'@eslint-community/eslint-utils': 4.4.0(eslint@8.43.0) '@eslint-community/eslint-utils': 4.4.0(eslint@8.44.0)
'@types/json-schema': 7.0.12 '@types/json-schema': 7.0.12
'@types/semver': 7.5.0 '@types/semver': 7.5.0
'@typescript-eslint/scope-manager': 5.60.1 '@typescript-eslint/scope-manager': 5.60.1
'@typescript-eslint/types': 5.60.1 '@typescript-eslint/types': 5.60.1
'@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5) '@typescript-eslint/typescript-estree': 5.60.1(typescript@4.9.5)
eslint: 8.43.0 eslint: 8.44.0
eslint-scope: 5.1.1 eslint-scope: 5.1.1
semver: 7.5.3 semver: 7.5.3
transitivePeerDependencies: transitivePeerDependencies:
@@ -2481,13 +2481,13 @@ packages:
engines: {node: '>=10'} engines: {node: '>=10'}
dev: false dev: false
/eslint-config-prettier@8.8.0(eslint@8.43.0): /eslint-config-prettier@8.8.0(eslint@8.44.0):
resolution: {integrity: sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==} resolution: {integrity: sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA==}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
eslint: '>=7.0.0' eslint: '>=7.0.0'
dependencies: dependencies:
eslint: 8.43.0 eslint: 8.44.0
dev: false dev: false
/eslint-formatter-pretty@4.1.0: /eslint-formatter-pretty@4.1.0:
@@ -2514,7 +2514,7 @@ packages:
- supports-color - supports-color
dev: false dev: false
/eslint-module-utils@2.8.0(@typescript-eslint/parser@5.60.1)(eslint-import-resolver-node@0.3.7)(eslint@8.43.0): /eslint-module-utils@2.8.0(@typescript-eslint/parser@5.60.1)(eslint-import-resolver-node@0.3.7)(eslint@8.44.0):
resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==} resolution: {integrity: sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==}
engines: {node: '>=4'} engines: {node: '>=4'}
peerDependencies: peerDependencies:
@@ -2535,15 +2535,15 @@ packages:
eslint-import-resolver-webpack: eslint-import-resolver-webpack:
optional: true optional: true
dependencies: dependencies:
'@typescript-eslint/parser': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/parser': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
debug: 3.2.7 debug: 3.2.7
eslint: 8.43.0 eslint: 8.44.0
eslint-import-resolver-node: 0.3.7 eslint-import-resolver-node: 0.3.7
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
dev: false dev: false
/eslint-plugin-import@2.27.5(@typescript-eslint/parser@5.60.1)(eslint@8.43.0): /eslint-plugin-import@2.27.5(@typescript-eslint/parser@5.60.1)(eslint@8.44.0):
resolution: {integrity: sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==} resolution: {integrity: sha512-LmEt3GVofgiGuiE+ORpnvP+kAm3h6MLZJ4Q5HCyHADofsb4VzXFsRiWj3c0OFiV+3DWFh0qg3v9gcPlfc3zRow==}
engines: {node: '>=4'} engines: {node: '>=4'}
peerDependencies: peerDependencies:
@@ -2553,15 +2553,15 @@ packages:
'@typescript-eslint/parser': '@typescript-eslint/parser':
optional: true optional: true
dependencies: dependencies:
'@typescript-eslint/parser': 5.60.1(eslint@8.43.0)(typescript@4.9.5) '@typescript-eslint/parser': 5.60.1(eslint@8.44.0)(typescript@4.9.5)
array-includes: 3.1.6 array-includes: 3.1.6
array.prototype.flat: 1.3.1 array.prototype.flat: 1.3.1
array.prototype.flatmap: 1.3.1 array.prototype.flatmap: 1.3.1
debug: 3.2.7 debug: 3.2.7
doctrine: 2.1.0 doctrine: 2.1.0
eslint: 8.43.0 eslint: 8.44.0
eslint-import-resolver-node: 0.3.7 eslint-import-resolver-node: 0.3.7
eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.60.1)(eslint-import-resolver-node@0.3.7)(eslint@8.43.0) eslint-module-utils: 2.8.0(@typescript-eslint/parser@5.60.1)(eslint-import-resolver-node@0.3.7)(eslint@8.44.0)
has: 1.0.3 has: 1.0.3
is-core-module: 2.12.1 is-core-module: 2.12.1
is-glob: 4.0.3 is-glob: 4.0.3
@@ -2601,15 +2601,15 @@ packages:
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dev: false dev: false
/eslint@8.43.0: /eslint@8.44.0:
resolution: {integrity: sha512-aaCpf2JqqKesMFGgmRPessmVKjcGXqdlAYLLC3THM8t5nBRZRQ+st5WM/hoJXkdioEXLLbXgclUpM0TXo5HX5Q==} resolution: {integrity: sha512-0wpHoUbDUHgNCyvFB5aXLiQVfK9B0at6gUvzy83k4kAsQ/u769TQDX6iKC+aO4upIHO9WSaA3QoXYQDHbNwf1A==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
hasBin: true hasBin: true
dependencies: dependencies:
'@eslint-community/eslint-utils': 4.4.0(eslint@8.43.0) '@eslint-community/eslint-utils': 4.4.0(eslint@8.44.0)
'@eslint-community/regexpp': 4.5.1 '@eslint-community/regexpp': 4.5.1
'@eslint/eslintrc': 2.0.3 '@eslint/eslintrc': 2.1.0
'@eslint/js': 8.43.0 '@eslint/js': 8.44.0
'@humanwhocodes/config-array': 0.11.10 '@humanwhocodes/config-array': 0.11.10
'@humanwhocodes/module-importer': 1.0.1 '@humanwhocodes/module-importer': 1.0.1
'@nodelib/fs.walk': 1.2.8 '@nodelib/fs.walk': 1.2.8
@@ -2621,7 +2621,7 @@ packages:
escape-string-regexp: 4.0.0 escape-string-regexp: 4.0.0
eslint-scope: 7.2.0 eslint-scope: 7.2.0
eslint-visitor-keys: 3.4.1 eslint-visitor-keys: 3.4.1
espree: 9.5.2 espree: 9.6.0
esquery: 1.5.0 esquery: 1.5.0
esutils: 2.0.3 esutils: 2.0.3
fast-deep-equal: 3.1.3 fast-deep-equal: 3.1.3
@@ -2658,8 +2658,8 @@ packages:
typescript: 5.1.6 typescript: 5.1.6
dev: false dev: false
/espree@9.5.2: /espree@9.6.0:
resolution: {integrity: sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==} resolution: {integrity: sha512-1FH/IiruXZ84tpUlm0aCUEwMl2Ho5ilqVh0VvQXw+byAz/4SAciyHLlfmL5WYqsvD38oymdUwBss0LtK8m4s/A==}
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dependencies: dependencies:
acorn: 8.9.0 acorn: 8.9.0

View File

@@ -1,3 +1,4 @@
import { FollowIcon, LoaderIcon, UnfollowIcon } from "@shared/icons";
import { Image } from "@shared/image"; import { Image } from "@shared/image";
import { DEFAULT_AVATAR } from "@stores/constants"; import { DEFAULT_AVATAR } from "@stores/constants";
import { useQuery } from "@tanstack/react-query"; import { useQuery } from "@tanstack/react-query";
@@ -23,12 +24,10 @@ export function Profile({ data }: { data: any }) {
const [followed, setFollowed] = useState(false); const [followed, setFollowed] = useState(false);
const followUser = (pubkey: string) => { const followUser = (pubkey: string) => {
try { try {
follow(pubkey); follow(pubkey);
// update state
// // update state
setFollowed(true); setFollowed(true);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
@@ -38,15 +37,13 @@ export function Profile({ data }: { data: any }) {
const unfollowUser = (pubkey: string) => { const unfollowUser = (pubkey: string) => {
try { try {
unfollow(pubkey); unfollow(pubkey);
// update state
// // update state
setFollowed(false); setFollowed(false);
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
}; };
useEffect(() => { useEffect(() => {
if (status === "success" && userFollows) { if (status === "success" && userFollows) {
if (userFollows.includes(data.pubkey)) { if (userFollows.includes(data.pubkey)) {
@@ -86,14 +83,26 @@ export function Profile({ data }: { data: any }) {
{socialStatus === "loading" ? ( {socialStatus === "loading" ? (
<button <button
type="button" type="button"
className="inline-flex w-36 h-10 items-center justify-center rounded-md bg-zinc-900 hover:bg-fuchsia-500 text-sm font-medium" className="inline-flex w-8 h-8 items-center justify-center rounded-md bg-zinc-900 hover:bg-fuchsia-500"
> >
Loading... <LoaderIcon className="h-4 w-4 animate-spin text-black dark:text-zinc-100" />
</button> </button>
) : followed ? ( ) : followed ? (
<button type="button" onClick={() => unfollowUser(data.pubkey)}>Unfollow</button> <button
type="button"
onClick={() => unfollowUser(data.pubkey)}
className="inline-flex w-8 h-8 items-center justify-center rounded-md text-zinc-400 bg-zinc-800 hover:bg-fuchsia-500 hover:text-white"
>
<UnfollowIcon className="w-4 h-4" />
</button>
) : ( ) : (
<button type="button" onClick={() => followUser(data.pubkey)}>Follow</button> <button
type="button"
onClick={() => followUser(data.pubkey)}
className="inline-flex w-8 h-8 items-center justify-center rounded-md text-zinc-400 bg-zinc-800 hover:bg-fuchsia-500 hover:text-white"
>
<FollowIcon className="w-4 h-4" />
</button>
)} )}
</div> </div>
</div> </div>

View File

@@ -0,0 +1,24 @@
import { SVGProps } from "react";
export function FollowIcon(
props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>,
) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
{...props}
>
<path
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
d="M11.85 13.251c-3.719.065-6.427 2.567-7.18 5.915-.13.575.338 1.084.927 1.084h6.901m-.647-6.999l.147-.001c.353 0 .696.022 1.03.064m-1.177-.063a7.889 7.889 0 00-1.852.249m3.028-.186c.334.042.658.104.972.186m-.972-.186a7.475 7.475 0 011.972.524m3.25 1.412v3m0 0v3m0-3h-3m3 0h3m-5.5-11.75a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0z"
/>
</svg>
);
}

View File

@@ -41,4 +41,6 @@ export * from "./signal";
export * from "./unverified"; export * from "./unverified";
export * from "./settings"; export * from "./settings";
export * from "./logout"; export * from "./logout";
export * from "./follow";
export * from "./unfollow";
// @endindex // @endindex

View File

@@ -0,0 +1,24 @@
import { SVGProps } from "react";
export function UnfollowIcon(
props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>,
) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="none"
viewBox="0 0 24 24"
{...props}
>
<path
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
d="M17.748 11.25h4.5m-7.5-4.75a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM3.67 19.166C4.432 15.773 7.203 13.25 11 13.25c3.795 0 6.566 2.524 7.328 5.916.13.575-.338 1.084-.927 1.084H4.597c-.59 0-1.056-.51-.927-1.084z"
/>
</svg>
);
}

View File

@@ -66,7 +66,7 @@ export function User({
<div className="flex flex-wrap items-baseline gap-1"> <div className="flex flex-wrap items-baseline gap-1">
<h5 <h5
className={`text-zinc-100 font-semibold leading-none truncate ${ className={`text-zinc-100 font-semibold leading-none truncate ${
size === "small" ? "max-w-[8rem]" : "max-w-[15rem]" size === "small" ? "max-w-[8rem]" : "max-w-[12rem]"
}`} }`}
> >
{user?.nip05 || user?.name || user?.displayName || shortenKey(pubkey)} {user?.nip05 || user?.name || user?.displayName || shortenKey(pubkey)}