Merge pull request #6 from Creator-SN/vue3_llm

Vue3 llm

Author: aleversn

.github/workflows/release.yml

@@ -1,112 +1,97 @@
-# This is a basic workflow to help you get started with Actions
+name: Release
 
-name: Release ✈
-
-# Controls when the action will run.
 on:
-  # Triggers the workflow on push or pull request events but only for the master branch
   push:
     tags:
       - "v*"
-
-  # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
 
-# A workflow run is made up of one or more jobs that can run sequentially or in parallel
-jobs:
-  # This workflow contains a single job called "build"
-  window:
-    # The type of runner that the job will run on
-    runs-on: windows-latest
+permissions:
+  contents: write
 
-    # Steps represent a sequence of tasks that will be executed as part of the job
+jobs:
+  windows:
+    runs-on: windows-2022
     steps:
-      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
-      - uses: actions/checkout@v3
-
-      # Uses NodeJs Environment
-      - uses: actions/setup-node@v3
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Node
+        uses: actions/setup-node@v4
         with:
-          node-version: 14
-          registry-url: https://registry.npmjs.org/
-          cache: "yarn"
-
-      - name: install dependencies
+          node-version: 20
+          cache: yarn
+      - name: Setup Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: "3.11"
+      - name: Install dependencies
+        env:
+          npm_config_python: ${{ env.pythonLocation }}\python.exe
         run: yarn install --frozen-lockfile
-
-      - name: build win x64
-        run: yarn electron:build
-
-      - name: Get tag
-        id: tag
-        uses: dawidd6/action-get-tag@v1
-
-      - name: Rename
+      - name: Build Windows package
+        run: yarn build:win
+      - name: Collect Windows artifacts
+        shell: pwsh
         run: |
-          $v="${{steps.tag.outputs.tag}}".Substring(1)
-          mv "./dist_electron/MathFX Setup $v.exe" "MathFX-Setup-$v.exe"
-          mv "./dist_electron/MathFX Setup $v.exe.blockmap" "MathFX-Setup-$v.exe.blockmap"
-          mv "./dist_electron/latest.yml" "latest.yml"
-      - name: Upload Prerelease
-        uses: ncipollo/release-action@v1
-        if: ${{ contains(steps.tag.outputs.tag,'beta') }}
-        with:
-          allowUpdates: true
-          artifacts: "*.exe,*.blockmap,*.yml"
-          token: ${{ secrets.GITHUB_TOKEN }}
-          prerelease: true
-
-      - name: Upload Release
-        uses: ncipollo/release-action@v1
-        if: ${{ !contains(steps.tag.outputs.tag,'beta') }}
+          New-Item -ItemType Directory -Force -Path release | Out-Null
+          Get-ChildItem "dist" -File | Where-Object {
+            $_.Extension -in @('.exe', '.blockmap', '.yml')
+          } | Copy-Item -Destination release
+      - name: Upload Windows artifacts
+        uses: actions/upload-artifact@v4
         with:
-          allowUpdates: true
-          artifacts: "*.exe,*.blockmap,*.yml"
-          token: ${{ secrets.GITHUB_TOKEN }}
+          name: windows-release
+          path: release/*
 
   macos:
-    runs-on: macos-latest
+    runs-on: macos-14
     steps:
-      - uses: actions/checkout@v2
-
-      # Uses NodeJs Environment
-      - uses: actions/setup-node@v1
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Node
+        uses: actions/setup-node@v4
         with:
-          node-version: 14
-          registry-url: https://registry.npmjs.org/
-          cache: "yarn"
-
-      - name: install dependencies
+          node-version: 20
+          cache: yarn
+      - name: Setup Python
+        uses: actions/setup-python@v5
+        with:
+          python-version: "3.11"
+      - name: Install dependencies
+        env:
+          npm_config_python: ${{ env.pythonLocation }}/bin/python
         run: yarn install --frozen-lockfile
-
-      - name: build macos x64
-        run: yarn electron:build
-
-      - name: Get tag
-        id: tag
-        uses: dawidd6/action-get-tag@v1
-
-      - name: Rename
+      - name: Build macOS package
+        run: yarn build:mac
+      - name: Collect macOS artifacts
         run: |
-          v=${{steps.tag.outputs.tag}}
-          v=${v:1}
-          mv ./dist_electron/MathFX-$v.dmg ./MathFX-$v.dmg
-          mv ./dist_electron/MathFX-$v.dmg.blockmap ./MathFX-$v.dmg.blockmap
-          mv ./dist_electron/MathFX-$v-mac.zip ./MathFX-$v-mac.zip
-          mv ./dist_electron/latest-mac.yml ./latest-mac.yml
-      - name: Upload Prerelease
-        uses: ncipollo/release-action@v1
-        if: ${{ contains(steps.tag.outputs.tag,'beta') }}
+          mkdir -p release
+          find dist -maxdepth 1 -type f \( -name "*.dmg" -o -name "*.zip" -o -name "*.blockmap" -o -name "latest-mac.yml" \) -exec cp {} release/ \;
+      - name: Upload macOS artifacts
+        uses: actions/upload-artifact@v4
         with:
-          allowUpdates: true
-          artifacts: "*.dmg,*.blockmap,*.yml"
-          token: ${{ secrets.GITHUB_TOKEN }}
-          prerelease: true
+          name: macos-release
+          path: release/*
 
-      - name: Upload Release
+  publish:
+    needs: [windows, macos]
+    runs-on: ubuntu-latest
+    steps:
+      - name: Download Windows artifacts
+        uses: actions/download-artifact@v4
+        with:
+          name: windows-release
+          path: release
+      - name: Download macOS artifacts
+        uses: actions/download-artifact@v4
+        with:
+          name: macos-release
+          path: release
+      - name: Publish GitHub release
         uses: ncipollo/release-action@v1
-        if: ${{ !contains(steps.tag.outputs.tag,'beta') }}
         with:
           allowUpdates: true
-          artifacts: "*.dmg,*.blockmap,*.yml"
+          artifacts: "release/*"
+          generateReleaseNotes: true
+          prerelease: ${{ contains(github.ref_name, 'beta') }}
           token: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -2,6 +2,7 @@
 node_modules
 /dist
 /dist_electron
+/out
 
 
 # local env files

README.md

@@ -1,78 +1,113 @@
 <div align="center">
-    <img src="./src/assets/logo.svg" width="60" style="width: 60px;"/>
-    <p>MathFX</p>
-    <p><img src="https://img.shields.io/github/v/release/Creator-SN/MathFX" /></p>
+  <img src="./src/renderer/src/assets/logo.svg" width="72" alt="MathFX logo" />
+  <h1>MathFX</h1>
+  <p>A beautiful, friendly, and minimal formula OCR workspace powered by VLM APIs.</p>
+  <p>
+    <a href="https://github.com/Creator-SN/MathFX/releases"><img src="https://img.shields.io/github/v/release/Creator-SN/MathFX?label=release" alt="Latest release" /></a>
+    <a href="https://github.com/Creator-SN/MathFX/actions/workflows/release.yml"><img src="https://github.com/Creator-SN/MathFX/actions/workflows/release.yml/badge.svg" alt="Release workflow" /></a>
+    <a href="LICENSE"><img src="https://img.shields.io/badge/license-MIT-yellow.svg" alt="MIT license" /></a>
+  </p>
+  <p><a href="./docs/README.zh-CN.md">中文文档</a></p>
 </div>
 
-<p align="center">
-    <a href="LICENSE">
-      <img src="https://img.shields.io/badge/License-MIT-yellow.svg">
-    </a>
-</p>
+## What is MathFX?
 
-## 💡 MathFX(Preview)
+MathFX is a small cross-platform desktop tool for turning mathematical expressions into clean, editable LaTeX. Its core workflow is deliberately simple: capture a formula, let a vision-language model understand it, and copy the result wherever you need it.
 
-A pure open source and cross platforms Math Formulates OCR tool based on the Electron.
+It is designed for papers, lecture notes, research workflows, and anyone who wants formula recognition without a crowded interface.
 
-<div align="center" style="display: flex; justify-content: space-around;">
-    <img src="./src/assets/docs/scan.png" width="320" style="width: 48%; box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);"/>
-    <img src="./src/assets/docs/scan_dark.png" width="320" style="width: 48%; box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);"/>
+<div align="center">
+  <img src="./src/renderer/src/assets/docs/scan.png" width="48%" alt="MathFX light interface" />
+  <img src="./src/renderer/src/assets/docs/scan_dark.png" width="48%" alt="MathFX dark interface" />
 </div>
 
-## 🎈 Platform
-
-- ✔ Windows 11 [Supported]
-- ✔ Windows 10 [Supported]
-- ✔ Mac(AMD64) [Supported]
+## Highlights
 
+- **Minimal formula OCR** — capture a formula from any screen with a global shortcut and receive editable LaTeX.
+- **VLM API based** — use a vision-capable, OpenAI-compatible Chat API instead of being locked to a single OCR vendor.
+- **Your provider, your model** — configure a custom display name, base URL, API key, model, and `reasoning_effort` (defaults to `medium`).
+- **LangGraph orchestration** — the recognition request is represented as a small LangGraph workflow, making the model call and result parsing explicit and extensible.
+- **Manual LaTeX workspace** — edit or enter LaTeX by hand, render it immediately, and keep the corrected result in history.
+- **Copy in useful formats** — quickly copy bare LaTeX, inline math, display math, equation-environment LaTeX, rendered SVG, or a raster image for documents and desktop applications.
+- **History and navigation** — keep recognized formulas locally, browse previous results, edit them, and remove entries when they are no longer needed.
+- **Light and dark themes** — a compact interface that stays out of the way while you work.
+- **Windows and macOS releases** — packaged installers are built automatically through GitHub Actions.
 
-## ✨ Installation
+## How recognition works
 
-See the [Release Page](https://github.com/Creator-SN/MathFX/releases).
+MathFX sends the captured image to the VLM endpoint configured in the selected subscription. The model is instructed to return one JSON object containing KaTeX-compatible LaTeX. MathFX then parses the response and performs rendering, SVG generation, format conversion, and clipboard operations locally.
 
-## 🔨 Tutorial
+The default prompt asks the model to preserve fractions, roots, matrices, Greek letters, limits, superscripts, subscripts, aligned equations, operators, and visible text while returning no Markdown or explanation.
 
-First, you need to set up the subscriptions, MathFX currently supports three formulate OCR APIs. Including:
+Because MathFX uses a VLM API, the selected model must support image input. The endpoint should be compatible with the OpenAI Chat Completions interface, including hosted OpenAI-compatible services and local vision models.
 
-1. **SLatex OCR** **(Recommend)**: To build your own backend server, you can deploy the OCR server in this repo [SLatexOCR](https://github.com/aleversn/sLatexOCR).
-2. **Mathpix**: You can register the OCR API services with `$1` started, and the current pricing is much cheaper than directly using the Mathpix desktop application, each month you can have a `1,000` free requests. (`Although it costs $1 to sign up and a Credit Card is necessary, but the performance of this API is currently the best`).  [See Details](https://mathpix.com/ocr)
-3. **Xunfei** Formula Recognition API: You can register the OCR API for free and obtain a `500` requests per day. [See Details](https://www.xfyun.cn/service/formula-discern)
-4. **Baidu** Formula Recognition API: You can register the OCR API for free and obtain a `1,000` requests per month. [See Details](https://ai.baidu.com/tech/ocr/formula)
+> Images are sent to the API provider configured by you. Review that provider's privacy and retention policy before using sensitive material.
 
-> Note that the performance of `Xunfei` and `Baidu` OCR API is not good in complex science formulates scenes.
+## Quick start
 
-Once you have an OCR API subscription, all you need to do is fill in the necessary information about the current subscription. Then click this subscription's item block until the block's border is `blue`.
+1. Download the latest installer from the [Releases page](https://github.com/Creator-SN/MathFX/releases).
+2. Open **Subscriptions** and add a Chat API subscription.
+3. Fill in the name, base URL, API key, vision-capable model, and optional `reasoning_effort` (`medium` by default).
+4. Select the subscription so its active state is highlighted.
+5. Press the scan button or use `Alt + Shift + X` on Windows, or `Alt + Cmd + X` on macOS.
 
 <div align="center">
-    <img src="./src/assets/docs/subscription.png" style="width: 80%; box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.1);"/>
+  <img src="./src/renderer/src/assets/docs/subscription.png" width="80%" alt="MathFX subscription settings" />
 </div>
 
-Now you can scan for a new formulate scene on the `Scan` page or press `Alt + Shift/Cmd + X` to quick scan.
+## Editing and copying formulas
 
-## ⌨ Shortcuts
+After recognition, the formula can be corrected manually. MathFX renders the edited LaTeX with KaTeX and lets you copy the result in the format that fits the destination:
 
-- `Alt` + `Shift/Cmd` + `M`: Show the main program.
-- `Alt` + `Shift/Cmd` + `X`: Start a new quick scan.
+- plain LaTeX source for editors such as VS Code;
+- inline or display LaTeX for Markdown and documentation;
+- an equation environment for LaTeX documents;
+- rendered SVG for Word and other rich document applications;
+- an image for applications that accept bitmap content.
 
-## 🌏 Language
+The formula and its source image are kept in the local history store so you can revisit, edit, copy, or delete them later.
 
-Currently supports two languages.
+## Keyboard shortcuts
 
-- English
-- 简体中文(Chinese)
+- `Alt + Shift + X` on Windows / `Alt + Cmd + X` on macOS — capture a new formula.
 
-## Acknowledgements
+## Development
 
-This Project is Develop Based on [VFluentForElectron](https://github.com/Creator-SN/VFluentForElectron).
+Requirements: Node.js 20+, Yarn 1.x, and a VLM API key for end-to-end recognition.
 
-## License
+```bash
+yarn install
+yarn dev
+```
+
+Build the renderer and Electron bundles:
+
+```bash
+yarn build
+```
 
-MIT License
+Build platform packages locally:
 
-Copyright (c) 2024 Creator SN®
+```bash
+yarn build:win
+yarn build:mac
+```
 
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+Tagged pushes matching `v*` trigger the GitHub Actions release workflow. Windows produces an NSIS installer; macOS produces DMG and ZIP packages using `Icon.icns`.
 
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+## Architecture
+
+- **Electron + Vue 3** — desktop shell and renderer UI.
+- **Vite / electron-vite** — development and production bundling.
+- **LangChain OpenAI + LangGraph** — VLM model integration and recognition graph.
+- **KaTeX** — local LaTeX rendering.
+- **Pinia + lowdb** — application state and local history/subscription persistence.
+- **VFluent 3** — compact Fluent-inspired UI components.
+
+## Acknowledgements
+
+MathFX is built with [VFluent 3](https://github.com/Creator-SN/VFluentForElectron) and the Electron ecosystem.
+
+## License
 
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+MathFX is released under the [MIT License](LICENSE).