🖥 002 PCローカル・UI設計
画面構成・モジュール構造・データ構造・データフロー
設計書 v1.4 / 2026-05-06
1 画面構成
PCアプリはメインウィンドウ1枚＋付箋ウィンドウN枚のマルチウィンドウ構成です。
- 役割
- アプリの司令塔。ユーザーには見えないことが多い（トレイ常駐）
- 機能
- 起動時に付箋ウィンドウを生成・配置
設定画面・検索オーバーレイを表示
トレイアイコンのイベントを受け取る
iPhone からの受信（ポーリング）を担当 - ファイル
app/page.tsx
- 役割
- 付箋 1 枚ごとに独立した
WebviewWindow - 機能
- テキスト編集（RichTextEditor）
ピン留め・たたむ・色変更
右クリックメニュー（iPhone 送信・アーカイブ等）
画像キャプチャ・リンク挿入 - ファイル
app/components/StickyNote.tsx
1.3 ウィンドウ生成の仕組み
付箋1枚ごとに独立したTauriウィンドウが生成される仕組みを図示します。
図 2-1 ウィンドウ生成の仕組み
2 モジュール構造
フロントエンド（TypeScript/React）とバックエンド（Rust）の2層構成です。
2.1 フロントエンド（TypeScript / React）
付箋ウィンドウを構成する主要コンポーネント・フック・ユーティリティの依存関係を示します。
図 2-2 フロントエンドモジュール構成
2.2 バックエンド（Rust）
TauriコマンドとAppStateを中心とするRust側モジュールの役割を一覧します。
表 2.2-1 バックエンドモジュール一覧
| No | ファイル | 役割 | 主な責務 |
|---|---|---|---|
| 1 | main.rs | エントリーポイント | Tauri アプリ起動・プラグイン登録・シングルインスタンス制御 |
| 2 | lib.rs | invoke ハンドラ定義 | フロントエンドから呼ばれる全コマンドを宣言。処理は各モジュールに委譲 |
| 3 | state.rs | AppState（唯一の状態） | ノート一覧・設定・VAPID鍵・デバイス情報をメモリ上で保持。Mutex で排他制御 |
| 4 | settings.rs | 設定管理 | base_path・言語・フォントサイズ等を settings.json に読み書き |
| 5 | logic.rs | 付箋ビジネスロジック | ノート作成・保存・リネーム・アーカイブ・削除・タグ管理 |
| 6 | storage.rs | ファイル I/O | Markdown ファイルの読み書き・frontmatter パース |
| 7 | tray.rs | トレイアイコン | トレイメニュー生成・全表示/全隠し・クリックイベント処理 |
| No | ファイル | 役割 | 主な責務 |
|---|---|---|---|
| 8 | webpush.rs | プッシュ通知送信 | VAPID 鍵生成・APNs/FCM への Web Push 送信 |
| 9 | gdrive.rs | Google Drive 連携 | Drive ファイルの読み書き・ポーリング（iPhone からの受信検出） |
| 10 | capture.rs | 画像キャプチャ | Snipping Tool 起動・クリップボード画像を assets/ に保存 |
| 11 | clipboard.rs | クリップボード | テキスト・画像のクリップボード読み書き |
| 12 | sound.rs | 効果音 | 保存音・通知音などの再生 |
| 13 | import.rs | ファイルインポート | 外部 Markdown ファイルを Vault に取り込む |
| 14 | logger.rs | ログ | デバッグログの出力管理 |
3 データ構造
付箋ファイル・設定ファイル・モジュール依存の3種類のデータ構造を定義します。
3.1 付箋データ（Markdown ファイル = frontmatter + 本文）
付箋1枚 = Markdown ファイル1枚。PC ローカルのファイルシステムが正。Drive は中継所に過ぎない。
表 3.1-1 付箋データフィールド一覧
| No | フィールド | 型 | 用途・内容 |
|---|---|---|---|
| 1 | body | string | 本文テキスト（Markdown） |
| 2 | path | string | ファイルパス（実質的な主キー） |
| 3 | context | string | コンテキスト名（本文1行目から自動生成） |
| 4 | updated | string | 最終更新日時 |
| 5 | x, y | number? | 画面上の位置座標 |
| 6 | width, height | number? | ウィンドウサイズ |
| No | フィールド | 型 | 用途・内容 |
|---|---|---|---|
| 7 | background_color | string? | 付箋の背景色 |
| 8 | always_on_top | bool? | 最前面固定（ピン留め） |
| 9 | folded | bool? | 折りたたみ状態（最小化） |
| 10 | seq | i32 | 重なり順（Z-index 相当） |
| 11 | tags | string[] | タグ一覧 |
3.2 設定データ（settings.json）
settings.json で管理するアプリ全体の設定項目を定義します。保存場所は %APPDATA%\OreNoFusen\settings.json（アンインストールしても残る領域）。
表 3.2-1 設定データフィールド一覧
| No | フィールド | 型 | 用途・内容 |
|---|---|---|---|
| 1 | base_path | string? | Vault フォルダのパス（未設定なら初回セットアップ画面） |
| 2 | language | string | 表示言語 |
| 3 | auto_start | boolean | OS 起動時に自動起動するか |
| No | フィールド | 型 | 用途・内容 |
|---|---|---|---|
| 4 | font_size | number | 基本フォントサイズ |
| 5 | sound_enabled | boolean | 効果音 ON/OFF |
| 6 | pc_id | string? | この PC を一意に識別する UUID。Drive 上の pc_devices.json と紐づく。初回起動時に Rust が自動生成し、ユーザーには見せない |
pc_id を settings.json に置く理由
旧バージョンでは pc_id を別ファイル %LOCALAPPDATA%\ore-no-fusen\pc_device.json に保存していました。しかし LOCALAPPDATA 側はアンインストール時に削除されるため、再インストールするたびに新しい pc_id が生成され、Drive 上の pc_devices.json に古い登録がゴミとして残る問題がありました。settings.json（%APPDATA% 側＝アンインストールしても残る領域）に移すことで、再インストールしても同じ pc_id が継続して使われ、Drive 上にゴミが生まれなくなります。起動時に旧 pc_device.json が見つかれば自動で settings.json に移行し、旧ファイルは削除します。
3.3 クラス図（依存関係）
主要モジュール間の依存関係をMermaidクラス図で示します。
図 2-3 クラス図（主要モジュール依存関係）
4 データフロー
アプリ起動から保存・画像・検索まで4つのシーケンス図を示します。
4.1 アプリ起動
起動時にファイルシステムから付箋一覧を読み込むフローです。
図 2-4 アプリ起動シーケンス
4.2 付箋の保存・自動リネーム
本文の1行目をファイル名（context）として自動採用する。800ms のデバウンスで連続入力に追従。
図 2-5 付箋の保存・自動リネームシーケンス
4.3 画像キャプチャ
OS 内蔵の Snipping Tool を呼び出し、撮影された画像を Vault の assets/ に自動保存する。
図 2-6 画像キャプチャシーケンス
4.4 全文検索
キーワードをリアルタイムで全付箋から検索するフローです。
図 2-7 全文検索シーケンス
5 UI インタラクション
付箋ウィンドウの操作領域・モード・マウス挙動を定義します。
5.1 モード定義
表示・編集の2モードとその遷移条件を定義します。
表 5.1-1 モード定義
| No | モード | 状態 |
|---|---|---|
| 1 | 表示モード（閲覧中） | Markdown としてレンダリング済みの付箋を読んでいる状態 |
| 2 | 編集モード（執筆中） | カーソルが点滅し文字を書き込める状態。背景が半透明の白になる |
図 2-8 モード遷移図
5.2 操作領域の定義
付箋ウィンドウをエディタ本文・余白(A)・フッタ(B)の3エリアに分けて操作を割り当てます。
図 2-9 付箋ウィンドウの操作領域
表 5.2-1 操作領域の定義
| No | 領域 | 場所 | ユーザーの意図 |
|---|---|---|---|
| 1 | エディタ本文 | 文字・リンクが実際に存在する場所 | 「ここを直接操作・書き換えたい」 |
| 2 | (A) エディタ余白 | 文字の右側・左側に広がる枠線内の空白 | 「この行の続きや近くから書き込みたい」 |
| 3 | (B) フッタ領域 | 最後の行より下にある何もない空間（エディタ外） | 「一番下から追記したい」または「編集を終わらせたい」 |
5.3 インタラクション・マトリックス
エリア × 操作の組み合わせで起きる動作を一覧にまとめます。
5.3.1 🖱 ワンクリック
表 5.3-1 ワンクリック操作一覧
| No | クリックした場所 | 表示モード | 編集モード |
|---|---|---|---|
| 1 | エディタ本文 | 何もしない（ドラッグ準備） | カーソル移動（その文字へ） |
| 2 | (A) エディタ余白 | 何もしない（ドラッグ準備） | カーソル移動（最近傍の文字へ） |
| 3 | (B) フッタ領域 | 何もしない（ドラッグ準備） | 編集終了 |
| 4 | リンク | リンクを開く | カーソル移動 |
| 5 | ウィンドウ外 | フォーカス解除 | 編集終了（保存して表示モードへ） |
5.3.2 🖱🖱 ダブルクリック
表 5.3-2 ダブルクリック操作一覧
| No | クリックした場所 | 表示モード | 編集モード |
|---|---|---|---|
| 1 | エディタ本文 | 編集開始（クリックした文字から） | 単語選択 |
| 2 | (A) エディタ余白 | 編集開始（最近傍の文字から） | — |
| 3 | (B) フッタ領域 | 編集開始（文末から） | — |
5.3.3 ✋ ドラッグ（押しっぱなしで移動）
表 5.3-3 ドラッグ操作一覧
| No | ドラッグした場所 | 表示モード | 編集モード |
|---|---|---|---|
| 1 | エディタ本文 | 🪟 ウィンドウ移動 | 📝 テキスト範囲選択 |
| 2 | (A) エディタ余白 | 🪟 ウィンドウ移動 | 🪟 ウィンドウ移動 |
| 3 | (B) フッタ領域 | 🪟 ウィンドウ移動 | 🪟 ウィンドウ移動 |
6 機能一覧
システムトレイメニュー・付箋のツールバー・右クリックメニュー・設定画面の機能と、各機能の設計意図を記します。
6.1 システムトレイメニュー
タスクバーのトレイアイコンを左クリック（または右クリック）すると表示されるメニューです。show_menu_on_left_click(true) の設定により、左クリックでもメニューが開きます。
表 6.1-1 システムトレイメニュー項目
| No | 項目 | 機能 | 設計意図・工夫 |
|---|---|---|---|
| 1 | 新規メモ | 新しい付箋を作成する | プールウィンドウ方式（後述）で表示遅延ゼロを実現。トレイが発火すると fusen:create_note_from_tray をメインウィンドウに emit し、JS 側が昇格処理を担う |
| 2 | 検索 | 全文検索オーバーレイを開く | Vault 内の全 .md を Rust 側で行単位に grep。ヒットした 1 件目は自動的に対象ウィンドウにジャンプし、Enter/Shift+Enter/F3 で前後の結果をナビゲートできる |
| 3 | 全部隠す（Ctrl+Shift+H） | 全付箋を非表示にする | WebView2 の COM 層がネスト呼び出しでスタックオーバーフローを起こす問題を、JS 側が 1 窓ずつ 50ms 間隔でシリアルに処理することで回避 |
| 4 | 全部戻す | 非表示の全付箋を再表示する | 同上。Rust 側の LAST_VISIBILITY_MS（AtomicU64）で前回操作から 3 秒以内の連打をブロック。JS の連打と Rust のガードで二重に守る |
| 5 | タグで絞り込む | タグ選択で表示付箋を絞り込む | メニューを開くたびに Vault を再スキャンして最新タグを取得。☑/☐ で選択状態を可視化。タグトグルは std::thread::spawn で非同期処理し、Win32 同期メッセージによるスタック消費を防ぐ |
| 6 | 設定 | 設定画面を開く | メインウィンドウは通常 hidden。show() → unminimize() → set_focus() の順で先に表示を確保してから fusen:open_settings を emit する。順序が逆だとウィンドウが invisible のままイベントを受け取れない |
| 7 | 終了 | アプリを終了する | app.exit(0) で全 WebView ウィンドウを即時破棄。on_window_event を経由せず直接 OS プロセスを終了させる |
6.2 付箋のツールバー
付箋にカーソルを乗せると右上にホバー表示されるツールバーです。閲覧モードと編集モードで表示が切り替わります。
表 6.2-1 閲覧モードのツールバー項目
| No | ボタン | 機能 | 設計意図・工夫 |
|---|---|---|---|
| 1 | ＋ | 新規付箋を作成する | プールウィンドウ方式で即時表示。ウェルカムノートでは animate-bounce ＋ オレンジ色になり「ここから始めよう」と誘導する |
| 2 | △/▽ | 付箋を折りたたむ／広げる | タイトルバーの高さだけに縮小する。高さは logicalHeight × scaleFactor で物理ピクセル精度に変換し、高 DPI モニタでもズレない。折りたたみ中にユーザーが手動でウィンドウを広げた場合（10 物理 px 以上）は自動展開し、そのサイズを新たな「展開サイズ」として記憶する |
| 3 | ピン（📌） | 付箋を最前面に固定する | ピン状態によって SVG の形が変わる：ONは「縦に刺さったピン＋影」、OFFは「斜め45°に倒れたピン」。固定 ON 時は「ギュッ」音（120 Hz 三角波 → 60 Hz、80ms）、固定 OFF 時は「ポン」音（400 Hz → 800 Hz サイン波、100ms）を AudioContext で生成。音声ファイルをバンドルせず、コードだけで音を作る |
表 6.2-2 編集モードのツールバー項目
| No | ボタン | 機能 | 設計意図・工夫 |
|---|---|---|---|
| 1 | ⊞ | 選択テキストをMarkdownテーブルに変換 | CSV 風に入力したテキストをテーブル記法に一発変換 |
| 2 | 🔷 | Mermaidダイアグラムのテンプレートを挿入 | フローチャート・シーケンス図のひな形を即挿入 |
| 3 | カメラ | 画面キャプチャを付箋に貼り付ける | OS 内蔵の Snipping Tool を起動し、撮影した画像を assets/ に保存して ![]() 記法で本文に挿入 |
| 4 | フローティングフォーマットバー | テキスト選択時に選択範囲の真上に浮き上がる B / H1 / ≡ / ☑ の 4 ボタン | ツールバーを探さなくていい。選んだ瞬間にフォーマット操作ができる。座標は CodeMirror の coordsAtPos() で計算し、ウィンドウ上端を超える場合は下に反転（flip）してウィンドウ内に収める |
6.3 付箋右クリックメニュー（閲覧モード）
付箋を閲覧モードで右クリックしたときのメニューです。
表 6.3-1 付箋右クリックメニュー（閲覧モード）項目
| No | 項目 | 機能 | 設計意図・工夫 |
|---|---|---|---|
| 1 | 📄 ファイル名 | 現在の付箋ファイル名を表示（選択不可） | 付箋は似たような見た目が並ぶ。「いまどの付箋を操作しているか」をメニューの冒頭で示すことで誤操作を防ぐ |
| 2 | 📂 フォルダを開く | 付箋ファイルが保存されているフォルダをエクスプローラーで開く | 「脱出口」。データは平文 .md。エクスプローラー・Obsidian・VS Code からいつでも直接触れる設計。データはユーザーが完全に所有する |
| 3 | ✨ 新規メモ（Ctrl+N） | 新しい付箋を作成する | win.outerPosition()（物理ピクセル）と scaleFactor を取得してメインプロセスに渡し、30 論理 px ずらした位置で出現。DPI 混在マルチモニタ環境でも正確にずれる |
| 4 | 📋 複製 | 現在の付箋を複製する | 同上のオフセット機構を使用。内容・フォーマット・タグを含めてそのままコピーし、隣に並べる |
| 5 | 🎨 色変更 | 付箋の背景色を変更する（青 / ピンク / 黄） | 3 色のみ。選択肢を絞ることで決断疲れを排除した設計。色は frontmatter の background_color に保存されアプリ再起動後も維持される |
| 6 | 🏷️ タグ | タグの追加・トグル・削除モードのサブメニュー | メニューを開く瞬間に fusen_get_all_tags で最新タグ一覧を Rust から取得（React state の古い値を使わない）。削除モードへの切り替えは shouldReopenMenu.current = true でメニューを閉じた直後に同じ座標で再表示する |
| 7 | ⏰ アラームを設定 | 付箋にアラームを設定する | 「5分後」〜「1週間後」のクイックボタン＋日時直接指定の 2 モード。時刻は JST (+09:00) でフロントマター alarm_at に保存。時刻になると付箋が点滅し、効果音が鳴る |
| 8 | 📱 iPhoneに送る | 付箋の内容を iPhone に送信する | メニュー項目は常に表示する。iPhone送信が未有効化、または送信前の fusen_check_pro_setup で Google Drive / Push 設定が未完了と分かった場合は、{ tab: 'iphone' } を添えて設定画面の iPhone 連携タブへ直行する |
| 9 | 📦 アーカイブ | 付箋をタグフォルダ or Archive フォルダに移動する | 移動前にアプリ固有 frontmatter（background_color・geometry 等）を strip_sticky_fields で除去してから書き込む。関連画像を先にコピーし、コピー成功後に元ファイルを削除するフォールセーフな順序。複数タグ付きならサブメニューで移動先を選択 |
| 10 | 📨 開発者とのやりとり | 設定画面の掲示板を開く | 右クリック時は通信しない。ローカルに保存済みの未読状態だけを見て、未読の開発者返信がある場合は ● 新着あり を付ける |
| 11 | 🗑️ 削除（Ctrl+D） | 付箋をゴミ箱に移動する | fusen_move_to_trash で OS のゴミ箱へ。削除音を鳴らしてからウィンドウを hide() → destroy() する順序で、ユーザーに白紙フレームを見せない |
6.4 付箋右クリックメニュー（編集モード）
編集モード中に右クリックすると切り替わるメニューです。テキスト操作に特化しています。
表 6.4-1 付箋右クリックメニュー（編集モード）項目
| No | 項目 | 機能 | 設計意図・工夫 |
|---|---|---|---|
| 1 | Undo / Redo | 直前の操作を取り消す / やり直す | PredefinedMenuItem で OS ネイティブ操作にバインド。CodeMirror の編集履歴をそのまま使う |
| 2 | 切り取り / コピー / 貼り付け / 全選択 | 標準テキスト操作 | 同上。Web クリップボード API ではなく OS ネイティブのクリップボード連携 |
| 3 | 📅 今日の日付（曜日付き） | カーソル位置に 2026-04-27(日) 形式で挿入 | メニュー項目名自体に挿入後の実際の文字列を表示する。「Insert date」ではなく「📅 2026-04-27(日)」と書くことで、押す前に何が入るか分かる。Intl.DateTimeFormat で言語設定に従い曜日を自動変換（ja: 日・月・火、en: Sun・Mon・Tue） |
| 4 | 🕒 現在時刻 | カーソル位置に HH:MM 形式で挿入 | 同上。議事録・タスクログに時刻を一瞬で打ち込める |
| 5 | 📅🕒 日付＋時刻 | カーソル位置に日付と時刻を両方挿入 | 上の 2 項目を 1 アクションに合わせたショートカット |
6.5 設定画面
システムトレイ → 設定 から開く設定画面のタブと設定項目です。
表 6.5-1 設定画面タブ一覧
| No | タブ | 設定項目 | 設計意図・工夫 |
|---|---|---|---|
| 1 | 一般設定 | 言語（日本語 / English）・自動起動 ON/OFF・効果音 ON/OFF | 言語切り替えは全付箋ウィンドウの UI に即時反映。自動起動は tauri-plugin-autostart で Windows の HKCU\SOFTWARE\Microsoft\Windows\CurrentVersion\Run に登録。トグル操作が完了した瞬間に有効になる |
| 2 | 外観 | フォントサイズ（10〜32px、スライダーで変更） | スライダーをドラッグしながらリアルタイムにプレビューが更新される。決定した値は CSS 変数として全ウィンドウに伝播する |
| 3 | データ | Vault フォルダのパス変更・他フォルダからの Markdown インポート | インポートは .md ファイルと関連画像（fusen_img_*）を一括取り込む。Obsidian・Notion エクスポート・手書き md からの移行を想定。Vault フォルダ変更後は全付箋を再スキャンして再生成する |
| 4 | iPhone 連携 | Google Drive 連携の設定・認証 | Google OAuth + PKCE で、俺の付箋がユーザー自身の Drive にあるアプリ用ファイルを扱う許可を取る。トークンは PC ローカルにのみ保存する。Drive 接続が切れると本タブのアイコンに赤バッジが表示される。フィードバック Discord Webhook URL はバイナリに含めず Vercel 環境変数に持つ |
| 5 | このアプリについて | アプリバージョンの表示 | getVersion() が Cargo.toml からランタイムに読む。バージョン文字列はフロントエンドにハードコードされていない |
| 6 | フィードバック | 開発者へのフィードバック送信・1対1掲示板 | 送信内容は Discord Webhook 経由で開発者に届く。Webhook URL は Vercel 環境変数に持ち、バイナリには含めない。設定画面内に匿名の conversation_id を持つ掲示板を表示し、開発者返信を 1 日 1 回程度確認する |
6.6 開発者とのやりとり掲示板
ユーザーが連絡先を入力しなくても、設定画面内で開発者と 1 対 1 の掲示板としてやりとりできる補助機能です。ユーザーの PC に匿名の conversation_id を保存し、フィードバック送信時にその ID を Vercel API 経由で Discord 通知へ添付します。開発者がその通知へ返信すると、PC アプリは JST 4:00 頃に 1 日 1 回だけ自分宛の未読返信を確認し、ローカルに新着状態を保存します。右クリックメニューは通信せず、そのローカル状態だけを使って新着表示します。ユーザーと開発者の会話 UI の詳細は 007 コミュニケーション設計 を参照してください。
表 6.6-1 開発者とのやりとり掲示板の動作
| No | タイミング | 動作 | 設計意図 |
|---|---|---|---|
| 1 | 初回フィードバック送信時 | PC ローカルに conversation_id と確認用トークンを生成・保存する | メールアドレスや Discord ID を必須にせず、アプリ個体だけを匿名で識別する |
| 2 | フィードバック送信成功時 | 設定画面の掲示板に自分の投稿として表示する | 送信が成功したことを会話ログとして残す |
| 3 | 開発者返信登録時 | Vercel 側に conversation_id 宛の返信本文を未読として保存する | Discord は開発者の作業場所、Vercel API は会話の受け渡し場所として分離する |
| 4 | JST 4:00 頃の日次確認時 | 同じ日に未実行の場合のみ掲示板 API を呼ぶ | Vercel Cron が JST 3:00 に取り込んだ返信を朝に拾う |
| 5 | 未読返信あり | ローカルの has_unread_developer_reply を true にする | 右クリックメニューで通信せず新着表示できるようにする |
| 6 | 右クリックメニュー表示時 | ローカルの未読状態だけを見て 開発者とのやりとり ● 新着あり と表示する | メニュー表示を軽くし、通信失敗で右クリックが効かなくなる事故を防ぐ |
| 7 | 掲示板を開いた時 | 最新の会話ログを取得し、表示できた開発者返信を既読化する | ユーザーが自分の意思で見た時だけDB上も既読にする |
| 8 | 未読返信なし・通信失敗 | 何も割り込んで表示しない。失敗時は次回確認まで待つ | 失敗しても付箋データには影響しない |
| 9 | 開発者専用の手動未読チェック | 現在のPCの会話IDで conversation/poll を呼び、右クリックメニュー用の未読状態だけ更新する | 開発・検証時に JST 4:00 の日次確認を待たず、新着表示を確認できる。ここでは既読化しない |
表 6.6-2 掲示板 API に送る情報・送らない情報
| No | 分類 | 内容 |
|---|---|---|
| 1 | 送る | conversation_id、確認用トークン、アプリバージョン、掲示板確認に必要な最小限の時刻 |
| 2 | 送らない | ユーザーの既存付箋本文、添付画像、添付動画、Vault フォルダのパス、Google Drive 内の同期ファイル、Google Drive トークン |
7 エラーハンドリング・リカバリ方針
7.1 ローカルファイルとリカバリ
7.1.1 保存時のパス喪失保護（増殖バグ回避）
ユーザーが手動でファイルを移動・削除した場合や、リネーム処理が直前に行われた場合、古いパスに対する自動保存（ジオメトリ変更など）が発火すると古い名前でファイルが復活してしまう（増殖バグ）。 これを防ぐため、logic.rs の保存処理では**「上書き対象のファイルパスが物理的に存在するか（!current_path_obj.exists()）」をチェック**し、存在しない場合は保存処理をブロック（Err 返却）してトレースログを出力する保護機構を備えている（実施済み）。
7.1.2 アトミック書き込みによるファイル破損防止
付箋内容の保存は、一時ファイルへの書き込み完了後に元のファイルへ rename するアトミック書き込みで行う。これにより、保存処理中の予期せぬ電源断やクラッシュによるデータ欠損・破損を完全に防ぐ（実施済み）。 ファイルシステムエラー（書き込み権限なし等）が発生した場合は、保存を中止し Tauri コマンドのエラーとして返却する。
7.1.3 PC アプリ再起動時の状態復元
起動時に Vault フォルダを全スキャン（フロントマター解析）して付箋ウィンドウを再生成するため、アプリが異常終了した場合でも次回起動時にファイルの状態から自動復元される（実施済み）。 ただし、終了直前の「メモリ上にしか存在しない未保存の内容」は失われる（保存タイミングは blur 時またはデバウンス 800ms 経過後）。
8 環境変数・シークレット
この節は開発者向けです。PC版（Tauri アプリ）のビルド・リリースに必要な変数・シークレットの一覧です。
8.1 ローカルビルド用（.env.local）
src-tauri/build.rs がコンパイル時に読み取り、バイナリに直接埋め込む。.env.local は .gitignore 対象のため Git には含まない。
表 8.1-1 ローカルビルド用環境変数（.env.local）
| No | 変数名 | 取得元 | 用途 |
|---|---|---|---|
| 1 | GDRIVE_CLIENT_ID | Google Cloud Console → 認証情報 → OAuth 2.0 クライアント（Tauri用） → クライアント ID | PC 版が Google OAuth を開始するときに使う公開ID。ここでいう client は Google に登録した「俺の付箋 PC アプリ」を指す。gdrive.rs 内で env!() マクロで参照。 |
| 2 | GDRIVE_CLIENT_SECRET | Google Cloud Console → 認証情報 → OAuth 2.0 クライアント（Tauri用） → クライアント シークレット | 開発者が守る値。PC 版が Google OAuth のトークン交換・更新を行うために使う。.env.local は Git に含めず、配布物や公開リポジトリへ出さない。 |
8.2 CI/CD用（GitHub Secrets）
GitHub Actions のリリースワークフロー（release.yml / do-release.yml）が参照するシークレット。
表 8.2-1 CI/CD用 GitHub Secrets
| No | シークレット名 | 用途 | 設定するワークフロー |
|---|---|---|---|
| 1 | GDRIVE_CLIENT_ID | Tauri ビルド時の Drive Client ID（ローカルと同値） | release.yml |
| 2 | GDRIVE_CLIENT_SECRET | Tauri ビルド時の Drive Client Secret（ローカルと同値）。開発者が守る値で、GitHub Secrets にのみ置く | release.yml |
| 3 | TAURI_SIGNING_PRIVATE_KEY | Tauri アップデーター署名用秘密鍵。正規リリースであることを検証するために使う | release.yml |
| 4 | TAURI_SIGNING_PRIVATE_KEY_PASSWORD | 上記秘密鍵のパスフレーズ | release.yml |
| 5 | WINGET_TOKEN | winget-pkgs への PR 作成用 PAT（public_repo スコープ必要） | release.yml |
| 6 | WINGET_APP_ID | do-release.yml が main ブランチへ push するための GitHub App ID | do-release.yml |
| 7 | WINGET_APP_PRIVATE_KEY | 上記 GitHub App の秘密鍵。リリース処理をアプリ名義で実行するために使う | do-release.yml |
9 改版履歴
表 9-1 改版履歴
| No | バージョン | 日付 | 変更内容 |
|---|---|---|---|
| 1 | 1.0 | 26-04-19 | 新規作成。旧 001_ARCHITECTURE_DESIGN.html のPC側内容（構造図・クラス図・シーケンス図・ER図）を統合・整理 |
| 2 | 1.1 | 26-04-24 | ウィンドウ構成図を graph LR（横向き）に変更。スクロールなしで全体が見えるよう改善。 |
| 3 | 1.2 | 26-04-26 | セクション7「環境変数・シークレット」を新規追加。ローカルビルド用とCI/CD用を分けて記載。 |
| 4 | 1.3 | 26-04-27 | セクション6「機能一覧」を新規追加（システムトレイ・ツールバー・右クリックメニュー・設定画面）。各機能に設計意図・工夫を追記。旧6→7、旧7→8、旧8→9に繰り下げ。 |
| 5 | 1.4 | 26-05-06 | 3.1 付箋データ、6.1〜6.5 機能一覧、8.1〜8.2 環境変数・シークレットを修正。型の ? は任意項目であることを注記し、6.1-1 以降の表へ No を追加。環境変数・シークレットの対象を開発者向けとして明記し、Google OAuth の client_id / client_secret とリリース用秘密鍵の用途を説明。 |
| 6 | 1.5 | 26-06-01 | 6.5〜6.6 にフィードバック返信付箋を追加。匿名 feedback_thread_id、送信後ありがとう付箋、1 日 1 回の返信確認、返信 API に送る情報・送らない情報を定義。 |
| 7 | 1.6 | 26-06-01 | 6.5〜6.6 を返信付箋方式から設定画面内の 1 対 1 掲示板方式へ変更。匿名 conversation_id、掲示板API、送る情報・送らない情報を定義。 |
| 8 | 1.7 | 26-06-04 | 開発者とのやりとりの新着表示を右クリックメニューに追加する方針を定義。PCアプリは JST 4:00 頃に1日1回だけ確認し、右クリック時は通信せずローカル未読状態を使う仕様を追加。開発者専用の手動未読チェックも追加。 |
| 9 | 1.8 | 26-06-05 | エラー対応の全体方針を追加。予見可能なエラーはアプリ側で自動回避し、ユーザー対応が必要な場合は具体的な復旧手順を表示する方針を明記。 |