chore: Update translations

packages/app/src/Pages/Deck.css

@@ -1,97 +1,97 @@
 .deck-layout {
-    display: flex;
-    height: 100vh;
-    overflow-y: hidden;
+  display: flex;
+  height: 100vh;
+  overflow-y: hidden;
 }
 
-.deck-layout .deck-cols  {
-    display: flex;
-    height: 100vh;
-    overflow-y: hidden;
-    overflow-x: auto;
+.deck-layout .deck-cols {
+  display: flex;
+  height: 100vh;
+  overflow-y: hidden;
+  overflow-x: auto;
 }
 
 .deck-layout .deck-cols .deck-col-header {
-    padding: 8px 16px;
-    border: 1px solid var(--border-color);
-    border-collapse: collapse;
-    font-size: 20px;
-    font-weight: 700;
-    min-height: 40px;
-    max-height: 40px;
+  padding: 8px 16px;
+  border: 1px solid var(--border-color);
+  border-collapse: collapse;
+  font-size: 20px;
+  font-weight: 700;
+  min-height: 40px;
+  max-height: 40px;
 }
 
 .deck-layout .deck-cols .deck-col-header:not(:last-of-type) {
-    border-right: 0;
+  border-right: 0;
 }
 
 .deck-layout .deck-cols > div {
-    display: flex;
-    flex-direction: column;
-    height: 100vh;
-    width: 550px;
-    min-width: 550px;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  width: 550px;
+  min-width: 550px;
 }
 
 .deck-layout .deck-cols > div > div:not(:first-of-type) {
-    overflow-y: scroll;
+  overflow-y: scroll;
 }
 
 .image-grid {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 4px;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 4px;
 }
 
 .image-grid > .media-note {
-    border: 1px solid var(--border-color);
-    background-image: var(--img);
-    background-position: center;
-    background-size: cover;
-    aspect-ratio: 1;
-    cursor: pointer;
+  border: 1px solid var(--border-color);
+  background-image: var(--img);
+  background-position: center;
+  background-size: cover;
+  aspect-ratio: 1;
+  cursor: pointer;
 }
 
 .thread-overlay .modal-body {
-    background-color: unset;
-    padding: 0;
-    width: 100vw;
-    height: 100vh;
-    display: flex;
-    flex-direction: row;
-    border-radius: unset;
-    gap: 16px;
-    --border-color: #3A3A3A;
+  background-color: unset;
+  padding: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: row;
+  border-radius: unset;
+  gap: 16px;
+  --border-color: #3a3a3a;
 }
 
 .thread-overlay .modal-body > div:last-of-type {
-    width: 550px;
-    min-width: 550px;
-    height: 100vh;
-    overflow-y: auto;
-    background-color: var(--gray-superdark);
+  width: 550px;
+  min-width: 550px;
+  height: 100vh;
+  overflow-y: auto;
+  background-color: var(--gray-superdark);
 }
 
 .thread-overlay .spotlight {
-    flex-grow: 1;
-    margin: auto;
-    text-align: center;
+  flex-grow: 1;
+  margin: auto;
+  text-align: center;
 }
 
 .thread-overlay .spotlight .details {
-    right: calc(28px + 550px + 16px);
+  right: calc(28px + 550px + 16px);
 }
 
 .thread-overlay .spotlight .right {
-    right: calc(24px + 550px + 16px);
+  right: calc(24px + 550px + 16px);
 }
 
 .thread-overlay .spotlight img,
 .thread-overlay .spotlight video {
-    max-width: calc(100vw - 550px - 16px);
+  max-width: calc(100vw - 550px - 16px);
 }
 
 .thread-overlay .main-content {
-    border: 0;
-    border-bottom: 1px solid var(--border-color);
-}
+  border: 0;
+  border-bottom: 1px solid var(--border-color);
+}

packages/app/src/Pages/DeckLayout.tsx

