frontend/src/components/editor/ComposeCanvas.tsx

@@ -122,7 +122,7 @@ export function ComposeCanvas({
   // re-calculates height based on content and applies the zoom transform
   const syncViewport = useCallback(() => {
     if (!(fabricRef.current && wrapperRef.current)) return;
-    textboxRef.current.initDimensions();
+    textboxRef.current?.initDimensions();
 
     const minHeight = initialData?.canvasHeight ?? DEFAULT_LOGICAL_HEIGHT;
     logicalSizeRef.current.height = measureLogicalContentHeight(

frontend/src/components/editor/PostSealModal.tsx

@@ -63,7 +63,11 @@ export function PostSealModal({
               type="button"
               data-testid="view-letter-btn"
               className="btn btn-primary btn-sm"
-              onClick={() => navigate(PATHS.read(sealedTargetId!))}
+              onClick={() => {
+                if (sealedTargetId) {
+                  navigate(PATHS.read(sealedTargetId));
+                }
+              }}
             >
               View letter
             </button>

frontend/src/hooks/useAuth.ts

@@ -32,7 +32,7 @@ export const useAuth = () => {
   const logout = async () => {
     try {
       await api.post(endpoints.LOGOUT);
-    } catch (_error) {
+    } catch {
     } finally {
       clearAuth();
       setMasterKey(null);

frontend/src/pages/Activate.tsx

@@ -7,99 +7,99 @@ import { endpoints, replacePathParams } from "../config/endpoints";
 import { ROUTES } from "../config/routes";
 
 export default function Activate() {
-  const { uidb64, token } = useParams();
+    const { uidb64, token } = useParams();
-  const [status, setStatus] = useState<"loading" | "success" | "error">(
+    const [status, setStatus] = useState<"loading" | "success" | "error">(
-    "loading",
+        "loading",
-  );
+    );
-  const hasCalled = useRef(false);
+    const hasCalled = useRef(false);
-  const navigate = useNavigate();
+    const navigate = useNavigate();
 
-  useEffect(() => {
+    useEffect(() => {
-    if (!(uidb64 && token) || hasCalled.current) return;
+        if (!(uidb64 && token) || hasCalled.current) return;
-    hasCalled.current = true;
+        hasCalled.current = true;
 
-    const activateAccount = async () => {
+        const activateAccount = async () => {
-      try {
+            try {
-        const url = replacePathParams(endpoints.ACTIVATE, {
+                const url = replacePathParams(endpoints.ACTIVATE, {
-          uidb64,
+                    uidb64,
-          token,
+                    token,
-        });
+                });
-        await publicApi.get(url);
+                await publicApi.get(url);
-        setStatus("success");
+                setStatus("success");
-      } catch (_err) {
+            } catch {
-        setStatus("error");
+                setStatus("error");
-      }
-    };
-
-    activateAccount();
-  }, [uidb64, token]);
-
-  return (
-    <div className="glass-card w-full max-w-sm p-8 text-center fade-zoom">
-      {status === "loading" && (
-        <div className="flex flex-col items-center gap-4 py-8">
-          <span className="loading loading-spinner loading-lg text-primary" />
-          <p className="text-sm opacity-70">Activating your account...</p>
-        </div>
-      )}
-
-      {status === "success" && (
-        <div className="flex flex-col items-center gap-6 duration-500">
-          <div className="bg-success/10 p-4 rounded-full">
-            <CheckCircleIcon
-              size={64}
-              weight="duotone"
-              className="text-success"
-            />
-          </div>
-          <h2
-            data-testid="activation-success-header"
-            className="font-display text-xl text-success"
-          >
-            You're in.
-          </h2>
-          <p className="opacity-70 leading-relaxed">
-            Welcome to <Logo scale={1} />
-            <br />
-            Just one more step and you can start writing timeless letters.
-          </p>
-          <div className="divider opacity-10 my-0"></div>
-          <button
-            type="button"
-            data-testid="start-writing-btn"
-            className="btn btn-primary w-full shadow-lg"
-            onClick={() =>
-              navigate(ROUTES.LOGIN, {
-                state: { firstTime: true },
-                replace: true,
-              })
             }
-          >
+        };
-            I'm ready
-          </button>
-        </div>
-      )}
 
-      {status === "error" && (
+        activateAccount();
-        <div className="flex flex-col items-center gap-6 animate-in fade-in zoom-in duration-500">
+    }, [uidb64, token]);
-          <div className="bg-error/10 p-4 rounded-full">
+
-            <XCircleIcon size={64} weight="duotone" className="text-error" />
+    return (
-          </div>
+        <div className="glass-card w-full max-w-sm p-8 text-center fade-zoom">
-          <h2 className="font-display text-xl text-error">Activation Failed</h2>
+            {status === "loading" && (
-          <p className="opacity-70 leading-relaxed">
+                <div className="flex flex-col items-center gap-4 py-8">
-            The link might be expired or already used. Please try registering
+                    <span className="loading loading-spinner loading-lg text-primary" />
-            again.
+                    <p className="text-sm opacity-70">Activating your account...</p>
-          </p>
+                </div>
-          <div className="divider opacity-10 my-0"></div>
+            )}
-          <button
+
-            type="button"
+            {status === "success" && (
-            className="btn btn-ghost w-full"
+                <div className="flex flex-col items-center gap-6 duration-500">
-            onClick={() => navigate(ROUTES.ONBOARD)}
+                    <div className="bg-success/10 p-4 rounded-full">
-          >
+                        <CheckCircleIcon
-            Register Again
+                            size={64}
-          </button>
+                            weight="duotone"
+                            className="text-success"
+                        />
+                    </div>
+                    <h2
+                        data-testid="activation-success-header"
+                        className="font-display text-xl text-success"
+                    >
+                        You're in.
+                    </h2>
+                    <p className="opacity-70 leading-relaxed">
+                        Welcome to <Logo scale={1} />
+                        <br />
+                        Just one more step and you can start writing timeless letters.
+                    </p>
+                    <div className="divider opacity-10 my-0"></div>
+                    <button
+                        type="button"
+                        data-testid="start-writing-btn"
+                        className="btn btn-primary w-full shadow-lg"
+                        onClick={() =>
+                            navigate(ROUTES.LOGIN, {
+                                state: { firstTime: true },
+                                replace: true,
+                            })
+                        }
+                    >
+                        I'm ready
+                    </button>
+                </div>
+            )}
+
+            {status === "error" && (
+                <div className="flex flex-col items-center gap-6 animate-in fade-in zoom-in duration-500">
+                    <div className="bg-error/10 p-4 rounded-full">
+                        <XCircleIcon size={64} weight="duotone" className="text-error" />
+                    </div>
+                    <h2 className="font-display text-xl text-error">Activation Failed</h2>
+                    <p className="opacity-70 leading-relaxed">
+                        The link might be expired or already used. Please try registering
+                        again.
+                    </p>
+                    <div className="divider opacity-10 my-0"></div>
+                    <button
+                        type="button"
+                        className="btn btn-ghost w-full"
+                        onClick={() => navigate(ROUTES.ONBOARD)}
+                    >
+                        Register Again
+                    </button>
+                </div>
+            )}
         </div>
-      )}
+    );
-    </div>
-  );
 }