feat: use memo for some components

apps/desktop2/src/components/column.tsx

@@ -4,14 +4,14 @@ import { cn } from "@lume/utils";
 import { invoke } from "@tauri-apps/api/core";
 import { listen } from "@tauri-apps/api/event";
 import { getCurrent } from "@tauri-apps/api/webviewWindow";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { memo, useCallback, useEffect, useRef, useState } from "react";
 
 type WindowEvent = {
 	scroll: boolean;
 	resize: boolean;
 };
 
-export function Column({
+export const Column = memo(function Column({
 	column,
 	account,
 }: {
@@ -98,7 +98,7 @@ export function Column({
 			</div>
 		</div>
 	);
-}
+});
 
 function Header({ label, name }: { label: string; name: string }) {
 	const [title, setTitle] = useState(name);

apps/desktop2/src/components/conversation.tsx

@@ -1,10 +1,10 @@
-import { ThreadIcon } from "@lume/icons";
 import { Note } from "@/components/note";
-import { cn } from "@lume/utils";
+import { ThreadIcon } from "@lume/icons";
 import type { LumeEvent } from "@lume/system";
-import { useMemo } from "react";
+import { cn } from "@lume/utils";
+import { memo, useMemo } from "react";
 
-export function Conversation({
+export const Conversation = memo(function Conversation({
 	event,
 	className,
 }: {
@@ -44,4 +44,4 @@ export function Conversation({
 			</Note.Root>
 		</Note.Provider>
 	);
-}
+});

apps/desktop2/src/components/quote.tsx

@@ -1,9 +1,10 @@
-import { QuoteIcon } from "@lume/icons";
 import { Note } from "@/components/note";
-import { cn } from "@lume/utils";
+import { QuoteIcon } from "@lume/icons";
 import type { LumeEvent } from "@lume/system";
+import { cn } from "@lume/utils";
+import { memo } from "react";
 
-export function Quote({
+export const Quote = memo(function Quote({
 	event,
 	className,
 }: {
@@ -40,4 +41,4 @@ export function Quote({
 			</Note.Root>
 		</Note.Provider>
 	);
-}
+});

apps/desktop2/src/components/repost.tsx

@@ -1,11 +1,12 @@
-import { Spinner } from "@lume/ui";
 import { Note } from "@/components/note";
 import { User } from "@/components/user";
+import { type LumeEvent, NostrQuery } from "@lume/system";
+import { Spinner } from "@lume/ui";
 import { cn } from "@lume/utils";
 import { useQuery } from "@tanstack/react-query";
-import { type LumeEvent, NostrQuery } from "@lume/system";
+import { memo } from "react";
 
-export function RepostNote({
+export const RepostNote = memo(function RepostNote({
 	event,
 	className,
 }: {
@@ -78,4 +79,4 @@ export function RepostNote({
 			)}
 		</Note.Root>
 	);
-}
+});

apps/desktop2/src/components/text.tsx

@@ -1,14 +1,17 @@
-import { cn } from "@lume/utils";
 import { Note } from "@/components/note";
 import type { LumeEvent } from "@lume/system";
+import { cn } from "@lume/utils";
+import { memo } from "react";
 
-export function TextNote({
+export const TextNote = memo(function TextNote({
 	event,
 	className,
 }: {
 	event: LumeEvent;
 	className?: string;
 }) {
+	console.log("Rendered at: ", event.id, new Date().toLocaleTimeString());
+
 	return (
 		<Note.Provider event={event}>
 			<Note.Root
@@ -31,4 +34,4 @@ export function TextNote({
 			</Note.Root>
 		</Note.Provider>
 	);
-}
+});