chore: clean up

2024-04-24 15:21:13 +07:00
parent f027eae52d
commit 61d1f095d4
10 changed files with 42 additions and 399 deletions
--- a/packages/ark/package.json
+++ b/packages/ark/package.json
@@ -4,38 +4,14 @@
 	"private": true,
 	"main": "./src/index.ts",
 	"dependencies": {
-		"@getalby/sdk": "^3.5.0",
-		"@lume/icons": "workspace:^",
 		"@lume/utils": "workspace:^",
-		"@radix-ui/react-avatar": "^1.0.4",
-		"@radix-ui/react-collapsible": "^1.0.3",
-		"@radix-ui/react-dialog": "^1.0.5",
-		"@radix-ui/react-dropdown-menu": "^2.0.6",
-		"@radix-ui/react-hover-card": "^1.0.7",
-		"@radix-ui/react-popover": "^1.0.7",
-		"@radix-ui/react-tooltip": "^1.0.7",
 		"@tanstack/react-query": "^5.31.0",
-		"@tanstack/react-router": "^1.29.2",
-		"get-urls": "^12.1.0",
-		"media-chrome": "^3.2.1",
-		"minidenticons": "^4.2.1",
-		"nanoid": "^5.0.7",
-		"qrcode.react": "^3.1.0",
-		"re-resizable": "^6.9.14",
-		"react": "^18.2.0",
-		"react-currency-input-field": "^3.8.0",
-		"react-i18next": "^14.1.0",
-		"react-string-replace": "^1.1.1",
-		"sonner": "^1.4.41",
-		"string-strip-html": "^13.4.8",
-		"virtua": "^0.30.2"
+		"react": "^18.2.0"
 	},
 	"devDependencies": {
-		"@lume/tailwindcss": "workspace:^",
 		"@lume/tsconfig": "workspace:^",
 		"@lume/types": "workspace:^",
 		"@types/react": "^18.2.79",
-		"tailwindcss": "^3.4.3",
 		"typescript": "^5.4.5"
 	}
 }
--- a/packages/icons/src/download.tsx
+++ b/packages/icons/src/download.tsx
@@ -1,24 +1,17 @@
 import { SVGProps } from "react";

 export function DownloadIcon(
-	props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>,
+  props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>,
 ) {
-	return (
-		<svg
-			xmlns="http://www.w3.org/2000/svg"
-			width="24"
-			height="24"
-			fill="none"
-			viewBox="0 0 24 24"
-			{...props}
-		>
-			<path
-				stroke="currentColor"
-				strokeLinecap="round"
-				strokeLinejoin="round"
-				strokeWidth="2"
-				d="M3 15a5 5 0 005 5h8a5 5 0 005-5M9 12.188a15 15 0 002.556 2.655c.13.104.287.157.444.157m3-2.812a14.998 14.998 0 01-2.556 2.655A.704.704 0 0112 15m0 0V4"
-			/>
-		</svg>
-	);
+  return (
+    <svg width="24" height="24" fill="none" viewBox="0 0 24 24" {...props}>
+      <path
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        strokeWidth="1.5"
+        d="M20.25 14.75v3.5a2 2 0 0 1-2 2H5.75a2 2 0 0 1-2-2v-3.5M12 15V3.75M12 15l-3.5-3.5M12 15l3.5-3.5"
+      />
+    </svg>
+  );
 }
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -8,7 +8,6 @@
 		"@lume/ark": "workspace:^",
 		"@lume/icons": "workspace:^",
 		"@lume/utils": "workspace:^",
-		"@nostr-dev-kit/ndk": "^2.7.1",
 		"@radix-ui/react-accordion": "^1.1.2",
 		"@radix-ui/react-alert-dialog": "^1.0.5",
 		"@radix-ui/react-avatar": "^1.0.4",
--- a/packages/ui/src/note/content.tsx
+++ b/packages/ui/src/note/content.tsx
@@ -18,13 +18,7 @@ import { ImagePreview } from "./preview/image";
 import reactStringReplace from "react-string-replace";
 import { useRouteContext } from "@tanstack/react-router";

