revert route groups due to nextjs bug, fix build

2024-09-14 17:23:32 +00:00 · 2023-04-18 07:55:11 +07:00 · 2023-04-18 07:55:11 +07:00 · fc258fdcde
commit fc258fdcde
parent 2b0a4e2402
38 changed files with 89 additions and 92 deletions
--- a/package.json
+++ b/package.json
@ -31,7 +31,7 @@
    "framer-motion": "^9.1.7",
    "iconoir-react": "^6.6.0",
    "jotai": "^2.0.4",
-    "next": "13.3.1-canary.8",
+    "next": "13.3.1-canary.11",
    "nostr-relaypool": "^0.5.18",
    "nostr-tools": "^1.9.0",
    "react": "^18.2.0",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -37,7 +37,7 @@ specifiers:
  iconoir-react: ^6.6.0
  jotai: ^2.0.4
  lint-staged: ^13.2.1
-  next: 13.3.1-canary.8
+  next: 13.3.1-canary.11
  nostr-relaypool: ^0.5.18
  nostr-tools: ^1.9.0
  postcss: ^8.4.22
@ -74,7 +74,7 @@ dependencies:
  framer-motion: 9.1.7_biqbaboplfbrettd7655fr4n2y
  iconoir-react: 6.6.0_react@18.2.0
  jotai: 2.0.4_react@18.2.0
-  next: 13.3.1-canary.8_biqbaboplfbrettd7655fr4n2y
+  next: 13.3.1-canary.11_biqbaboplfbrettd7655fr4n2y
  nostr-relaypool: 0.5.18_ws@8.13.0
  nostr-tools: 1.9.0
  react: 18.2.0
@ -417,9 +417,9 @@ packages:
      '@jridgewell/resolve-uri': 3.1.0
      '@jridgewell/sourcemap-codec': 1.4.14

-  /@next/env/13.3.1-canary.8:
+  /@next/env/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-xZfNu7yq3OfiC4rkGuGMcqb25se+ZHRqajSdny8dp+nZzkNSK1SHuNT3W8faI+KGk6dqzO/zAdHR9YrqnQlCAg== }
+      { integrity: sha512-DMeWYmGjEHW2ztS5/d8SX+19JkZJChd+xZTs6QsWY/mav4KUXqsbKYgidvr4CSmq2cZ7ebNstZSTvJM7FgXwbQ== }
    dev: false

  /@next/eslint-plugin-next/13.3.0:
@ -429,9 +429,9 @@ packages:
      glob: 7.1.7
    dev: true

-  /@next/swc-darwin-arm64/13.3.1-canary.8:
+  /@next/swc-darwin-arm64/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-BLbvhcaSzwuXbREOmJiqAdXVD7Jl9830hDY5ZTTNg7hXqEZgoMg2LxAEmtaaBMVZRfDQjd5bH3QPBV8fbG4UKg== }
+      { integrity: sha512-IrMxnHXziEE0itV8jQE6SSxAg0vwm2uvobXbdsgXo2q96hMjDXnnOP/1QLrqPOip3DfFEoYwyLx1C8P9exMHEA== }
    engines: { node: '>= 10' }
    cpu: [arm64]
    os: [darwin]
@ -439,9 +439,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-darwin-x64/13.3.1-canary.8:
+  /@next/swc-darwin-x64/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-n4tJKPIvFTZshS1TVWrsqaW7h9VW+BmguO/AlZ3Q3NJ9hWxC5L4lxn2T6CTQ4M30Gf+t5u+dPzYLQ5IDtJFnFQ== }
+      { integrity: sha512-zsG6xMFs7YagHz3ZorUJFqgc7X/bqVLlDJ5oDnWXTueMR8P8CgEhE/E+9wDhOEuwF8bjn6S7dSYYoLbAH+RMDQ== }
    engines: { node: '>= 10' }
    cpu: [x64]
    os: [darwin]
@ -449,9 +449,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-linux-arm64-gnu/13.3.1-canary.8:
+  /@next/swc-linux-arm64-gnu/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-AxnsgZ56whwVAeejyEZMk8xc8Vapwzb3Zn0YdZzPCR42WKfkcSkM+AWfq33zUOZnjvCmQBDyfHIo4CURVweR6g== }
+      { integrity: sha512-hv5LS+AbbnUxRoPA4vqagzXCUVLUipK3zNCqFHa2Udj7Uvc5j8/OjcUH7qfHtNxVonoCIfpaGnI1k1vtF7mGCw== }
    engines: { node: '>= 10' }
    cpu: [arm64]
    os: [linux]
