Interfaccia utente del desktop

Architettura dell'applicazione

L'applicazione desktop combina una visualizzazione web SolidJS, Vite, Three.js e una shell Tauri v2 Rust. La visualizzazione web possiede schermate e stato di interazione. Il sidecar Bun possiede gestori API, accesso al database, sessioni AI e servizi di progetto. Il processo Rust possiede la finestra, i menu, il vassoio, le finestre di dialogo del sistema operativo, l'accesso al portachiavi, gli aggiornamenti e il ciclo di vita del sidecar.

apps/desktop/src/main.tsx monta l'applicazione. app/App.tsx stabilisce la connessione API e fornisce lo stato condiviso; app/routes.tsx mappa gli URL ai moduli di pagina pigri. Schermate delle funzionalità in tempo reale features/. La presenza di un percorso non stabilisce la disponibilità dei suoi servizi esterni: la fatturazione necessita della configurazione di Stripe e l'AI necessita di un provider configurato.

Avvio e ripristino della connessione

1. La shell avvia il sidecar in bundle con un token di avvio generato, i dati dell'applicazione e le directory di migrazione.
2. Il sidecar lega un porto effimero 127.0.0.1, attende la risposta del percorso di integrità e scrive un JSON ready evento contenente il porto.
3. La visualizzazione web invoca get_sidecar_endpoint e crea un client API e un runtime di effetti gestiti.
4. Una richiesta di integrità riuscita crea lo stato dell'applicazione e monta il router e la shell.

La visualizzazione web concede 150 secondi per il ripristino della connessione, con un timeout di 30 secondi per tentativo e una pausa tra i tentativi di 750 millisecondi. I tentativi falliti eliminano l'endpoint memorizzato nella cache in modo che un sidecar riavviato possa fornire una nuova porta. Il supervisore Rust attende 60 secondi per ogni handshake pronto e consente un riavvio automatico. Il nuovo tentativo diventa disponibile quando scade il budget per la connessione WebView.

Percorsi sullo schermo

Utilizzo app/routes.tsx per i nomi esatti dei parametri e pages/ per individuare lo schermo montato su un URL. Gli adattatori di percorso sono intenzionalmente piccoli; leggere lo schermo e le relative chiamate API durante la diagnosi di una vista vuota o di un'azione non riuscita.

Organizzazione delle fonti

• app/: avvio, router, client API globale, integrazione nativa, shell e scorciatoie da tastiera.
• pages/: gli adattatori di percorso importano o riesportano le schermate.
• features/: aree di prodotto con schermate, componenti, hook, assistenti di stato e specifici del dominio.
• shared/: controlli riutilizzabili, componenti della shell, stato dell'applicazione, memorizzazione nella cache delle query e cronologia dei comandi.
• viewport/: disegno su tela, snap, gesti degli strumenti, rendering Three.js, meshing e riproduzione.
• i18n/, styles/, e testing/: traduzioni, stili globali e dispositivi di prova.

Il desktop dipende da @cadcamfun/api per il contratto HTTP e così via @cadcamfun/core per operazioni di geometria e CAM. La persistenza del database rimane dietro l'API sidecar. La cronologia dell'editor locale è distinta dalle versioni persistenti del disegno o del percorso utensile e dal controllo della versione del progetto.

Conchiglia nativa

La finestra di produzione è 1440 × 900 per impostazione predefinita, con un minimo di 960 × 600. Tauri mette in scena il frontend da apps/desktop/dist, un sidecar specifico per il target di src-tauri/binariese ha generato migrazioni come risorse. Si registra .cadcam, .nc, e .gcode associazioni di file. L'apertura di un file supportato o l'avvio di una seconda istanza inoltra i percorsi dei file alla finestra esistente.

src-tauri/src/sidecar.rs supervisiona il processo figlio. Chiudendo l'app scrive a {"event":"shutdown"} allinearsi allo stdin del bambino e attendere brevemente prima di raccoglierlo; il bambino osserva anche la chiusura dello stdin. Il token di avvio è di 32 byte casuali, codificato esadecimale come 64 caratteri e le righe di log sidecar che potrebbero contenere credenziali vengono oscurate. I log sono separati da stdout, che trasporta l'handshake ready/error. È possibile accedere ai segreti nativi tramite src-tauri/src/secrets.rs utilizzando il portachiavi del sistema operativo.

Su macOS, la shell registra il plugin Liquid Glass. La visualizzazione web segue l'impostazione del vetro e torna indietro quando l'effetto non è disponibile. La configurazione dell'App Store disabilita l'opzione API privata; la configurazione regolare lo consente. Queste sono configurazioni di build separate.