@@ -25,127 +25,147 @@ import useLogin from "Hooks/useLogin";
 type Cols = "notes" | "articles" | "media" | "streams" | "notifications";
 
 export function SnortDeckLayout() {
-    const login = useLogin();
-    const navigate = useNavigate();
-    const [thread, setThread] = useState<string>();
+  const login = useLogin();
+  const navigate = useNavigate();
+  const [thread, setThread] = useState<string>();
 
-    useLoginFeed();
-    useTheme();
-    useLoginRelays();
+  useLoginFeed();
+  useTheme();
+  useLoginRelays();
 
-    useEffect(() => {
-        if (!login.publicKey) {
-            navigate("/");
-        }
-    }, [login]);
+  useEffect(() => {
+    if (!login.publicKey) {
+      navigate("/");
+    }
+  }, [login]);
 
-    if (!login.publicKey) return null;
-    const cols = ["notes", "media", "notifications", "articles"] as Array<Cols>;
-    return <div className="deck-layout">
-        <DeckNav />
-        <div className="deck-cols">
-            {cols.map(c => {
-                switch (c) {
-                    case "notes": return <NotesCol />
-                    case "media": return <MediaCol setThread={setThread} />
-                    case "articles": return <ArticlesCol />
-                    case "notifications": return <NotificationsCol />
-                }
-            })}
-        </div>
-        {thread && <>
-            <Modal onClose={() => setThread(undefined)} className="thread-overlay">
-                <ThreadContextWrapper link={createNostrLink(NostrPrefix.Note, thread)}>
-                    <SpotlightFromThread onClose={() => setThread(undefined)} />
-                    <div>
-                        <Thread />
-                    </div>
-                </ThreadContextWrapper>
-            </Modal>
-        </>}
-        <Toaster />
+  if (!login.publicKey) return null;
+  const cols = ["notes", "media", "notifications", "articles"] as Array<Cols>;
+  return (
+    <div className="deck-layout">
+      <DeckNav />
+      <div className="deck-cols">
+        {cols.map(c => {
+          switch (c) {
+            case "notes":
+              return <NotesCol />;
+            case "media":
+              return <MediaCol setThread={setThread} />;
+            case "articles":
+              return <ArticlesCol />;
+            case "notifications":
+              return <NotificationsCol />;
+          }
+        })}
+      </div>
+      {thread && (
+        <>
+          <Modal onClose={() => setThread(undefined)} className="thread-overlay">
+            <ThreadContextWrapper link={createNostrLink(NostrPrefix.Note, thread)}>
+              <SpotlightFromThread onClose={() => setThread(undefined)} />
+              <div>
+                <Thread />
+              </div>
+            </ThreadContextWrapper>
+          </Modal>
+        </>
+      )}
+      <Toaster />
     </div>
+  );
 }
 
 function SpotlightFromThread({ onClose }: { onClose: () => void }) {
-    const thread = useContext(ThreadContext);
+  const thread = useContext(ThreadContext);
 
-    const parsed = thread.root ? transformTextCached(thread.root.id, thread.root.content, thread.root.tags) : [];
-    const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
+  const parsed = thread.root ? transformTextCached(thread.root.id, thread.root.content, thread.root.tags) : [];
+  const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
 
-    return <SpotlightMedia images={images.map(a => a.content)} idx={0} onClose={onClose} />
+  return <SpotlightMedia images={images.map(a => a.content)} idx={0} onClose={onClose} />;
 }
 
 function NotesCol() {
-    return (
-        <div>
-            <div className="deck-col-header flex">
-                <div className="flex f-1 g8">
-                    <Icon name="rows-01" size={24} />
-                    <FormattedMessage defaultMessage="Notes" />
-                </div>
-                <div className="f-1">
-                    <RootTabs base="/deck" />
-                </div>
-            </div>
-            <div>
-                <Outlet />
-            </div>
+  return (
+    <div>
+      <div className="deck-col-header flex">
+        <div className="flex f-1 g8">
+          <Icon name="rows-01" size={24} />
+          <FormattedMessage defaultMessage="Notes" />
         </div>
-    );
+        <div className="f-1">
+          <RootTabs base="/deck" />
+        </div>
+      </div>
+      <div>
+        <Outlet />
+      </div>
+    </div>
+  );
 }
 
 function ArticlesCol() {
-    return (
-        <div>
-            <div className="deck-col-header flex g8">
-                <Icon name="file-06" size={24} />
-                <FormattedMessage defaultMessage="Articles" />
-            </div>
-            <div>
-                <Articles />
-            </div>
-        </div>
-    );
+  return (
+    <div>
+      <div className="deck-col-header flex g8">
+        <Icon name="file-06" size={24} />
+        <FormattedMessage defaultMessage="Articles" />
+      </div>
+      <div>
+        <Articles />
+      </div>
+    </div>
+  );
 }
 
 function MediaCol({ setThread }: { setThread: (e: string) => void }) {
-    const { proxy } = useImgProxy();
-    return (
-        <div>
-            <div className="deck-col-header flex g8">
-                <Icon name="camera-lens" size={24} />
-                <FormattedMessage defaultMessage="Media" />
-            </div>
-            <div className="image-grid p">
-                <TimelineFollows postsOnly={true} liveStreams={false} noteFilter={e => {
-                    const parsed = transformTextCached(e.id, e.content, e.tags);
-                    const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
-                    return images.length > 0;
-                }} noteRenderer={e => {
-                    const parsed = transformTextCached(e.id, e.content, e.tags);
-                    const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
+  const { proxy } = useImgProxy();
+  return (
+    <div>
+      <div className="deck-col-header flex g8">
+        <Icon name="camera-lens" size={24} />
+        <FormattedMessage defaultMessage="Media" />
+      </div>
+      <div className="image-grid p">
+        <TimelineFollows
+          postsOnly={true}
+          liveStreams={false}
+          noteFilter={e => {
+            const parsed = transformTextCached(e.id, e.content, e.tags);
+            const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
+            return images.length > 0;
+          }}
+          noteRenderer={e => {
+            const parsed = transformTextCached(e.id, e.content, e.tags);
+            const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
 
-                    return <div className="media-note" key={e.id} style={{
-                        "--img": `url(${proxy(images[0].content)})`
-                    } as CSSProperties} onClick={() => setThread(e.id)}></div>
-                }} />
-            </div>
-        </div>
-    );
+            return (
+              <div
+                className="media-note"
+                key={e.id}
+                style={
+                  {
+                    "--img": `url(${proxy(images[0].content)})`,
+                  } as CSSProperties
+                }
+                onClick={() => setThread(e.id)}></div>
+            );
+          }}
+        />
+      </div>
+    </div>
+  );
 }
 
 function NotificationsCol() {
-
-    return (
-        <div>
-            <div className="deck-col-header flex g8">
-                <Icon name="bell-02" size={24} />
-                <FormattedMessage defaultMessage="Notifications" />
-            </div>
-            <div>
-                <NotificationsPage />
-            </div>
-        </div>
-    );
-}
+  return (
+    <div>
+      <div className="deck-col-header flex g8">
+        <Icon name="bell-02" size={24} />
+        <FormattedMessage defaultMessage="Notifications" />
+      </div>
+      <div>
+        <NotificationsPage />
+      </div>
+    </div>
+  );
+}

packages/app/src/Pages/Root.tsx

@@ -164,12 +164,12 @@ const DefaultTab = () => {
   const tab = publicKey ? preferences.defaultRootTab ?? `notes` : `trending/notes`;
   const elm = RootTabRoutes.find(a => a.path === tab)?.element;
   return elm;
-}
+};
 
 export const RootTabRoutes = [
   {
     path: "",
-    element: <DefaultTab />
+    element: <DefaultTab />,
   },
   {
     path: "global",