@ -459,9 +459,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-linux-arm64-musl/13.3.1-canary.8:
+  /@next/swc-linux-arm64-musl/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-zc7rzhtrHMWZ/phvjCNplHGo+ZLembjtluI5J8Xl4iwQQCyZwAtnmQhs37/zkdi6dHZou+wcFBZWRz14awRDBw== }
+      { integrity: sha512-AGKZPTl748WpMmUiTd9l+mskgEE7t3QVA+tW3owNYfSP48V/Z/NCwfsuOx9DTtpydZ2L8LWuySEme0AyNsoDWw== }
    engines: { node: '>= 10' }
    cpu: [arm64]
    os: [linux]
@ -469,9 +469,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-linux-x64-gnu/13.3.1-canary.8:
+  /@next/swc-linux-x64-gnu/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-vNbFDiuZ9fWmcznlilDbflZLb04evWPUQlyDT7Tqjd964PlSIaaX3tr64pdYjJOljDaqTr2Kbx0YW74mWF/PEw== }
+      { integrity: sha512-2+N4/xJosn/Tgh0T3K8dSWc/tn/dNMbDpAAAEqDpl4t9lDMssCGGPMNHxK96wc+peXqub5/RbUKb+1N0CbUaow== }
    engines: { node: '>= 10' }
    cpu: [x64]
    os: [linux]
@ -479,9 +479,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-linux-x64-musl/13.3.1-canary.8:
+  /@next/swc-linux-x64-musl/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-/FVBPJEBDZYCNraocRWtd5ObAgNi9VFnzJYGYDYIj4jKkFRWWm/CaWu9A7toQACC/JDy262uPyDPathXT9BAqQ== }
+      { integrity: sha512-MuIXKPPtBAuTX/ls5nOaps7GbDg6AWVXtuR3sEryAgJTAyZdA9nqJ6RGqkdieDSUT2rp/UF8z/vq900F7Pjvqw== }
    engines: { node: '>= 10' }
    cpu: [x64]
    os: [linux]
@ -489,9 +489,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-win32-arm64-msvc/13.3.1-canary.8:
+  /@next/swc-win32-arm64-msvc/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-8jMwRCeI26yVZLPwG0AjOi4b1yqSeqYmbHA7r+dqiV0OgFdYjnbyHU1FmiKDaC5SnnJN6LWV2Qjer9GDD0Kcuw== }
+      { integrity: sha512-GK8B8K2JShn3/DI6bAeKYDP9Jh4eLfFRPOvJ+LnwuCzj+VdSXh9H4S5YZr04eC1EFG6AxkB4JstCkdURLiXGjQ== }
    engines: { node: '>= 10' }
    cpu: [arm64]
    os: [win32]
@ -499,9 +499,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-win32-ia32-msvc/13.3.1-canary.8:
+  /@next/swc-win32-ia32-msvc/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-kcYB9iSEikFhv0I9uQDdgQ2lm8i3O8LA+GhnED9e5VtURBwOSwED7c6ZpaRQBYSPgnEA9/xiJVChICE/I7Ig1g== }
+      { integrity: sha512-r4tSFS5IO5j0YuIY0BPz/v+x7uQa9DBY9hCtlMDxkC5zZ1x1ESYP/sYMbC6B0PAYlGPbuNEz2EGjOmM+oV4zsQ== }
    engines: { node: '>= 10' }
    cpu: [ia32]
    os: [win32]
@ -509,9 +509,9 @@ packages:
    dev: false
    optional: true

-  /@next/swc-win32-x64-msvc/13.3.1-canary.8:
+  /@next/swc-win32-x64-msvc/13.3.1-canary.11:
    resolution:
-      { integrity: sha512-UKrGHonKVWBNg+HI4J8pXE6Jjjl8GwjhygFau71s8M0+jSy99y5Y+nGH9EmMNWKNvrObukyYvrs6OsAusKdCqw== }
+      { integrity: sha512-w+SFpBfbxSdrC1fhV7xSecsBwBTDRPtd0PjzkyjdLD5EydHXU37PWGTZLfuD3I0ZN/uNncD8pNTB6YKF/a6L/A== }
    engines: { node: '>= 10' }
    cpu: [x64]
    os: [win32]