Limiti di sicurezza e persistenza

La policy del contenuto di produzione consente risorse locali, connessioni API di loopback, immagini di dati/blob e valutazione WebAssembly. Non garantisce l'esecuzione arbitraria di script remoti. L'ambito delle autorizzazioni native è incluso src-tauri/capabilities; la politica di sviluppo consente inoltre Vite e il suo websocket.

open_path canonicalizza i percorsi, li limita alle directory utente/applicazione consentite e rifiuta le estensioni eseguibili come .exe, .app, .sh, .bat, .msi, e .jar. .. segmenti e collegamenti simbolici non possono sfuggire alle cartelle consentite perché entrambi i lati sono canonizzati. La selezione e il salvataggio dei file utilizzano finestre di dialogo e convalida native. Un token di avvio garantisce l'accesso all'API dell'applicazione locale; trattalo separatamente da un token compagno o da un token bridge AI con ambito progetto.

Le impostazioni dell'interfaccia utente, lo stato delle query API, i comandi dell'editor, le versioni del progetto archiviate e i segreti nativi hanno proprietari diversi. Diagnostica ciascuno tramite il suo servizio effettivo anziché presupporre che tutto lo stato dell'applicazione sia archiviato in SQLite.

Integrazione delle funzionalità

I moduli di funzionalità CAD e CAM compongono componenti viewport riutilizzabili con i propri pannelli, archivi e flussi di salvataggio. Il pannello dell'assistente riceve il contesto del progetto e dell'editor e trasmette in streaming gli eventi dello strumento attraverso lo stato della funzionalità AI. Le schermate delle risorse utilizzano il client API invece di accedere direttamente al database.

Per una modifica dell'interfaccia utente, seguire l'adattatore di percorso fino alla relativa schermata delle funzionalità, quindi ispezionare l'archivio delle funzionalità o l'hook che invia la richiesta. Riutilizzare i componenti condivisi solo quando il loro contratto esistente corrisponde all'interazione. Mantieni la geometria pura nel pacchetto principale e il comportamento nativo del sistema operativo nella shell Rust.

Caricamento del percorso ed errori

Ogni percorso utilizza il limite di importazione pigro di Solid. La tabella include una pagina generale, /500, /offlinee vie legali. È necessario fornire una navigazione diretta nel browser tramite il server di sviluppo Vite o la visualizzazione Web in pacchetto in modo che il router client possa risolvere l'URL.

L'API di anteprima implementa un set limitato di raccolte e può inserire deliberatamente richieste non riuscite nei test. Un rendering di anteprima riuscito dimostra il comportamento dell'interfaccia utente rispetto a tali dispositivi; verificare la persistenza, le autorizzazioni, lo streaming e le integrazioni esterne con il sidecar live.

Interfaccia di comando nativa

Eventi nativi

La conchiglia emette sidecar-status per i cambiamenti del ciclo di vita, open-file con percorsi supportati, menu per la selezione del menu e update://status per l'avanzamento dell'aggiornamento. Le selezioni dei progetti recenti del vassoio sono rappresentate da tray.recent.<projectId> identificatori del menu. Il menu della shell e i moduli del vassoio definiscono i loro set di identificatori completi.

Gli ascoltatori dovrebbero essere limitati al loro componente o al ciclo di vita dell'applicazione e rimossi durante la pulizia. La visualizzazione Web deve risolvere nuovamente l'endpoint dopo un riavvio sidecar anziché continuare a utilizzare la porta precedente.

Sviluppo e verifica

bun run --filter @cadcamfun/desktop dev
bun run desktop:dev
bun run --filter @cadcamfun/desktop typecheck
bun test apps/desktop/src
bun run build:desktop

Il primo comando esegue un'anteprima del browser. desktop:dev compila il vero sidecar e mette in scena le migrazioni prima di avviare Tauri. Il pacchetto desktop è tauri:dev lo script invece crea uno stub binario solo quando non esiste alcun binario; usalo per il lavoro di shell isolato e controlla quale binario è presente prima di interpretare le sue risposte API.

La scrivania build viene eseguito lo script vite build soltanto; non compila il sidecar né impacchetta un pacchetto Tauri. Utilizzo bun scripts/build.ts per la pipeline di rilascio completa (vedi Pubblicazione).

Preferenze e impostazioni

