initial commit

Author: msomierick

.github/instructions/project-stack.instructions.md

@@ -0,0 +1,39 @@
+---
+applyTo: '**'
+---
+
+# Project Stack and General Instructions
+
+This is a Tauri + React + TypeScript + Vite **desktop application**.
+
+**IMPORTANT: This is a desktop-only application. Do not consider mobile devices, responsive design for mobile, or touch interfaces. Focus exclusively on desktop user experience with mouse and keyboard interactions.**
+
+Use React 18 with TypeScript for the frontend.
+Use Vite 6 as the build tool.
+Use Yarn as the package manager.
+Use Tailwind CSS 4 with shadcn/ui components for styling.
+Use Lucide React for icons.
+Use Tauri 2 as the desktop runtime.
+Use Rust for backend commands in src-tauri/src/commands.rs.
+
+## Package Management
+
+Always use yarn for package management.
+Never use npm or pnpm.
+Use yarn add [package] to install dependencies.
+Use yarn add -D [package] for dev dependencies.
+Use yarn dlx instead of npx for one-time commands.
+Use yarn why [package] to debug dependency issues.
+Check yarn.lock file for dependency resolution.
+
+## Development Philosophy
+
+Follow the "Worse is Better" (New Jersey) approach with selective MIT principles.
+Choose the most straightforward implementation possible.
+Avoid premature optimization, complex patterns, or clever solutions.
+Prioritize readability and maintainability over completeness.
+Code must work perfectly for the primary use cases specified.
+Handle expected inputs gracefully with proper error handling.
+Use descriptive function and variable names.
+Include type hints when supported by the language.
+Be transparent about incompleteness with clear TODOs and comments.

.github/instructions/simplicity.instructions.md

@@ -0,0 +1,56 @@
+---
+applyTo: '**'
+---
+Follow the "Worse is Better" (New Jersey) approach with selective MIT principles.
+
+# Copilot Instructions: Pragmatic Simplicity Philosophy
+
+You are a pragmatic coding assistant that prioritizes **simplicity, correctness, and practical completeness**. Follow the "Worse is Better" (New Jersey) approach with selective MIT principles.
+
+## Core Principles (In Order of Priority)
+
+### 1. **Simplicity First**
+- Choose the most straightforward implementation possible
+- Avoid premature optimization, complex patterns, or clever solutions
+- Prioritize readability and maintainability over completeness
+- If two approaches exist, choose the one that's easier to read and explain
+
+### 2. **Correctness for Core Use Cases** 
+- Code must work perfectly for the primary use cases specified
+- Handle expected inputs gracefully with proper error handling
+- Verify functionality with the examples provided
+- Fail loudly with clear error messages rather than silently
+
+### 3. **Clear Interface Design**
+- Use descriptive function and variable names
+- Include type hints when supported by the language
+- Provide concise docstrings explaining purpose, parameters, and returns
+- Make the interface intuitive and self-explanatory
+
+### 4. **Honest About Limitations**
+- Explicitly state what your code doesn't handle
+- Use comments to note assumptions and edge cases not covered
+- Example: "Note: This assumes non-empty input" or "For production, add network error handling"
+
+## Implementation Guidelines
+
+### Code Quality
+- Write small, focused functions with clear responsibilities
+- Use boring, robust solutions over clever tricks
+- Follow language-specific best practices and idioms
+- Include reasonable error handling without defensive programming overkill
+
+## Decision Process
+
+Before responding, ask yourself:
+
+"Is this the simplest solution that correctly solves the core problem and is honest about its limits?"
+
+If yes, proceed. If no, simplify further.
+
+## Key Mantras
+- **Ship something working** over designing something perfect but incomplete
+- **Minimize implementation complexity** even if interface isn't elegant
+- **Be transparent about incompleteness** with clear TODOs and comments
+- **Favor concrete examples** over theoretical generality
+- **When unsure, ask for clarification** and suggest incremental improvements

.github/instructions/styling.instructions.md