@ -3589,9 +3589,9 @@ packages:
      { integrity: sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ== }
    dev: false

-  /next/13.3.1-canary.8_biqbaboplfbrettd7655fr4n2y:
+  /next/13.3.1-canary.11_biqbaboplfbrettd7655fr4n2y:
    resolution:
-      { integrity: sha512-z4QUgyAN+hSWSEqb4pvGvC3iRktE6NH2DVLU4AvfqNYpzP+prePiJC8HN/cJpFhGW9YbhyRLi5FliDC631OOag== }
+      { integrity: sha512-osuYoB5F7Ib+mGR5oeiI2mQzVJPpeZrA7VX2ZSyUl+7ZDPJSgQRcX8m+4rVov5iy0+i1rPSot7Q/alMSqgYNPg== }
    engines: { node: '>=14.6.0' }
    hasBin: true
    peerDependencies:
@ -3611,7 +3611,7 @@ packages:
      sass:
        optional: true
    dependencies:
-      '@next/env': 13.3.1-canary.8
+      '@next/env': 13.3.1-canary.11
      '@swc/helpers': 0.4.14
      busboy: 1.6.0
      caniuse-lite: 1.0.30001480
@ -3620,15 +3620,15 @@ packages:
      react-dom: 18.2.0_react@18.2.0
      styled-jsx: 5.1.1_react@18.2.0
    optionalDependencies:
-      '@next/swc-darwin-arm64': 13.3.1-canary.8
-      '@next/swc-darwin-x64': 13.3.1-canary.8
-      '@next/swc-linux-arm64-gnu': 13.3.1-canary.8
-      '@next/swc-linux-arm64-musl': 13.3.1-canary.8
-      '@next/swc-linux-x64-gnu': 13.3.1-canary.8
-      '@next/swc-linux-x64-musl': 13.3.1-canary.8
-      '@next/swc-win32-arm64-msvc': 13.3.1-canary.8
-      '@next/swc-win32-ia32-msvc': 13.3.1-canary.8
-      '@next/swc-win32-x64-msvc': 13.3.1-canary.8
+      '@next/swc-darwin-arm64': 13.3.1-canary.11
+      '@next/swc-darwin-x64': 13.3.1-canary.11
+      '@next/swc-linux-arm64-gnu': 13.3.1-canary.11
+      '@next/swc-linux-arm64-musl': 13.3.1-canary.11
+      '@next/swc-linux-x64-gnu': 13.3.1-canary.11
+      '@next/swc-linux-x64-musl': 13.3.1-canary.11
+      '@next/swc-win32-arm64-msvc': 13.3.1-canary.11
+      '@next/swc-win32-ia32-msvc': 13.3.1-canary.11
+      '@next/swc-win32-x64-msvc': 13.3.1-canary.11
    transitivePeerDependencies:
      - '@babel/core'
      - babel-plugin-macros
--- a/src-tauri/src/main.rs
+++ b/src-tauri/src/main.rs
@ -7,16 +7,17 @@
 #[macro_use]
 extern crate objc;

-use prisma_client_rust::Direction;
 use tauri::{Manager, WindowEvent};
 #[cfg(target_os = "macos")]
 use window_ext::WindowExt;
 #[cfg(target_os = "macos")]
 mod window_ext;

+#[allow(warnings, unused)]
 mod db;

 use db::*;
+use prisma_client_rust::Direction;
 use serde::Deserialize;
 use specta::{collect_types, Type};
 use std::{sync::Arc, vec};