L'archivio delle impostazioni condivise mantiene un record convalidato in cadcamfun.settings nella memoria locale di Webview. I campi mancanti, non validi o illeggibili rientrano in modo indipendente. Un'area di archiviazione piena o bloccata non interrompe la modifica, ma le modifiche alle preferenze potrebbero non persistere. Le preferenze di anteprima del browser appartengono all'origine del browser e sono separate dalle preferenze di visualizzazione Web native.

La schermata Impostazioni contiene le schede Profilo, Account, Sicurezza, Abbonamento, Notifiche, AI, Dispositivi e Lingua. La scheda Dispositivi incorpora il pannello del gateway complementare. Le impostazioni della lingua includono la levetta del vetro. L'archivio locale comune attualmente convalida la locale predefinita; non dedurre ulteriore copertura della traduzione da un elenco di etichette visualizzate.

Salvare e riaprire un programma CAM

1. Genera o carica il codice NC nel CAM e apri la finestra di dialogo di salvataggio/esportazione dal punto di ingresso esistente.
2. Per un'esportazione di file, scegli il codice G o il formato del percorso utensile portatile. Il codice G scarica il testo NC corrente; la scelta del percorso utensile scrive un file strutturato .cam.json istantanea.
3. Per la persistenza dell'applicazione, scegli un progetto esistente, un nuovo progetto o aggiorna il programma già salvato. Fornire il nome del programma e i campi di destinazione richiesti.
4. Durante l'aggiornamento, il flusso di salvataggio registra il programma completo precedente come versione del percorso utensile prima di sostituire i dati correnti.
5. Aprire l'elemento salvato nel percorso dei dettagli del percorso utensile per ispezionare o ripristinare le versioni.

Il riepilogo del salvataggio include righe NC, byte, movimenti, identificatori utensile, nomi operazioni, stock, unità, offset pezzo e identità di verifica quando tale prova appartiene all'NC corrente. Un testo NC modificato può rendere obsolete le prove precedentemente calcolate. Esaminare l'attuale relazione codice/evidenza prima di fare affidamento sul riepilogo.

Se la creazione di un nuovo progetto ha esito positivo ma un passaggio di salvataggio successivo non riesce, la modale conserva la destinazione creata per i tentativi e include il relativo identificatore nell'errore. Riprovare all'interno di quella modalità evita di creare nuovamente lo stesso progetto. Non dare per scontato che il flusso di salvataggio sia una transazione atomica tra risorse incrociate.

Diagnosi della tastiera e dei guasti

Cmd/Ctrl+K apre la tavolozza dei comandi e Cmd/Ctrl+J attiva/disattiva il pannello dell'assistente. Le scorciatoie della shell vengono ignorate quando il focus è su un elemento input, textarea, select o content-modificabile. Le tele dell'editor hanno la propria gestione della tastiera. Diversi richiami ai comandi della shell, incluso Salva/Esporta nella tabella di scelta rapida generica, sono segnaposto; utilizzare gli effettivi controlli di salvataggio/esportazione della funzionalità invece di dare per scontato che ogni acceleratore elencato esegua un'operazione sul documento.

Ancore di implementazione: shared/state/settings.ts, app/shortcuts.ts, features/settings/screens/settings.tsx, e features/cam/components/SaveCamModal.tsx.

Payload di eventi nativi

import { invoke } from "@tauri-apps/api/core"
import { listen } from "@tauri-apps/api/event"

const { baseUrl, token } = await invoke<{ baseUrl: string; token: string }>("get_sidecar_endpoint")

const path = await invoke<string | null>("pick_file", {
  filters: [{ name: "G-code", extensions: ["nc", "gcode"] }],
})                                    // null when the user cancels

await invoke("save_file", { defaultName: "part.nc", contents: gcodeText })

const unlisten = await listen<{ state: string; port?: number }>("sidecar-status", (e) => {
  if (e.payload.state === "ready") reconnect()
})
// later: unlisten()

try {
  await invoke("install_update", { unsavedWork: editorIsDirty })
} catch (error) {
  // { kind, message }: the update variant carries the refusal (unsavedWork | noneAvailable | failed)
}

get_sidecar_endpoint ritorna { baseUrl, token } (serializzato in camelCase da SidecarEndpoint). Gli errori da ogni comando arrivano come valore rifiutato di invoke, sagomato { kind, message }.

Scorciatoie da tastiera

Ogni percorso sullo schermo

Il router dentro apps/desktop/src/app/routes.tsx dichiara 68 rotte, ciascuna caricata pigramente da apps/desktop/src/pages/ (i segmenti dinamici sono _id_.tsx file). Raggruppati per primo segmento:

Nel 3D