@@ -0,0 +1,93 @@
+---
+applyTo: 'src/**/*.{tsx,css}'
+---
+
+# UI and Styling Instructions
+
+**IMPORTANT: This is a desktop-only application. Do not consider mobile devices, responsive design for mobile, or touch interfaces. Focus exclusively on desktop user experience with mouse and keyboard interactions.**
+
+## Design Philosophy
+
+### Core Principles
+- **Simplicity Through Reduction**: Identify the essential purpose and eliminate everything that distracts from it.
+- **Material Honesty**: Buttons should feel pressable, cards should feel substantial, animations should reflect real-world physics.
+- **Obsessive Detail**: Consider every pixel, every interaction, and every transition.
+- **Coherent Design Language**: Every element should visually communicate its function and feel like part of a unified system.
+- **Invisibility of Technology**: Users should focus on their content and goals, not on understanding the interface.
+
+### Visual Hierarchy & Layout
+- Use generous negative space to focus attention and create calm.
+- Maintain compositional balance with careful attention to visual weight.
+- Related elements should be visually grouped through proximity, alignment, and shared attributes.
+- Use grid/flex wrappers with `gap` for spacing rather than direct margins/padding on children.
+
+## Styling Implementation
+Use Tailwind CSS classes for styling.
+Follow shadcn/ui component patterns.
+Use CSS variables defined in src/App.css for theming.
+Prefer className over inline styles.
+Use shadcn/ui components instead of creating custom UI components.
+Follow the "new-york" style variant for shadcn/ui components.
+Design for desktop viewports - optimize for larger screens and precise mouse interactions.
+
+### Color Strategy
+- Use intentional color where every color has a specific purpose.
+- Prefer subtle, slightly desaturated colors rather than bold primary colors.
+- Limit accent colors to guide attention to the most important actions.
+- Ensure WCAG AA contrast compliance (4.5:1 for normal, 3:1 for large text).
+
+### Typography Excellence
+- Treat typography as a core design element, not an afterthought.
+- Establish clear visual distinction between different levels of information.
+- Use no more than 2-3 typefaces for the entire application.
+- Allow generous spacing around text elements (line height typically 1.5x font size for body text).
+
+## Interactive Elements
+
+### Buttons
+- Visually express the importance and function through appearance.
+- Every button must have distinct states: default, hover, active, focused, disabled.
+- Buttons should appear "pressable" through subtle shadows or dimensionality cues.
+- Optimize button sizes for mouse interaction (minimum 32×32px for desktop).
+- Use concise, action-oriented labels.
+
+### Animation & Motion
+- Every animation must serve a functional purpose (orient users, show relationships, provide feedback).
+- Movement should follow real-world physics with appropriate acceleration/deceleration.
+- Timing guidelines: button press (100-150ms), state changes (200-300ms), page transitions (300-500ms).
+- Animations should be felt rather than seen - avoid calling attention to themselves.
+
+### Color Strategy
+- Use intentional color where every color has a specific purpose.
+- Prefer subtle, slightly desaturated colors rather than bold primary colors.
+- Limit accent colors to guide attention to the most important actions.
+- Ensure WCAG AA contrast compliance (4.5:1 for normal, 3:1 for large text).
+
+### Typography Excellence
+- Treat typography as a core design element, not an afterthought.
+- Establish clear visual distinction between different levels of information.
+- Use no more than 2-3 typefaces for the entire application.
+- Allow generous spacing around text elements (line height typically 1.5x font size for body text).
+
+## Interactive Elements
+
+### Buttons
+- Visually express the importance and function through appearance.
+- Every button must have distinct states: default, hover, active, focused, disabled.
+- Buttons should appear "pressable" through subtle shadows or dimensionality cues.
+- Minimum touch target size of 44×44px for all interactive elements.
+- Use concise, action-oriented labels.
+
+### Animation & Motion
+- Every animation must serve a functional purpose (orient users, show relationships, provide feedback).
+- Movement should follow real-world physics with appropriate acceleration/deceleration.
+- Timing guidelines: button press (100-150ms), state changes (200-300ms), page transitions (300-500ms).
+- Animations should be felt rather than seen - avoid calling attention to themselves.
+
+## Form Handling
+Use React.FormEvent for form handling.
+Prefer controlled components for forms.
+Use e.preventDefault() in form submit handlers.
+Validate all inputs before submission.
+Handle form errors gracefully with user-friendly messages.
+Design fields that guide users through correct input with clear labeling and inline validation.

.github/instructions/tauri-backend.instructions.md

@@ -0,0 +1,10 @@
+---
+applyTo: 'src-tauri/**/*.rs'
+---
+
+# Tauri Backend Instructions
+
+Add commands to src-tauri/src/commands.rs.
+Update src-tauri/src/lib.rs to register new commands.
+Use proper Rust error handling with Result<T, E>.
+Use Tauri's security features and permissions properly.

.github/instructions/typescript.instructions.md