--- a/src/app/(nostr)/channels/[id]/page.tsx
+++ b/src/app/(nostr)/channels/[id]/page.tsx
--- a/src/app/(nostr)/channels/page.tsx
+++ b/src/app/(nostr)/channels/page.tsx
--- a/src/app/(nostr)/chats/[pubkey]/page.tsx
+++ b/src/app/(nostr)/chats/[pubkey]/page.tsx
--- a/src/app/(nostr)/explore/page.tsx
+++ b/src/app/(nostr)/explore/page.tsx
--- a/src/app/(nostr)/layout.tsx
+++ b/src/app/(nostr)/layout.tsx
--- a/src/app/(nostr)/newsfeed/[id]/page.tsx
+++ b/src/app/(nostr)/newsfeed/[id]/page.tsx
--- a/src/app/(nostr)/newsfeed/circle/page.tsx
+++ b/src/app/(nostr)/newsfeed/circle/page.tsx
--- a/src/app/(nostr)/newsfeed/following/page.tsx
+++ b/src/app/(nostr)/newsfeed/following/page.tsx
--- a/src/app/(nostr)/users/[id]/page.tsx
+++ b/src/app/(nostr)/users/[id]/page.tsx
--- a/src/app/(onboarding)/create/[...slug]/page.tsx
+++ b/src/app/(onboarding)/create/[...slug]/page.tsx
--- a/src/app/(onboarding)/create/page.tsx
+++ b/src/app/(onboarding)/create/page.tsx
--- a/src/app/(onboarding)/layout.tsx
+++ b/src/app/(onboarding)/layout.tsx
--- a/src/app/(onboarding)/login/[...slug]/page.tsx
+++ b/src/app/(onboarding)/login/[...slug]/page.tsx
@ -5,7 +5,7 @@ import { RelayContext } from '@components/relaysProvider';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { fetchProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import Image from 'next/image';
 import { useRouter } from 'next/navigation';
@ -113,9 +113,7 @@ export default function Page({ params }: { params: { privkey: string } }) {
                  <div className="flex items-center gap-2">
                    <p className="font-semibold">{profile.metadata?.display_name || profile.metadata?.name}</p>
                    <span className="leading-tight text-zinc-500">·</span>
-                    <p className="text-zinc-500">
-                      @{profile.metadata?.username || (pubkey && truncate(pubkey, 16, ' .... '))}
-                    </p>
+                    <p className="text-zinc-500">@{profile.metadata?.username || (pubkey && shortenKey(pubkey))}</p>
                  </div>
                  <div className="space-y-3">
                    <div className="grid grid-cols-3 gap-4">
--- a/src/app/(onboarding)/login/page.tsx
+++ b/src/app/(onboarding)/login/page.tsx
--- a/src/app/(onboarding)/onboarding/page.tsx
+++ b/src/app/(onboarding)/onboarding/page.tsx
--- a/src/app/(default)/page.tsx
+++ b/src/app/(default)/page.tsx
@ -144,7 +144,7 @@ export default function Page() {
        undefined,
        () => {
          if (eose.current > 5) {
-            router.replace('/newsfeed/following');
+            router.replace('/nostr/newsfeed/following');
          } else {
            eose.current += 1;
          }
--- a/src/app/providers.tsx
+++ b/src/app/providers.tsx
@ -1,6 +1,8 @@
 'use client';

-import RelayProvider from '@components/relaysProvider';
+import dynamic from 'next/dynamic';
+
+const RelayProvider = dynamic(() => import('@components/relaysProvider'), { ssr: false });

 export function Providers({ children }: { children: React.ReactNode }) {
  return <RelayProvider>{children}</RelayProvider>;
--- a/src/components/channels/channelList.tsx
+++ b/src/components/channels/channelList.tsx
@ -22,7 +22,7 @@ export default function ChannelList() {
  return (
    <div className="flex flex-col gap-px">
      <Link
-        href="/channels"
+        href="/nostr/channels"
        className="group inline-flex items-center gap-2 rounded-md px-2.5 py-1.5 hover:bg-zinc-900"
      >
        <div className="inline-flex h-5 w-5 shrink items-center justify-center rounded bg-zinc-900 group-hover:bg-zinc-800">
--- a/src/components/channels/channelListItem.tsx
+++ b/src/components/channels/channelListItem.tsx
@ -8,7 +8,7 @@ export const ChannelListItem = ({ data }: { data: any }) => {

  return (
    <ActiveLink
-      href={`/channels/${data.eventId}`}
+      href={`/nostr/channels/${data.eventId}`}
      activeClassName="dark:bg-zinc-900 dark:text-zinc-100 hover:dark:bg-zinc-800"
      className="inline-flex items-center gap-2 rounded-md px-2.5 py-1.5 hover:bg-zinc-900"
    >
--- a/src/components/chats/chatListItem.tsx
+++ b/src/components/chats/chatListItem.tsx
@ -4,14 +4,14 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 export const ChatListItem = ({ pubkey }: { pubkey: string }) => {
  const profile = useProfileMetadata(pubkey);

  return (
    <ActiveLink
-      href={`/chats/${pubkey}`}
+      href={`/nostr/chats/${pubkey}`}
      activeClassName="dark:bg-zinc-900 dark:text-zinc-100 hover:dark:bg-zinc-800"
      className="inline-flex items-center gap-2 rounded-md px-2.5 py-1.5 hover:bg-zinc-900"
    >
@ -25,7 +25,7 @@ export const ChatListItem = ({ pubkey }: { pubkey: string }) => {
      </div>
      <div>
        <h5 className="text-sm font-medium text-zinc-400">
-          {profile?.display_name || profile?.name || truncate(pubkey, 16, ' .... ')}
+          {profile?.display_name || profile?.name || shortenKey(pubkey)}
        </h5>
      </div>
    </ActiveLink>
--- a/src/components/chats/chatModalUser.tsx
+++ b/src/components/chats/chatModalUser.tsx
@ -2,7 +2,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';

 import { DEFAULT_AVATAR } from '@stores/constants';

-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import { useRouter } from 'next/navigation';

@ -29,7 +29,7 @@ export const ChatModalUser = ({ data }: { data: any }) => {
          <span className="truncate text-sm font-semibold leading-tight text-zinc-200">
            {profile?.display_name || profile?.name}
          </span>
-          <span className="text-sm leading-tight text-zinc-400">{truncate(data.pubkey, 16, ' .... ')}</span>
+          <span className="text-sm leading-tight text-zinc-400">{shortenKey(data.pubkey)}</span>
        </div>
      </div>
      <div>
--- a/src/components/chats/messageUser.tsx
+++ b/src/components/chats/messageUser.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
@ -26,7 +26,7 @@ export const MessageUser = ({ pubkey, time }: { pubkey: string; time: number })
      <div className="flex w-full flex-1 items-start justify-between">
        <div className="flex items-baseline gap-2 text-sm">
          <span className="font-semibold leading-none text-zinc-200 group-hover:underline">
-            {profile?.display_name || profile?.name || truncate(pubkey, 16, ' .... ')}
+            {profile?.display_name || profile?.name || shortenKey(pubkey)}
          </span>
          <span className="leading-none text-zinc-500">·</span>
          <span className="leading-none text-zinc-500">{dayjs().to(dayjs.unix(time))}</span>
--- a/src/components/multiAccounts/activeAccount.tsx
+++ b/src/components/multiAccounts/activeAccount.tsx
@ -14,7 +14,7 @@ export const ActiveAccount = ({ user }: { user: any }) => {
  const userData = JSON.parse(user.metadata);

  const openProfilePage = () => {
-    router.push(`/users/${user.pubkey}`);
+    router.push(`/nostr/users/${user.pubkey}`);
  };

  const copyPublicKey = async () => {
--- a/src/components/navigation/newsfeed.tsx
+++ b/src/components/navigation/newsfeed.tsx
@ -24,7 +24,7 @@ export default function Newsfeed() {
        </Collapsible.Trigger>
        <Collapsible.Content className="flex flex-col text-zinc-400">
          <ActiveLink
-            href="/newsfeed/following"
+            href="/nostr/newsfeed/following"
            activeClassName="dark:bg-zinc-900 dark:text-zinc-100 hover:dark:bg-zinc-800"
            className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-sm font-medium hover:text-zinc-200"
          >
@ -32,7 +32,7 @@ export default function Newsfeed() {
            <span>Following</span>
          </ActiveLink>
          <ActiveLink
-            href="/newsfeed/circle"
+            href="/nostr/newsfeed/circle"
            activeClassName="dark:bg-zinc-900 dark:text-zinc-100 hover:dark:bg-zinc-800"
            className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-sm font-medium hover:text-zinc-200"
          >
--- a/src/components/note/base.tsx
+++ b/src/components/note/base.tsx
@ -22,7 +22,7 @@ export const NoteBase = memo(function NoteBase({ event }: { event: any }) {

  const openUserPage = (e) => {
    e.stopPropagation();
-    router.push(`/users/${event.pubkey}`);
+    router.push(`/nostr/users/${event.pubkey}`);
  };

  const openThread = (e) => {
--- a/src/components/note/meta/comment.tsx
+++ b/src/components/note/meta/comment.tsx
@ -34,7 +34,7 @@ export const NoteComment = ({
  const profile = activeAccount.metadata ? JSON.parse(activeAccount.metadata) : null;

  const openThread = () => {
-    router.push(`/newsfeed/${eventID}`);
+    router.push(`/nostr/newsfeed/${eventID}`);
  };

  const submitEvent = () => {
--- a/src/components/note/rootNote.tsx
+++ b/src/components/note/rootNote.tsx
@ -18,13 +18,13 @@ export const RootNote = memo(function RootNote({ event }: { event: any }) {

  const openUserPage = (e) => {
    e.stopPropagation();
-    router.push(`/users/${event.pubkey}`);
+    router.push(`/nostr/users/${event.pubkey}`);
  };

  const openThread = (e) => {
    const selection = window.getSelection();
    if (selection.toString().length === 0) {
-      router.push(`/newsfeed/${event.id}`);
+      router.push(`/nostr/newsfeed/${event.id}`);
    } else {
      e.stopPropagation();
    }
--- a/src/components/profile/metadata.tsx
+++ b/src/components/profile/metadata.tsx
@ -5,7 +5,7 @@ import { RelayContext } from '@components/relaysProvider';

 import { DEFAULT_AVATAR } from '@stores/constants';

-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import destr from 'destr';
 import Image from 'next/image';
@ -51,9 +51,7 @@ export default function ProfileMetadata({ id }: { id: string }) {
            <h3 className="text-lg font-semibold leading-tight text-zinc-100">
              {profile?.display_name || profile?.name}
            </h3>
-            <span className="text-sm leading-tight text-zinc-500">
-              {profile?.username || (id && truncate(id, 16, ' .... '))}
-            </span>
+            <span className="text-sm leading-tight text-zinc-500">{profile?.username || (id && shortenKey(id))}</span>
          </div>
          <div className="prose-sm prose-zinc leading-tight dark:prose-invert">{profile?.about}</div>
        </div>
--- a/src/components/user/base.tsx
+++ b/src/components/user/base.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import { memo } from 'react';

@ -24,7 +24,7 @@ export const UserBase = memo(function UserBase({ pubkey }: { pubkey: string }) {
        <span className="truncate font-medium leading-tight text-zinc-200">
          {profile?.display_name || profile?.name}
        </span>
-        <span className="text-sm leading-tight text-zinc-400">{truncate(pubkey, 16, ' .... ')}</span>
+        <span className="text-sm leading-tight text-zinc-400">{shortenKey(pubkey)}</span>
      </div>
    </div>
  );
--- a/src/components/user/follow.tsx
+++ b/src/components/user/follow.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 export const UserFollow = ({ pubkey }: { pubkey: string }) => {
  const profile = useProfileMetadata(pubkey);
@ -22,7 +22,7 @@ export const UserFollow = ({ pubkey }: { pubkey: string }) => {
        <span className="truncate font-medium leading-tight text-zinc-200">
          {profile?.display_name || profile?.name}
        </span>
-        <span className="text-sm leading-tight text-zinc-400">{truncate(pubkey, 16, ' .... ')}</span>
+        <span className="text-sm leading-tight text-zinc-400">{shortenKey(pubkey)}</span>
      </div>
    </div>
  );
--- a/src/components/user/large.tsx
+++ b/src/components/user/large.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
@ -28,10 +28,10 @@ export const UserLarge = ({ pubkey, time }: { pubkey: string; time: number }) =>
        <div className="flex w-full justify-between">
          <div className="flex flex-col gap-1 text-sm">
            <span className="font-bold leading-tight text-zinc-100">
-              {profile?.display_name || profile?.name || truncate(pubkey, 16, ' .... ')}
+              {profile?.display_name || profile?.name || shortenKey(pubkey)}
            </span>
            <span className="leading-tight text-zinc-400">
-              {profile?.username || truncate(pubkey, 16, ' .... ')} · {dayjs().to(dayjs.unix(time))}
+              {profile?.username || shortenKey(pubkey)} · {dayjs().to(dayjs.unix(time))}
            </span>
          </div>
          <div>
--- a/src/components/user/mention.tsx
+++ b/src/components/user/mention.tsx
@ -1,11 +1,9 @@
 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 export const UserMention = ({ pubkey }: { pubkey: string }) => {
  const profile = useProfileMetadata(pubkey);
  return (
-    <span className="cursor-pointer text-fuchsia-500">
-      @{profile?.name || profile?.username || truncate(pubkey, 16, ' .... ')}
-    </span>
+    <span className="cursor-pointer text-fuchsia-500">@{profile?.name || profile?.username || shortenKey(pubkey)}</span>
  );
 };
--- a/src/components/user/mini.tsx
+++ b/src/components/user/mini.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 export const UserMini = ({ pubkey }: { pubkey: string }) => {
  const profile = useProfileMetadata(pubkey);
@ -19,7 +19,7 @@ export const UserMini = ({ pubkey }: { pubkey: string }) => {
        />
      </div>
      <span className="text-xs font-medium leading-none text-zinc-500">
-        Replying to {profile?.name || truncate(pubkey, 16, ' .... ')}
+        Replying to {profile?.name || shortenKey(pubkey)}
      </span>
    </div>
  );
--- a/src/components/user/quoteRepost.tsx
+++ b/src/components/user/quoteRepost.tsx
@ -3,7 +3,7 @@ import { ImageWithFallback } from '@components/imageWithFallback';
 import { DEFAULT_AVATAR } from '@stores/constants';

 import { useProfileMetadata } from '@utils/hooks/useProfileMetadata';
-import { truncate } from '@utils/truncate';
+import { shortenKey } from '@utils/shortenKey';

 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
@ -25,7 +25,7 @@ export const UserQuoteRepost = ({ pubkey, time }: { pubkey: string; time: number
      </div>
      <div className="flex items-baseline gap-2 text-sm">
        <h5 className="font-bold leading-tight group-hover:underline">
-          {profile?.display_name || profile?.name || truncate(pubkey, 16, ' .... ')} reposted
+          {profile?.display_name || profile?.name || shortenKey(pubkey)} reposted
        </h5>
        <span className="leading-tight text-zinc-500">·</span>
        <span className="text-zinc-500">{dayjs().to(dayjs.unix(time))}</span>
--- a/src/utils/bindings.ts
+++ b/src/utils/bindings.ts
@ -68,6 +68,7 @@ export function getChats(data: GetChatData) {
  return invoke<Chat[]>('get_chats', { data });
 }

+export type GetLatestNoteData = { date: number };
 export type Note = {
  id: number;
  eventId: string;
@ -80,17 +81,8 @@ export type Note = {
  createdAt: number;
  accountId: number;
 };
+export type GetActiveChannelData = { active: boolean };
 export type CreateChannelData = { event_id: string; content: string; account_id: number };
-export type CreatePlebData = { pleb_id: string; pubkey: string; kind: number; metadata: string; account_id: number };
-export type Chat = { id: number; pubkey: string; createdAt: number; accountId: number };
-export type Account = { id: number; pubkey: string; privkey: string; active: boolean; metadata: string };
-export type GetChannelData = { limit: number; offset: number };
-export type GetLatestNoteData = { date: number };
-export type GetPlebData = { account_id: number; kind: number };
-export type CreateAccountData = { pubkey: string; privkey: string; metadata: string };
-export type GetPlebPubkeyData = { pubkey: string };
-export type Channel = { id: number; eventId: string; content: string; active: boolean; accountId: number };
-export type GetChatData = { account_id: number };
 export type CreateNoteData = {
  event_id: string;
  pubkey: string;
@ -102,9 +94,17 @@ export type CreateNoteData = {
  created_at: number;
  account_id: number;
 };
-export type UpdateChannelData = { event_id: string; active: boolean };
-export type Pleb = { id: number; plebId: string; pubkey: string; kind: number; metadata: string; accountId: number };
-export type CreateChatData = { pubkey: string; created_at: number; account_id: number };
-export type GetNoteData = { date: number; limit: number; offset: number };
-export type GetActiveChannelData = { active: boolean };
+export type GetPlebData = { account_id: number; kind: number };
+export type CreatePlebData = { pleb_id: string; pubkey: string; kind: number; metadata: string; account_id: number };
+export type Chat = { id: number; pubkey: string; createdAt: number; accountId: number };
+export type Account = { id: number; pubkey: string; privkey: string; active: boolean; metadata: string };
 export type GetNoteByIdData = { event_id: string };
+export type GetPlebPubkeyData = { pubkey: string };
+export type GetChatData = { account_id: number };
+export type GetNoteData = { date: number; limit: number; offset: number };
+export type Channel = { id: number; eventId: string; content: string; active: boolean; accountId: number };
+export type UpdateChannelData = { event_id: string; active: boolean };
+export type CreateChatData = { pubkey: string; created_at: number; account_id: number };
+export type CreateAccountData = { pubkey: string; privkey: string; metadata: string };
+export type GetChannelData = { limit: number; offset: number };
+export type Pleb = { id: number; plebId: string; pubkey: string; kind: number; metadata: string; accountId: number };