# jfarid27/canonic architecture

> Architecture diagram of the GitHub repository jfarid27/canonic, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-29). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/jfarid27/canonic
- Repository: https://github.com/jfarid27/canonic

## Overview

Canonic is a local-first Electron markdown workspace for product teams. The main workflow is choosing a workspace, editing documents, and saving them locally with Git-backed history; users can also search, comment, share with peers, and consult an AI assistant. The graph connects the Vue interface and shared store to the Electron boundary, then shows documented or source-supported service responsibilities. Several subsystem paths are based on the repository tree and README capabilities; unsampled wiring is left out where it cannot be established.

Main entry points: [`electron/main.js`](https://github.com/jfarid27/canonic/blob/main/electron/main.js) (Electron runtime), [`src/store/index.js`](https://github.com/jfarid27/canonic/blob/main/src/store/index.js) (Application state), [`src/components/layout/MainLayout.vue`](https://github.com/jfarid27/canonic/blob/main/src/components/layout/MainLayout.vue) (Workspace layout), [`src/components/editor/Editor.vue`](https://github.com/jfarid27/canonic/blob/main/src/components/editor/Editor.vue) (Markdown editor)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_interface["Workspace interface"]
  node_layout["Workspace layout<br/>[MainLayout.vue]"]
  node_setup["Workspace setup<br/>[WorkspaceSetup.vue]"]
  node_editor["Markdown editor<br/>[Editor.vue]"]
  node_searchview["Find and replace<br/>[SearchView.vue]"]
end

subgraph group_documents["Documents and state"]
  node_store["Application state<br/>[index.js]"]
  node_preload["IPC bridge<br/>[preload.js]"]
  node_main["Electron runtime<br/>[main.js]"]
  node_files["Workspace files<br/>[fileIndex.js]"]
  node_markdown[("Markdown workspace")]
end

subgraph group_history_search["History and search"]
  node_git["Git operations<br/>[git.js]"]
  node_versions["Version history<br/>[versions.js]"]
  node_search["Workspace search"]
  node_index["Search index<br/>[search.js]"]
end

subgraph group_collaboration["Collaboration and AI"]
  node_comments["Comment sync<br/>[comment-sync.js]"]
  node_discovery["Peer discovery<br/>[discovery.js]"]
  node_sharing["Peer sharing<br/>[share.js]"]
  node_peers(("Peer devices"))
  node_ai["AI assistant<br/>[AIChat.vue]"]
  node_provider{{"AI provider"}}
end

node_user(("Workspace user"))

node_user -->|"chooses workspace"| node_setup
node_user -->|"uses workspace"| node_layout
node_layout -->|"presents editor"| node_editor
node_layout -->|"uses state"| node_store
node_editor -->|"updates documents"| node_store
node_searchview -->|"requests search"| node_store
node_store -->|"calls APIs"| node_preload
node_preload -->|"forwards IPC"| node_main
node_main -->|"dispatches file work"| node_files
node_files -->|"reads and writes"| node_markdown
node_main -->|"dispatches Git"| node_git
node_git -->|"versions files"| node_markdown
node_main -->|"handles history"| node_versions
node_main -->|"handles workspace search"| node_search
node_search -->|"searches files"| node_markdown
node_main -->|"handles indexing"| node_index
node_main -->|"handles comments"| node_comments
node_main -->|"starts discovery"| node_discovery
node_main -->|"handles sharing"| node_sharing
node_sharing -->|"shares workspace"| node_peers
node_discovery -->|"discovers peers"| node_peers
node_user -.->|"asks assistant"| node_ai
node_ai -.->|"sends prompts"| node_provider

click node_layout "https://github.com/jfarid27/canonic/blob/main/src/components/layout/MainLayout.vue"
click node_setup "https://github.com/jfarid27/canonic/blob/main/src/components/layout/WorkspaceSetup.vue"
click node_editor "https://github.com/jfarid27/canonic/blob/main/src/components/editor/Editor.vue"
click node_searchview "https://github.com/jfarid27/canonic/blob/main/src/components/panels/SearchView.vue"
click node_store "https://github.com/jfarid27/canonic/blob/main/src/store/index.js"
click node_preload "https://github.com/jfarid27/canonic/blob/main/electron/preload.js"
click node_main "https://github.com/jfarid27/canonic/blob/main/electron/main.js"
click node_files "https://github.com/jfarid27/canonic/blob/main/electron/fileIndex.js"
click node_git "https://github.com/jfarid27/canonic/blob/main/electron/git.js"
click node_versions "https://github.com/jfarid27/canonic/blob/main/electron/versions.js"
click node_search "https://github.com/jfarid27/canonic/blob/main/electron/workspace-search.js"
click node_index "https://github.com/jfarid27/canonic/blob/main/electron/search.js"
click node_comments "https://github.com/jfarid27/canonic/blob/main/electron/comment-sync.js"
click node_discovery "https://github.com/jfarid27/canonic/blob/main/electron/discovery.js"
click node_sharing "https://github.com/jfarid27/canonic/blob/main/electron/share.js"
click node_ai "https://github.com/jfarid27/canonic/blob/main/src/components/panels/AIChat.vue"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_layout,node_setup,node_editor,node_searchview,node_user toneBlue
class node_store,node_preload,node_main,node_files,node_markdown toneAmber
class node_git,node_versions,node_search,node_index toneMint
class node_comments,node_discovery,node_sharing,node_peers,node_ai,node_provider toneRose
```

## Components

### Workspace interface

- [Workspace layout](https://github.com/jfarid27/canonic/blob/main/src/components/layout/MainLayout.vue): `src/components/layout/MainLayout.vue`
- [Workspace setup](https://github.com/jfarid27/canonic/blob/main/src/components/layout/WorkspaceSetup.vue): `src/components/layout/WorkspaceSetup.vue`
- [Markdown editor](https://github.com/jfarid27/canonic/blob/main/src/components/editor/Editor.vue): `src/components/editor/Editor.vue`
- [Find and replace](https://github.com/jfarid27/canonic/blob/main/src/components/panels/SearchView.vue): `src/components/panels/SearchView.vue`

### Documents and state

- [Application state](https://github.com/jfarid27/canonic/blob/main/src/store/index.js): `src/store/index.js`
- [IPC bridge](https://github.com/jfarid27/canonic/blob/main/electron/preload.js): `electron/preload.js`
- [Electron runtime](https://github.com/jfarid27/canonic/blob/main/electron/main.js): `electron/main.js`
- [Workspace files](https://github.com/jfarid27/canonic/blob/main/electron/fileIndex.js): `electron/fileIndex.js`
- **Markdown workspace**

### History and search

- [Git operations](https://github.com/jfarid27/canonic/blob/main/electron/git.js): `electron/git.js`
- [Version history](https://github.com/jfarid27/canonic/blob/main/electron/versions.js): `electron/versions.js`
- [Workspace search](https://github.com/jfarid27/canonic/blob/main/electron/workspace-search.js): `electron/workspace-search.js`
- [Search index](https://github.com/jfarid27/canonic/blob/main/electron/search.js): `electron/search.js`

### Collaboration and AI

- [Comment sync](https://github.com/jfarid27/canonic/blob/main/electron/comment-sync.js): `electron/comment-sync.js`
- [Peer discovery](https://github.com/jfarid27/canonic/blob/main/electron/discovery.js): `electron/discovery.js`
- [Peer sharing](https://github.com/jfarid27/canonic/blob/main/electron/share.js): `electron/share.js`
- **Peer devices**
- [AI assistant](https://github.com/jfarid27/canonic/blob/main/src/components/panels/AIChat.vue): `src/components/panels/AIChat.vue`
- **AI provider**

### Other components

- **Workspace user**

## Connections

- Workspace user → Workspace setup: chooses workspace
- Workspace user → Workspace layout: uses workspace
- Workspace layout → Markdown editor: presents editor
- Workspace layout → Application state: uses state
- Markdown editor → Application state: updates documents
- Find and replace → Application state: requests search
- Application state → IPC bridge: calls APIs
- IPC bridge → Electron runtime: forwards IPC
- Electron runtime → Workspace files: dispatches file work
- Workspace files → Markdown workspace: reads and writes
- Electron runtime → Git operations: dispatches Git
- Git operations → Markdown workspace: versions files
- Electron runtime → Version history: handles history
- Electron runtime → Workspace search: handles workspace search
- Workspace search → Markdown workspace: searches files
- Electron runtime → Search index: handles indexing
- Electron runtime → Comment sync: handles comments
- Electron runtime → Peer discovery: starts discovery
- Electron runtime → Peer sharing: handles sharing
- Peer sharing → Peer devices: shares workspace
- Peer discovery → Peer devices: discovers peers
- Workspace user → AI assistant: asks assistant
- AI assistant → AI provider: sends prompts