Merge pull request #10 from Asqit/devel

Asqit · web-flow · commit 3c8d8a3034a3 · 2025-06-28T09:27:07.000+02:00
Devel
diff --git a/.DS_Store b/.DS_Store
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,19 +1,10 @@
 
-## 0.2.0 - 23.06.2025
+## 0.3.0 - 28.06.2025
 ### Added
--
-## 0.1.4 - 17.06.2025
-### Added
--
-## 0.1.3 - 17.06.2025
-### Added
--
-## 0.1.2 - 17.06.2025
-### Added
--
-## 0.1.1 - 17.06.2025
-### Added
--
-## 0.1.0 - 17.06.2025
+-## 0.2.0 - 23.06.2025
+
 ### Added
--
+
+- Better macOS icon
+- Much improved UI (redesign)
+- Added common file types to combobox
diff --git a/README.md b/README.md
@@ -1,29 +1,23 @@
-# ⚓ Charon — Your Ferryman for File Formats
+# Charon
 
-**Charon** is a simple, sleek, desktop app for converting media files (images, videos, etc.).
-Built with [Wails](https://wails.io/) and powered by [FFmpeg](https://ffmpeg.org/), Charon lets you drag, drop, convert — and chill. 😎
+**Charon** is a simple, sleek, desktop app for converting media files (images, videos, audio). Built with [Wails](https://wails.io/) and powered by [FFmpeg](https://ffmpeg.org/), Charon lets you drag, drop, convert — and chill.
 
-## ✨ Features
+## Features
 
-- 🖱️ Drag & drop interface
-- 🔁 Per-file format selection
-- ⚙️ FFmpeg-powered conversion
+- Sleek & simple UI
+- Drag & drop interface
+- Per-file format selection
+- Uses FFmpeg for conversions
 
-## 📦 Installation
+## Development Setup
 
-*(Coming soon — once builds are automated)*
-
-
-## 🚀 Development Setup
-
-### Prerequisites
+### Prerequisities
 
 - Go 1.23+
-- Node.js + npm
-- FFmpeg (shipped with the app)
+- JavaScript runtime and NPM compatible package manager
+- FFmpeg (included in the code)
 - Wails CLI
 
-
 ### Clone & Run
 ```bash
 $ git clone https://github.com/asqit/charon.git
@@ -36,8 +30,7 @@ $ wails dev
 $ wails build
 ```
 
-
-## 🧑‍💻 Author
+## Author
 
 Made by a Czech dev who appreciates good beer and clean code.
 
diff --git a/VERSION b/VERSION
@@ -1 +1 @@
-0.2.0
+0.3.0
diff --git a/build/.DS_Store b/build/.DS_Store
diff --git a/bump.py b/bump.py
@@ -6,7 +6,8 @@
 
 def read_version() -> str:
     with open("VERSION", "r") as file:
-        return file.readline() # X.Y.Z
+        return file.readline()  # X.Y.Z
+
 
 def write_version(version: str) -> None:
     with open("VERSION", "w") as file:
@@ -43,7 +44,7 @@ def bump(current: str, part: str) -> str:
 def git_tag(version) -> None:
     subprocess.run(["git", "add", "."])
     subprocess.run(["git", "commit", "-m", f"Release v{version}"])
-    subprocess.run(["git", "tag", f"v{version}"])
+    subprocess.run(["git", "tag", "-a", f"v{version}", "-m", f"Release v{version}"])
     subprocess.run(["git", "push", "--follow-tags"])
 
 
@@ -59,7 +60,6 @@ def main() -> None:
     add_changelog_record(new_version)
     git_tag(new_version)
 
-
     print(f"✔️ Bumped to v{new_version}")
 
 
diff --git a/frontend/bun.lock b/frontend/bun.lock
diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
@@ -0,0 +1,26 @@
+import js from "@eslint/js";
+import globals from "globals";
+import tseslint from "typescript-eslint";
+import pluginReact from "eslint-plugin-react";
+import { defineConfig } from "eslint/config";
+
+export default defineConfig([
+  {
+    files: ["**/*.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
+    plugins: { js },
+    extends: ["js/recommended"],
+    rules: {
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        { argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
+      ],
+    },
+  },
+  {
+    files: ["**/*.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
+    languageOptions: { globals: globals.browser },
+  },
+  tseslint.configs.recommended,
+  pluginReact.configs.flat.recommended,
+  pluginReact.configs.flat["jsx-runtime"],
+]);
diff --git a/frontend/package.json b/frontend/package.json
@@ -34,12 +34,17 @@
     "zod": "^3.24.4"
   },
   "devDependencies": {
+    "@eslint/js": "^9.29.0",
     "@types/node": "^22.15.18",
     "@types/react": "19.1.4",
     "@types/react-dom": "19.1.5",
     "@vitejs/plugin-react": "^4.4.1",
+    "eslint": "^9.29.0",
+    "eslint-plugin-react": "^7.37.5",
+    "globals": "^16.2.0",
     "tw-animate-css": "^1.3.0",
     "typescript": "^4.6.4",
+    "typescript-eslint": "^8.35.0",
     "vite": "^6.3.5"
   }
 }
diff --git a/frontend/package.json.md5 b/frontend/package.json.md5
@@ -1 +1 @@
-5c94cfa73507b28e026152f3055332ec
+a00f718f23997f496e51432058bae9d3
diff --git a/frontend/src/components/share/drop-zone/components/drop-area.tsx b/frontend/src/components/share/drop-zone/components/drop-area.tsx
@@ -4,10 +4,21 @@ import { ClickToSelectFiles } from "wailsjs/go/main/App";
 import { filesContext } from "../context/files-context";
 
 export function DropArea() {
-  const { files, setFiles } = useContext(filesContext);
+  const { setFiles } = useContext(filesContext);
+
   const handleClickSelect = async () => {
     const newFiles = await ClickToSelectFiles();
-    setFiles([...new Set([...files, ...newFiles.map((p) => ({ path: p }))])]);
+
+    setFiles((prev) =>
+      [...new Set([...newFiles, ...prev.map((p) => p.path)])].map((item) => {
+        const exists = prev.find((v) => v.path === item);
+        if (exists) {
+          return exists;
+        }
+
+        return { path: item };
+      })
+    );
   };
 
   return (
diff --git a/frontend/src/components/share/drop-zone/components/file-table.tsx b/frontend/src/components/share/drop-zone/components/file-table.tsx
@@ -2,6 +2,7 @@ import { TableItem } from "./table-item";
 import { useContext } from "react";
 import { Button } from "@/components/ui/button";
 import { filesContext } from "../context/files-context";
+import { ClickToSelectFiles } from "wailsjs/go/main/App";
 
 interface Props {
   submitCallback(): void;
@@ -10,6 +11,21 @@ interface Props {
 export function FileTable({ submitCallback }: Props) {
   const { files, setFiles } = useContext(filesContext);
 
+  const handleClickSelect = async () => {
+    const newFiles = await ClickToSelectFiles();
+
+    setFiles((prev) =>
+      [...new Set([...newFiles, ...prev.map((p) => p.path)])].map((item) => {
+        const exists = prev.find((v) => v.path === item);
+        if (exists) {
+          return exists;
+        }
+
+        return { path: item };
+      })
+    );
+  };
+
   return (
     <div className="flex flex-col gap-4 w-full h-full drop-zone">
       <table className="bg-background border border-muted animate-fadeIn">
@@ -31,31 +47,38 @@ export function FileTable({ submitCallback }: Props) {
               key={path}
               path={path}
               setOutputFormat={(format) =>
-                setFiles(
-                  files.map((file) => {
+                setFiles((p) =>
+                  [...p].map((file) => {
                     if (file.path === path) {
-                      file.format = format;
+                      return { ...file, format };
                     }
                     return file;
-                  }),
+                  })
                 )
               }
-              deleteSelf={() => setFiles(files.filter((f) => f.path === path))}
+              deleteSelf={() =>
+                setFiles((prev) => [...prev].filter((f) => f.path !== path))
+              }
             />
           ))}
         </tbody>
-      </table>{" "}
+      </table>
       {files.length > 0 && (
-        <div className="flex items-center justify-end gap-2">
+        <div className="flex items-center justify-between gap-2">
           <Button variant={"destructive"} onClick={() => setFiles([])}>
             Remove All
           </Button>
 
-          <Button onClick={submitCallback} disabled={files.length === 0}>
-            {files.length > 1
-              ? `Convert (${files.length}) files`
-              : "Convert file"}
-          </Button>
+          <div className="space-x-2">
+            <Button variant={"outline"} onClick={handleClickSelect}>
+              Add File(s)
+            </Button>
+            <Button onClick={submitCallback} disabled={files.length === 0}>
+              {files.length > 1
+                ? `Convert (${files.length}) files`
+                : "Convert file"}
+            </Button>
+          </div>
         </div>
       )}
     </div>
diff --git a/frontend/src/components/share/drop-zone/components/table-item.tsx b/frontend/src/components/share/drop-zone/components/table-item.tsx
@@ -1,6 +1,6 @@
 import { usePromise } from "@/usePromise";
 import { Loader, Eraser } from "lucide-react";
-import { useCallback, useEffect, useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import { GetFileType } from "wailsjs/go/main/App";
 import { Button } from "@/components/ui/button";
 import { typeLookup } from "@/utils/type-lookup";
@@ -30,15 +30,18 @@ export function TableItem({ path, deleteSelf, setOutputFormat }: Props) {
         {metadata[metadata.length - 1].trim()}
       </td>
       <td className="px-4 py-2 border-b border-muted">
-        {isLoading ? "..." : result?.mimeType}
+        {isLoading
+          ? "..."
+          : status === "error"
+            ? "unknown file type"
+            : result?.mimeType}
       </td>
       <td className="px-4 py-2 border-b border-muted">
         {(() => {
           switch (status) {
             case "loading":
               return <Loader className="animate-spin" />;
             case "error":
-              return <span className="text-red-600">Error Occurred</span>;
             case "success":
               return result && result?.outputFormats?.length > 0 ? (
                 <TagCombo
diff --git a/frontend/src/components/share/drop-zone/context/files-context.ts b/frontend/src/components/share/drop-zone/context/files-context.ts
@@ -2,7 +2,9 @@ import type { ToConvert } from "@/utils/types";
 import { createContext } from "react";
 
 interface FilesContext {
-  setFiles(payload: ToConvert[]): void;
+  setFiles(
+    payload: ToConvert[] | ((previous: ToConvert[]) => ToConvert[]),
+  ): void;
   files: ToConvert[];
 }
 
diff --git a/frontend/src/components/share/drop-zone/context/files-provider.tsx b/frontend/src/components/share/drop-zone/context/files-provider.tsx
diff --git a/frontend/src/components/share/drop-zone/index.tsx b/frontend/src/components/share/drop-zone/index.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useState, useContext } from "react";
+import { useCallback, useEffect, useState } from "react";
 import { OnFileDrop } from "wailsjs/runtime/runtime";
 import { DropArea } from "./components/drop-area";
 import { Loading } from "./components/loading";
@@ -13,31 +13,26 @@ type State = "idle" | "loading" | "error" | "success";
 
 export function DropZone() {
   const [files, setFiles] = useState<ToConvert[]>([]);
-  const [error, setError] = useState<string>("internal server error");
+  const [error, setError] = useState<string>("");
   const [state, setState] = useState<State>("idle");
   const [time, setTime] = useState<number>(-1);
 
   const handleSubmit = useCallback(async () => {
-    const start = performance.now();
-    try {
-      setState("loading");
-      const destination = await AskForSaveLocation();
-      const isSuccess = await ConvertFiles(
-        destination,
-        files.map((i) => ({ path: i.path, format: i.format ?? "" })),
-      );
-      if (!isSuccess) {
-        setState("error");
-        setError((error as unknown as any)?.message);
-        return;
-      }
-      setState("success");
-    } catch (error) {
+    setState("loading");
+    const destination = await AskForSaveLocation();
+    const startTime = performance.now();
+    const isSuccess = await ConvertFiles(
+      destination,
+      files.map((i) => ({ path: i.path, format: i.format ?? "" }))
+    );
+    if (!isSuccess) {
       setState("error");
-      setError((error as unknown as any)?.message);
-    } finally {
-      setTime(performance.now() - start);
+      setError("An error occurred while converting the files.");
+      return;
     }
+
+    setState("success");
+    setTime(performance.now() - startTime);
   }, [files]);
 
   const handleReset = () => {
@@ -47,7 +42,16 @@ export function DropZone() {
 
   useEffect(() => {
     OnFileDrop((_x, _y, paths) => {
-      setFiles([...new Set([...files, ...paths.map((p) => ({ path: p }))])]);
+      setFiles((prev) =>
+        [...new Set([...paths, ...prev.map((p) => p.path)])].map((item) => {
+          const exists = prev.find((v) => v.path === item);
+          if (exists) {
+            return exists;
+          }
+
+          return { path: item };
+        })
+      );
     }, true);
   }, []);
 
diff --git a/main.go b/main.go

Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-5c94cfa73507b28e026152f3055332ec`
	`1`	`+a00f718f23997f496e51432058bae9d3`