diff --git a/package.json b/package.json index 39d5ea7b..c5f7990a 100644 --- a/package.json +++ b/package.json @@ -60,10 +60,8 @@ "@tiptap/react": "^2.1.13", "@tiptap/starter-kit": "^2.1.13", "@tiptap/suggestion": "^2.1.13", - "@tsparticles/engine": "^3.0.2", - "@tsparticles/react": "^3.0.0", - "@tsparticles/slim": "^3.0.2", "@vidstack/react": "^1.9.8", + "clsx": "^2.0.0", "dayjs": "^1.11.10", "framer-motion": "^10.16.16", "html-to-text": "^9.0.5", @@ -102,7 +100,6 @@ "@typescript-eslint/parser": "^6.15.0", "@vitejs/plugin-react-swc": "^3.5.0", "autoprefixer": "^10.4.16", - "clsx": "^2.0.0", "cross-env": "^7.0.3", "encoding": "^0.1.13", "eslint": "^8.56.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3ac71948..0d0fe390 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -131,18 +131,12 @@ dependencies: '@tiptap/suggestion': specifier: ^2.1.13 version: 2.1.13(@tiptap/core@2.1.13)(@tiptap/pm@2.1.13) - '@tsparticles/engine': - specifier: ^3.0.2 - version: 3.0.2 - '@tsparticles/react': - specifier: ^3.0.0 - version: 3.0.0(@tsparticles/engine@3.0.2)(react-dom@18.2.0)(react@18.2.0) - '@tsparticles/slim': - specifier: ^3.0.2 - version: 3.0.2 '@vidstack/react': specifier: ^1.9.8 version: 1.9.8(@types/react@18.2.45)(react@18.2.0) + clsx: + specifier: ^2.0.0 + version: 2.0.0 dayjs: specifier: ^1.11.10 version: 1.11.10 @@ -253,9 +247,6 @@ devDependencies: autoprefixer: specifier: ^10.4.16 version: 10.4.16(postcss@8.4.32) - clsx: - specifier: ^2.0.0 - version: 2.0.0 cross-env: specifier: ^7.0.3 version: 7.0.3 @@ -2491,252 +2482,6 @@ packages: - supports-color dev: true - /@tsparticles/basic@3.0.2: - resolution: {integrity: sha512-aM3X4daYRFxrkZ7+puHYjlgWjFaU4ROe8XOx7K+BnADfd0WM1I+JC0kspMEOe0b0qoiCbbbRpBqD135Kc75FXg==} - dependencies: - '@tsparticles/engine': 3.0.2 - '@tsparticles/move-base': 3.0.2 - '@tsparticles/shape-circle': 3.0.2 - '@tsparticles/updater-color': 3.0.2 - '@tsparticles/updater-opacity': 3.0.2 - '@tsparticles/updater-out-modes': 3.0.2 - '@tsparticles/updater-size': 3.0.2 - dev: false - - /@tsparticles/engine@3.0.2: - resolution: {integrity: sha512-2HhuJuHjz/GiIP0i+jpymnZEXfR82sTkp7jb/sQYfiHCu5Bh0XcNNuvZXbRMgt2qdB+BAupFA7ghIB1FfnLyug==} - requiresBuild: true - dev: false - - /@tsparticles/interaction-external-attract@3.0.2: - resolution: {integrity: sha512-7hrTPDKeDw0f6RbWs5m8eH4Dn+AIwn6d6w32GVbHEc2UQSMAX3G4rZ2ME6LEy8rlpnApIUNTBWFvK+laINtopg==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-bounce@3.0.2: - resolution: {integrity: sha512-uZrNKL3z04tOeL3/EpO/Jq7U1Pdz6jVO1UG8+r9NJg/Pwnrq7+my/1l/Oh2fUYeGzKlsy8NerBwHhNreZzzJzw==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-bubble@3.0.2: - resolution: {integrity: sha512-tOtz1tYqR0/X+MPj0VALgwG2maVeiTn60bxz56QpduDEgcQixSux7czn4btY3Y/CHR30+GBfYwFRyUAwg1v/bQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-connect@3.0.2: - resolution: {integrity: sha512-Bt0l4ptEXcCwDog9UbV2+C8EVv8rStrEWv0nCfNGwM+o5cFaSN8tqqd4c48SbtXNEq/k1+Fl2q0n7hU48YudyQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-grab@3.0.2: - resolution: {integrity: sha512-05JP7WwizKVukeX9dF4BTRYAYJ1Yviag6dryzO9LLf6hpdOM5qMbzJG6KIsILLxOpLo4jc9xQ1KCtpcG6bmARg==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-pause@3.0.2: - resolution: {integrity: sha512-W2W3wuZD3idLW5+x5I/elI0IGMKF2jHhAeaJ+OA8EOaZUduGhq4Y2KsP6byVdDIkhnLC/EZFn5k1Sw3vP4y1cw==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-push@3.0.2: - resolution: {integrity: sha512-a9AUDlDNbUBuRJLCF6E4/bcIc5nHQ0FNZJzV/K45/S4ByrHFob4Q2cDVfCxujbSEgOdWiTD4K8hEpvd2NKbK0w==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-remove@3.0.2: - resolution: {integrity: sha512-QO0nFUcJscjXaCrp0cTj554jVOlttN0bYjGeZ9/iS+pD4NtwAr1gqpDXBdHjDkb8+v/rWoDRB59teKEai2wCng==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-repulse@3.0.2: - resolution: {integrity: sha512-gQW1eRIhoIb8Hf2EHe9qDkiNC4WM4wSGKfAIZzuU4VufLi323Zr5r9M+go+uc+dinzVPGeuJz38/lUppTOopsg==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-external-slow@3.0.2: - resolution: {integrity: sha512-/gdlpiwX3fQpzHO5aQH728MnIHy0/ZY+nE9xjeK6KCp/hN8Ye/KgWmE2phK+HMdaYOOPcak+Sgw5QkpB1SK1ew==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-particles-attract@3.0.2: - resolution: {integrity: sha512-s5R7tAKSmsm9gcvnRJO0N2zLaHzO3MJU/DMcrD/yF9kpnFbOF8Xd8X7MR2bho0tMngqcDarqbEk0A95lDhSaog==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-particles-collisions@3.0.2: - resolution: {integrity: sha512-EA25ikXlZplEEPx45uwveTV+OyA5fNNMH24zTGYsJAMPPQ84r9ps7klIjGEJqboIbTkg9NFlVaHy8+ZlM9KLzA==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/interaction-particles-links@3.0.2: - resolution: {integrity: sha512-XCpTAgZWd0Om/iRa2I+YtzGiWVo5egWlx3PXE07DsZRQkeQJS0DcmMUx5Um3OagDkgfHmMZx0CDwDbCufA4ncQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/move-base@3.0.2: - resolution: {integrity: sha512-PjLII47p3tT6yOLb+CLLohaxXw13MVuijFq8sLkuNPbUNSE0ooJ0pmncqaAchFIYu2JxDbRZ1GuTuqEw+AIRUw==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/move-parallax@3.0.2: - resolution: {integrity: sha512-Q/QkDH2QXLxZpLULyYEHwwIeTqzxYRbAtzX+xmzjkfYd3esu9h6s3tjD3ICSYQNvoPXBx2o6yYinmK5comkuMg==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/plugin-easing-quad@3.0.2: - resolution: {integrity: sha512-Z36YfPXvtrHmcKYt5LfZdojYlFt8WWbAhP5OS3dRfKUgxnw+vMEP1gLxz9y+BebIeVZrZdR5OUk3EimlXdbZnQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/react@3.0.0(@tsparticles/engine@3.0.2)(react-dom@18.2.0)(react@18.2.0): - resolution: {integrity: sha512-hjGEtTT1cwv6BcjL+GcVgH++KYs52bIuQGW3PWv7z3tMa8g0bd6RI/vWSLj7p//NZ3uTjEIeilYIUPBh7Jfq/Q==} - peerDependencies: - '@tsparticles/engine': ^3.0.2 - react: '>=16.8.0' - react-dom: '>=16.8.0' - dependencies: - '@tsparticles/engine': 3.0.2 - react: 18.2.0 - react-dom: 18.2.0(react@18.2.0) - dev: false - - /@tsparticles/shape-circle@3.0.2: - resolution: {integrity: sha512-BqeeP2Oxu7NxEx6znB5V9rYc0VPZNrpC6WNyz78nvnhyARgQZWNRgNo5igaE2Zn+ss64KHNxkQDkbYP+ZAc1BQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-emoji@3.0.2: - resolution: {integrity: sha512-mpzsmNvE/DmWihRQrVS23JqWefmUjXU9HOkal9vWBgGDOfRpieBxHBHqNZFiYq1oaxa/zwFNcPCJ4BpiWu3nPQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-image@3.0.2: - resolution: {integrity: sha512-i4v5qZ7s48M/jkx/REHD0usTvyephebHrNWhM5XHYfXvPjuXg3nrP6sYGqRByPkJ3svdFoeGZM/5jrF63waHjA==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-line@3.0.2: - resolution: {integrity: sha512-tI8bFYp4UwDpTEUglHRtENx37F9xK1FKvk5UeIIHfCSVxBQsLtAZ16ynRVBnUXMPDHIs388xxeOqc2wHWrwlJw==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-polygon@3.0.2: - resolution: {integrity: sha512-aUVoDzoMy6uRf12xEKZ62aCxo+yBWxNrkNbdYxlMKIWzqRQVTiNxhwHt6VwBzzXUzy8KseaXB3BiQfLCsmdGLQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-square@3.0.2: - resolution: {integrity: sha512-ut8SlaroULa4C2aKVfMmGmfN5yAk6WN9xjT/yw4bPYAsunZdfeOEzH76u8K4SLVkl2CJ4H1w3YdWxhL+h8BtvQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/shape-star@3.0.2: - resolution: {integrity: sha512-fwZokgygyi3gX4vES9tlfTK8tJnvu5pd4exI2n1QW/8xpCpsORYhk+VWN994DSmt4g+VTYLb/tVnDk///Sa92g==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/slim@3.0.2: - resolution: {integrity: sha512-EAmfK1Oy2d1zwA1Dfpt0AQaut71zrmXOT4uvzuGq+PRH5CSbhqWuYplKCauYNCw02s+z3o3tCSea5/hcXh3tOA==} - dependencies: - '@tsparticles/basic': 3.0.2 - '@tsparticles/engine': 3.0.2 - '@tsparticles/interaction-external-attract': 3.0.2 - '@tsparticles/interaction-external-bounce': 3.0.2 - '@tsparticles/interaction-external-bubble': 3.0.2 - '@tsparticles/interaction-external-connect': 3.0.2 - '@tsparticles/interaction-external-grab': 3.0.2 - '@tsparticles/interaction-external-pause': 3.0.2 - '@tsparticles/interaction-external-push': 3.0.2 - '@tsparticles/interaction-external-remove': 3.0.2 - '@tsparticles/interaction-external-repulse': 3.0.2 - '@tsparticles/interaction-external-slow': 3.0.2 - '@tsparticles/interaction-particles-attract': 3.0.2 - '@tsparticles/interaction-particles-collisions': 3.0.2 - '@tsparticles/interaction-particles-links': 3.0.2 - '@tsparticles/move-base': 3.0.2 - '@tsparticles/move-parallax': 3.0.2 - '@tsparticles/plugin-easing-quad': 3.0.2 - '@tsparticles/shape-circle': 3.0.2 - '@tsparticles/shape-emoji': 3.0.2 - '@tsparticles/shape-image': 3.0.2 - '@tsparticles/shape-line': 3.0.2 - '@tsparticles/shape-polygon': 3.0.2 - '@tsparticles/shape-square': 3.0.2 - '@tsparticles/shape-star': 3.0.2 - '@tsparticles/updater-color': 3.0.2 - '@tsparticles/updater-life': 3.0.2 - '@tsparticles/updater-opacity': 3.0.2 - '@tsparticles/updater-out-modes': 3.0.2 - '@tsparticles/updater-rotate': 3.0.2 - '@tsparticles/updater-size': 3.0.2 - '@tsparticles/updater-stroke-color': 3.0.2 - dev: false - - /@tsparticles/updater-color@3.0.2: - resolution: {integrity: sha512-MfG+fVpXEqSMD38uN9MWLoHbSL1+EL4TbvOfyifyTV9lvsl0Ic154EowdRsJROAnQ2PnEcnJh8UjA6YXIg9uoA==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-life@3.0.2: - resolution: {integrity: sha512-EFhxKr11GdQyKbw3+UbDrRvN2ZJ9vEBFAWeM5TAR5erln9OI5/9J4ySXd+3MZRC7pH66GHPIB9yVBjonLURRnQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-opacity@3.0.2: - resolution: {integrity: sha512-4a8Y26v8ln90ZqaqcKn8bgpT2A2QxjUCnK56hmRrIdtG9+kcF43RZYDHZQo/Voy9UWKMJObaJ4eP60H6a2f4cw==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-out-modes@3.0.2: - resolution: {integrity: sha512-5Z6RRSnDeP0I0ToRF7kKJbsIZ3RCCIPeLPSL6uGeTaEiwZ2uD3DU87Brf66N0c4ioxKjpwQ/VKt3nRF9PIyNXQ==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-rotate@3.0.2: - resolution: {integrity: sha512-RA298SAzAvrSn8iV3VtW4tLgpGrhMFlPUZSOKIaD9fi1gcXPJGSCmqquJlLA5tGnFGcGGB8ZYsDB9VKHsvdXZg==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-size@3.0.2: - resolution: {integrity: sha512-DPOQvOxf1kEUzA7yEC40JYyvPhOGJirtSiX86vpi3ApTWud2n+B+D3AXS7JhT/g+ISNQ04dICRbRYY0yUeDLFA==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - - /@tsparticles/updater-stroke-color@3.0.2: - resolution: {integrity: sha512-SIkWit6LCauH0bg3jdXOBfFkFwih4mUSfBInaM+iISrvWLQA6XQLtcxJKql7Uvpu2eqTEShZ3UmnKPutqd46/w==} - dependencies: - '@tsparticles/engine': 3.0.2 - dev: false - /@types/html-to-text@9.0.4: resolution: {integrity: sha512-pUY3cKH/Nm2yYrEmDlPR1mR7yszjGx4DrwPjQ702C4/D5CwHuZTgZdIdwPkRbcuhs7BAh2L5rg3CL5cbRiGTCQ==} dev: true @@ -3281,7 +3026,7 @@ packages: /clsx@2.0.0: resolution: {integrity: sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==} engines: {node: '>=6'} - dev: true + dev: false /color-convert@1.9.3: resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==} diff --git a/src/libs/ark/components/note/index.ts b/src/libs/ark/components/note/index.ts index 21af5772..14609f4e 100644 --- a/src/libs/ark/components/note/index.ts +++ b/src/libs/ark/components/note/index.ts @@ -1,6 +1,7 @@ import { NoteChild } from './child'; -import { NoteContent } from './content'; +import { NoteKind } from './kind'; import { NoteMenu } from './menu'; +import { NotePin } from './pin'; import { NoteReaction } from './reaction'; import { NoteReply } from './reply'; import { NoteRepost } from './repost'; @@ -12,10 +13,11 @@ export const Note = { Root: NoteRoot, User: NoteUser, Menu: NoteMenu, - Content: NoteContent, + Kind: NoteKind, Reply: NoteReply, Repost: NoteRepost, Reaction: NoteReaction, Zap: NoteZap, + Pin: NotePin, Child: NoteChild, }; diff --git a/src/libs/ark/components/note/content.tsx b/src/libs/ark/components/note/kind.tsx similarity index 93% rename from src/libs/ark/components/note/content.tsx rename to src/libs/ark/components/note/kind.tsx index 33f08321..0ee9612d 100644 --- a/src/libs/ark/components/note/content.tsx +++ b/src/libs/ark/components/note/kind.tsx @@ -1,7 +1,7 @@ import { twMerge } from 'tailwind-merge'; import { useRichContent } from '@utils/hooks/useRichContent'; -export function NoteContent({ +export function NoteKind({ content, className, }: { diff --git a/src/libs/ark/components/note/kinds/repost.tsx b/src/libs/ark/components/note/kinds/repost.tsx deleted file mode 100644 index e69de29b..00000000 diff --git a/src/libs/ark/components/note/kinds/text.tsx b/src/libs/ark/components/note/kinds/text.tsx deleted file mode 100644 index bfb5d0a6..00000000 --- a/src/libs/ark/components/note/kinds/text.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import { NDKEvent } from '@nostr-dev-kit/ndk'; -import { useArk } from '@libs/ark'; -import { Note } from '..'; - -export function TextNote({ event }: { event: NDKEvent }) { - const ark = useArk(); - const thread = ark.getEventThread({ tags: event.tags }); - - return ( - -
- - -
- {thread ? ( -
-
- {thread.rootEventId ? ( - - ) : null} - {thread.replyEventId ? : null} - -
-
- ) : null} - -
-
-
- - - - -
-
- - ); -} diff --git a/src/libs/ark/components/note/pin.tsx b/src/libs/ark/components/note/pin.tsx new file mode 100644 index 00000000..836e4337 --- /dev/null +++ b/src/libs/ark/components/note/pin.tsx @@ -0,0 +1,27 @@ +import * as Tooltip from '@radix-ui/react-tooltip'; +import { PinIcon } from '@shared/icons'; + +export function NotePin({ action }: { action: () => void }) { + return ( + + + + + + + + Pin note + + + + + + ); +} diff --git a/src/libs/ark/index.ts b/src/libs/ark/index.ts index 48c8ef3b..9a1d1c23 100644 --- a/src/libs/ark/index.ts +++ b/src/libs/ark/index.ts @@ -2,4 +2,3 @@ export * from './ark'; export * from './provider'; export * from './components/widget'; export * from './components/note'; -export * from './components/note/kinds/text'; diff --git a/src/shared/icons/index.ts b/src/shared/icons/index.ts index 144def0e..265408ea 100644 --- a/src/shared/icons/index.ts +++ b/src/shared/icons/index.ts @@ -91,3 +91,4 @@ export * from './run'; export * from './gossip'; export * from './userAdd'; export * from './userRemove'; +export * from './pin'; diff --git a/src/shared/icons/pin.tsx b/src/shared/icons/pin.tsx new file mode 100644 index 00000000..2908e670 --- /dev/null +++ b/src/shared/icons/pin.tsx @@ -0,0 +1,18 @@ +export function PinIcon(props: JSX.IntrinsicElements['svg']) { + return ( + + + + ); +} diff --git a/src/shared/notes/actions.tsx b/src/shared/notes/actions.tsx index 7f44cc8f..a50bdd95 100644 --- a/src/shared/notes/actions.tsx +++ b/src/shared/notes/actions.tsx @@ -1,7 +1,7 @@ import { NDKEvent } from '@nostr-dev-kit/ndk'; import * as Tooltip from '@radix-ui/react-tooltip'; import { createSearchParams, useNavigate } from 'react-router-dom'; -import { FocusIcon, ReplyIcon } from '@shared/icons'; +import { PinIcon, ReplyIcon } from '@shared/icons'; import { NoteReaction } from '@shared/notes/actions/reaction'; import { NoteRepost } from '@shared/notes/actions/repost'; import { NoteZap } from '@shared/notes/actions/zap'; @@ -38,13 +38,13 @@ export function NoteActions({ } className="inline-flex h-7 w-max items-center justify-center gap-2 rounded-full bg-neutral-100 px-2 text-sm font-medium dark:bg-neutral-900" > - - Open + + Pin - Open thread + Pin note diff --git a/src/shared/notes/repost.tsx b/src/shared/notes/repost.tsx index 58ebf4f1..4a0a7a2d 100644 --- a/src/shared/notes/repost.tsx +++ b/src/shared/notes/repost.tsx @@ -59,7 +59,7 @@ export function Repost({ event }: { event: NDKEvent }) { if (isError) { return ( -
+
@@ -73,7 +73,7 @@ export function Repost({ event }: { event: NDKEvent }) { } return ( -
+