mobile sign-in btn, save msg draft, more subtle error

packages/app/src/Element/ErrorOrOffline.tsx

@@ -1,6 +1,7 @@
 import { OfflineError } from "@snort/shared";
 import { Offline } from "./Offline";
 import classNames from "classnames";
+import Icon from "@/Icons/Icon";
 
 export function ErrorOrOffline({
   error,
@@ -14,6 +15,11 @@ export function ErrorOrOffline({
   if (error instanceof OfflineError) {
     return <Offline onRetry={onRetry} className={className} />;
   } else {
-    return <b className={classNames("error", className)}>{error.message}</b>;
+    return (
+      <div className={classNames("flex flex-row items-center px-4 py-3 gap-2", className)}>
+        <Icon name="alert-circle" size={24} />
+        <b>{error.message}</b>
+      </div>
+    );
   }
 }

packages/app/src/Element/Event/Create/NoteCreator.tsx

@@ -13,7 +13,7 @@ import ProfileImage from "@/Element/User/ProfileImage";
 import useFileUpload from "@/Upload";
 import Note from "@/Element/Event/Note";
 
-import { ClipboardEventHandler, DragEvent } from "react";
+import { ClipboardEventHandler, DragEvent, useEffect } from "react";
 import useLogin from "@/Hooks/useLogin";
 import { GetPowWorker } from "@/index";
 import AsyncButton from "@/Element/Button/AsyncButton";
@@ -37,6 +37,13 @@ export function NoteCreator() {
   const note = useNoteCreator();
   const relays = login.relays;
 
+  useEffect(() => {
+    const draft = localStorage.getItem("msgDraft");
+    if (draft) {
+      note.update(n => (n.note = draft));
+    }
+  }, []);
+
   async function buildNote() {
     try {
       note.update(v => (v.error = ""));
@@ -165,6 +172,7 @@ export function NoteCreator() {
         }),
       );
       note.update(n => n.reset());
+      localStorage.removeItem("msgDraft");
     }
   }
 
@@ -228,6 +236,7 @@ export function NoteCreator() {
   function onChange(ev: React.ChangeEvent<HTMLTextAreaElement>) {
     const { value } = ev.target;
     note.update(n => (n.note = value));
+    localStorage.setItem("msgDraft", value);
   }
 
   function cancel() {
@@ -647,7 +656,6 @@ export function NoteCreator() {
 
   function reset() {
     note.update(v => {
-      v.reset();
       v.show = false;
     });
   }

packages/app/src/Element/Feed/Timeline.tsx

@@ -95,7 +95,7 @@ const Timeline = (props: TimelineProps) => {
         displayAs={displayAs}
       />
       {(props.loadMore === undefined || props.loadMore === true) && (
-        <div className="flex items-center">
+        <div className="flex items-center px-3 py-4">
           <button type="button" onClick={() => feed.loadMore()}>
             <FormattedMessage defaultMessage="Load more" id="00LcfG" />
           </button>

packages/app/src/Login/Functions.ts

@@ -71,6 +71,7 @@ export function logout(id: string) {
   FollowsFeed.clear();
   Chats.clear();
   deleteRefCode();
+  localStorage.clear();
 }
 
 export function markNotificationsRead(state: LoginSession) {

packages/app/src/Pages/Layout/NotificationsHeader.tsx

@@ -1,7 +1,6 @@
 import { useNavigate } from "react-router-dom";
 import { base64 } from "@scure/base";
 import { unwrap } from "@snort/shared";
-import { FormattedMessage } from "react-intl";
 import Icon from "@/Icons/Icon";
 import useKeyboardShortcut from "@/Hooks/useKeyboardShortcut";
 import { isFormElement } from "@/SnortUtils";
@@ -63,8 +62,8 @@ const NotificationsHeader = () => {
 
   if (!publicKey) {
     return (
-      <button type="button" className="mr-3" onClick={() => navigate("/login/sign-up")}>
+      <button onClick={() => navigate("/login/sign-up")} className="mr-3 primary p-2">
-        <FormattedMessage defaultMessage="Sign Up" id="39AHJm" />
+        <Icon name="sign-in" size={20} className="md:hidden" />
       </button>
     );
   }

packages/app/src/index.css

@@ -647,10 +647,6 @@ div.form-col {
   gap: 10px;
 }
 
-.error {
-  color: var(--error);
-}
-
 .warning {
   color: var(--warning);
 }