@@ -0,0 +1,71 @@
+---
+applyTo: 'src/**/*.{ts,tsx}'
+---
+
+# Frontend Development Instructions
+
+## TypeScript
+Use strict TypeScript configuration.
+Define interfaces for all props and data structures.
+Place type definitions in src/types/.
+Use proper typing for Tauri commands and responses.
+Always use TypeScript with proper type definitions.
+Add proper JSDoc comments for complex functions.
+
+## React Components
+Place reusable components in src/components/.
+Use src/components/ui/ for shadcn/ui components only.
+Export components from src/components/index.ts.
+Use TypeScript interfaces for prop types.
+Use functional components with hooks.
+Prefer controlled components for forms.
+Use React.memo for expensive components.
+Implement proper cleanup in useEffect hooks.
+
+### Component Design Principles
+- Design components where users interact directly with their content rather than through abstract controls.
+- Every interaction must provide instantaneous visual feedback (within 100ms).
+- Elements that look similar should behave similarly - build trust through predictable patterns.
+- Make errors difficult, but recovery easy with clear paths to undo actions.
+- Core functions should be immediately visible; advanced functions can be progressively revealed.
+
+### Micro-Interactions
+- Add small, delightful details that reward attention and form emotional connection.
+- Design elements that respond subtly to user interaction, creating a sense of liveliness.
+- Layer micro-interactions so they enhance but never obstruct functionality.
+
+## Imports and Organization
+Use @/ prefix for imports: @/components, @/lib, @/hooks.
+Use consistent import ordering: React imports, third-party imports, local imports.
+Export components from src/components/index.ts.
+Export custom hooks from src/hooks/index.ts.
+
+## Error Handling
+Implement comprehensive error boundaries when needed.
+Show user-friendly error messages.
+Log errors appropriately for debugging.
+Handle Tauri command failures gracefully.
+Implement proper error handling for all async operations.
+
+## Accessibility
+Use semantic HTML elements.
+Implement proper ARIA attributes.
+Ensure keyboard navigation works.
+Test with screen readers.
+Make components accessible by default.
+
+## Tauri Integration
+Place Tauri service logic in src/services/tauri.service.ts.
+Use async/await for Tauri command calls.
+Handle loading states and errors properly.
+Type Tauri commands with proper interfaces.
+Validate all inputs before sending to Tauri commands.
+Handle Tauri command failures gracefully.
+Optimize Tauri command calls to avoid unnecessary invocations.
+
+## Custom Hooks
+Create custom hooks in src/hooks/ for reusable logic.
+Use React hooks (useState, useEffect, etc.) for state management.
+Return state, loading, error, and actions from custom hooks.
+Implement proper cleanup in useEffect hooks.
+Export hooks from src/hooks/index.ts.

.github/workflows/publish.yml

@@ -0,0 +1,68 @@
+name: 'Publish artifacts'
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - release
+
+jobs:
+  publish-tauri:
+    permissions:
+      contents: write
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - platform: 'macos-latest' # for Arm based macs (M1 and above).
+            args: '--target aarch64-apple-darwin'
+          - platform: 'macos-latest' # for Intel based macs.
+            args: '--target x86_64-apple-darwin'
+          - platform: 'ubuntu-22.04'
+            args: ''
+          - platform: 'ubuntu-22.04-arm' # Only available in public repos.
+            args: ''
+          - platform: 'windows-latest'
+            args: ''
+
+    runs-on: ${{ matrix.platform }}
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: install dependencies (ubuntu only)
+        if: matrix.platform == 'ubuntu-22.04' # This must match the platform value defined above.
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf
+
+      - name: setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+          cache: 'yarn' # Set this to npm, yarn or pnpm.
+
+      - name: install Rust stable
+        uses: dtolnay/rust-toolchain@stable # Set this to dtolnay/rust-toolchain@nightly
+        with:
+          # Those targets are only used on macos runners so it's in an `if` to slightly speed up windows and linux builds.
+          targets: ${{ matrix.platform == 'macos-latest' && 'aarch64-apple-darwin,x86_64-apple-darwin' || '' }}
+
+      - name: Rust cache
+        uses: swatinem/rust-cache@v2
+        with:
+          workspaces: './src-tauri -> target'
+
+      - name: install frontend dependencies
+        # If you don't have `beforeBuildCommand` configured you may want to build your frontend here too.
+        run: yarn install # change this to npm or pnpm depending on which one you use.
+
+      - uses: tauri-apps/tauri-action@v0
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tagName: app-v__VERSION__ # the action automatically replaces \_\_VERSION\_\_ with the app version.
+          releaseName: 'App v__VERSION__'
+          releaseBody: 'See the assets to download this version and install.'
+          releaseDraft: true
+          prerelease: false
+          args: ${{ matrix.args }}

.gitignore

@@ -0,0 +1,28 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# chem
+*.smiles
+*.smi

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["tauri-apps.tauri-vscode", "rust-lang.rust-analyzer"]
+}