Merge pull request #301 from v0l/ui-bugs

UI bugs

package.json

@@ -7,4 +7,4 @@
     "build": "yarn workspace @snort/nostr build && yarn workspace @snort/app build",
     "start": "yarn workspace @snort/nostr build && yarn workspace @snort/app start"
   }
-}
+}

packages/app/src/Element/NoteCreator.css

@@ -20,6 +20,7 @@
   min-height: 120px;
   max-width: stretch;
   min-width: stretch;
+  max-height: 210px;
 }
 
 .note-creator textarea::placeholder {

packages/app/src/Element/Timeline.tsx

@@ -69,7 +69,7 @@ export default function Timeline({
   function eventElement(e: TaggedRawEvent) {
     switch (e.kind) {
       case EventKind.SetMetadata: {
-        return <ProfilePreview pubkey={e.pubkey} className="card" />;
+        return <ProfilePreview actions={<></>} pubkey={e.pubkey} className="card" />;
       }
       case EventKind.TextNote: {
         return <Note key={e.id} data={e} related={related.notes} ignoreModeration={ignoreModeration} />;
@@ -108,7 +108,7 @@ export default function Timeline({
             <ArrowUp />
           </div>
           {!inView && (
-            <div className="card latest-notes latest-notes-fixed pointer" onClick={() => onShowLatest(true)}>
+            <div className="card latest-notes latest-notes-fixed pointer fade-in" onClick={() => onShowLatest(true)}>
               {latestAuthors.slice(0, 3).map(p => {
                 return <ProfileImage pubkey={p} showUsername={false} linkToProfile={false} />;
               })}

packages/app/src/Pages/DonatePage.tsx

@@ -17,18 +17,16 @@ const Contributors = [
   bech32ToHex("npub148jmlutaa49y5wl5mcll003ftj59v79vf7wuv3apcwpf75hx22vs7kk9ay"), // liran cohen
   bech32ToHex("npub1xdtducdnjerex88gkg2qk2atsdlqsyxqaag4h05jmcpyspqt30wscmntxy"), // artur
   bech32ToHex("npub1vp8fdcyejd4pqjyrjk9sgz68vuhq7pyvnzk8j0ehlljvwgp8n6eqsrnpsw"), // samsamskies
+  bech32ToHex("npub179rec9sw2a5ngkr2wsjpjhwp2ksygjxn6uw5py9daj2ezhw3aw5swv3s6q"), // h3y6e - JA
 ];
 
 const Translators = [
-  bech32ToHex("npub179rec9sw2a5ngkr2wsjpjhwp2ksygjxn6uw5py9daj2ezhw3aw5swv3s6q"), // h3y6e - JA
   bech32ToHex("npub1s8zws5frm94esxnp9v6zf7vk60m3hum3305n78sr73t78kleus7q8zpwna"), // middlingphys - JA
   bech32ToHex("npub1z0ykz6lp3y8rjjntenns0ee02062g2f0n55u49w44xdemw35vcpsda5jhh"), // noraglyphs - JA
   bech32ToHex("npub13wa880se2h3l54k7x76edrkrt4p94sh4q090974mt0z6n09qtntqxp47uk"), // numpad0 - JA
 
   bech32ToHex("npub1ww8kjxz2akn82qptdpl7glywnchhkx3x04hez3d3rye397turrhssenvtp"), // Zoltan - HU
 
-  bech32ToHex("npub107jk7htfv243u0x5ynn43scq9wrxtaasmrwwa8lfu2ydwag6cx2quqncxg"), // verbiricha - ES
-
   bech32ToHex("npub1x8dzy9xegwmdk2vy30l8u08caspcqq2yzncxehdsa6kvnte9pr3qnt8pg4"), // solobalbo - FR
 
   bech32ToHex("npub1xwm9svxrlymymph0hka40zw9frg98m6adxmzcq26jhtm5gwlhjrshhgzfd"), // meitsjustme - ZH

packages/app/src/Pages/ProfilePage.css

@@ -224,13 +224,21 @@
 }
 
 .qr-modal .pfp .username {
-  text-align: center;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
 }
 
 .qr-modal canvas {
   border-radius: 10px;
 }
 
+.qr-modal .pfp .display-name {
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+
 .profile .zap-amount {
   font-weight: normal;
   margin-left: 4px;

packages/app/src/Pages/ProfilePage.tsx

@@ -259,7 +259,11 @@ export default function ProfilePage() {
         {showProfileQr && (
           <Modal className="qr-modal" onClose={() => setShowProfileQr(false)}>
             <ProfileImage pubkey={id} />
-            <QrCode data={`nostr:${hexToBech32(NostrPrefix.PublicKey, id)}`} link={undefined} className="m10" />
+            <QrCode
+              data={`nostr:${hexToBech32(NostrPrefix.PublicKey, id)}`}
+              link={undefined}
+              className=" m10 align-center"
+            />
           </Modal>
         )}
         {isMe ? (

packages/app/src/Pages/SearchPage.tsx

@@ -1,11 +1,13 @@
 import { useIntl, FormattedMessage } from "react-intl";
 import { useParams } from "react-router-dom";
+import ProfilePreview from "Element/ProfilePreview";
 import Timeline from "Element/Timeline";
 import { useEffect, useState } from "react";
 import { debounce } from "Util";
 import { router } from "index";
 import { SearchRelays } from "Const";
 import { System } from "@snort/nostr";
+import { useQuery } from "State/Users/Hooks";
 
 import messages from "./messages";
 
@@ -14,6 +16,7 @@ const SearchPage = () => {
   const { formatMessage } = useIntl();
   const [search, setSearch] = useState<string>();
   const [keyword, setKeyword] = useState<string | undefined>(params.keyword);
+  const allUsers = useQuery(keyword || "");
 
   useEffect(() => {
     if (keyword) {
@@ -55,6 +58,7 @@ const SearchPage = () => {
           onChange={e => setSearch(e.target.value)}
         />
       </div>
+      {keyword && allUsers?.slice(0, 3).map(u => <ProfilePreview actions={<></>} className="card" pubkey={u.pubkey} />)}
       {keyword && (
         <Timeline
           key={keyword}

packages/app/src/index.css

@@ -589,3 +589,25 @@ button.tall {
   display: flex;
   justify-content: flex-end;
 }
+
+.align-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.fade-in {
+  opacity: 1;
+  animation-name: fadeInOpacity;
+  animation-timing-function: ease-in;
+  animation-duration: 1s;
+}
+
+@keyframes fadeInOpacity {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}

packages/nostr/src/Links.ts

@@ -29,7 +29,7 @@ export function encodeTLV(hex: string, prefix: NostrPrefix, relays?: string[]) {
   const tl0 = [0, buf.length, ...buf];
   const tl1 =
     relays
-      ?.map(a => {
+      ?.map((a) => {
         const data = enc.encode(a);
         return [1, data.length, ...data];
       })

transifex.yml

@@ -1,7 +0,0 @@
-git:
-  filters:
-    - filter_type: file
-      file_format: STRUCTURED_JSON
-      source_language: en
-      source_file: 'packages/app/src/lang.json'
-      translation_files_expression: 'packages/app/src/translations/<lang>.json'