-export function NoteContent({
-  compact = true,
-  className,
-}: {
-  compact?: boolean;
-  className?: string;
-}) {
+export function NoteContent({ className }: { className?: string }) {
  const { settings }: { settings: Settings } = useRouteContext({
    strict: false,
  });
@@ -32,12 +26,6 @@ export function NoteContent({
  const content = useMemo(() => {
    const text = event.content.trim();
    const words = text.split(/( |\n)/);
-
-    // @ts-ignore, kaboom !!!
-    let parsedContent: ReactNode[] = compact
-      ? text.replace(/\n\s*\n/g, "\n")
-      : text;
-
    const hashtags = words.filter((word) => word.startsWith("#"));
    const events = words.filter((word) =>
      NOSTR_EVENTS.some((el) => word.startsWith(el)),
@@ -46,6 +34,8 @@ export function NoteContent({
      NOSTR_MENTIONS.some((el) => word.startsWith(el)),
    );

+    let parsedContent: ReactNode[] | string = text;
+
    try {
      if (hashtags.length) {
        for (const hashtag of hashtags) {
@@ -125,12 +115,6 @@ export function NoteContent({
        },
      );

-      if (compact) {
-        parsedContent = reactStringReplace(parsedContent, /\n*\n/g, () => (
-          <div key={nanoid()} className="h-1.5" />
-        ));
-      }
-
      return parsedContent;
    } catch (e) {
      return text;
--- a/packages/ui/src/note/preview/image.tsx
+++ b/packages/ui/src/note/preview/image.tsx
@@ -2,9 +2,11 @@ import { CheckCircleIcon, DownloadIcon } from "@lume/icons";
 import { downloadDir } from "@tauri-apps/api/path";
 import { WebviewWindow } from "@tauri-apps/api/webviewWindow";
 import { download } from "@tauri-apps/plugin-upload";
-import { SyntheticEvent, useState } from "react";
+import { useRef, useState } from "react";
+import { toast } from "sonner";

 export function ImagePreview({ url }: { url: string }) {
+  const imgRef = useRef<HTMLImageElement>(null);
  const [downloaded, setDownloaded] = useState(false);

  const downloadImage = async (e: { stopPropagation: () => void }) => {
@@ -17,20 +19,24 @@ export function ImagePreview({ url }: { url: string }) {

      setDownloaded(true);
    } catch (e) {
-      console.error(e);
+      toast.error(String(e));
    }
  };

  const open = async () => {
-    const name = new URL(url).pathname.split("/").pop();
-    return new WebviewWindow("image-viewer", {
+    const label = new URL(url).pathname
+      .split("/")
+      .pop()
+      .replace(/[^a-zA-Z ]/g, "");
+    const window = new WebviewWindow(`viewer-${label}`, {
      url,
-      title: name,
+      title: "Image Viewer",
+      width: imgRef?.current.width || 600,
+      height: imgRef?.current.height || 600,
+      titleBarStyle: "overlay",
    });
-  };

-  const fallback = (event: SyntheticEvent<HTMLImageElement, Event>) => {
-    event.currentTarget.src = "/fallback-image.jpg";
+    return window;
  };

  return (
@@ -42,21 +48,21 @@ export function ImagePreview({ url }: { url: string }) {
      <img
        src={url}
        alt={url}
+        ref={imgRef}
        loading="lazy"
        decoding="async"
        style={{ contentVisibility: "auto" }}
-        onError={fallback}
        className="h-auto w-full object-cover"
      />
      <button
        type="button"
        onClick={(e) => downloadImage(e)}
-        className="absolute right-2 top-2 z-20 hidden size-8 items-center justify-center rounded-md bg-white/10 text-white/70 backdrop-blur-2xl hover:bg-blue-500 hover:text-white group-hover:inline-flex"
+        className="absolute right-2 top-2 z-20 hidden size-8 items-center justify-center rounded-md bg-black/10 text-white/70 backdrop-blur-2xl hover:bg-blue-500 hover:text-white group-hover:inline-flex"
      >
        {downloaded ? (
-          <CheckCircleIcon className="size-4" />
+          <CheckCircleIcon className="size-5" />
        ) : (
-          <DownloadIcon className="size-4" />
+          <DownloadIcon className="size-5" />
        )}
      </button>
    </div>