| 1 | <svg xmlns="http://www.w3.org/2000/svg" width="1600" height="1900" viewBox="0 0 1600 1900" role="img" aria-labelledby="title desc"> |
| 2 | <title id="title">Reasonix approval authorization mock states</title> |
| 3 | <desc id="desc">Mock UI states for exact command approval, command-prefix approval, file mutation approval, dangerous command approval, and persisted permission notices.</desc> |
| 4 | <defs> |
| 5 | <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1"> |
| 6 | <stop offset="0" stop-color="#101113"/> |
| 7 | <stop offset="1" stop-color="#171a1d"/> |
| 8 | </linearGradient> |
| 9 | <linearGradient id="card" x1="0" y1="0" x2="0" y2="1"> |
| 10 | <stop offset="0" stop-color="#202327"/> |
| 11 | <stop offset="1" stop-color="#1a1d20"/> |
| 12 | </linearGradient> |
| 13 | <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%"> |
| 14 | <feDropShadow dx="0" dy="18" stdDeviation="18" flood-color="#000000" flood-opacity="0.36"/> |
| 15 | </filter> |
| 16 | <style> |
| 17 | .page-title{font:700 42px Inter,Arial,sans-serif;fill:#f5f7fa} |
| 18 | .page-sub{font:400 20px Inter,Arial,sans-serif;fill:#a8b0ba} |
| 19 | .section-title{font:700 24px Inter,Arial,sans-serif;fill:#f4f6f8} |
| 20 | .muted{font:400 16px Inter,Arial,sans-serif;fill:#a5adb7} |
| 21 | .tiny{font:500 13px Inter,Arial,sans-serif;fill:#8d96a2} |
| 22 | .mono{font:500 15px "SFMono-Regular",Menlo,Consolas,monospace;fill:#dbe3ea} |
| 23 | .mono-small{font:500 13px "SFMono-Regular",Menlo,Consolas,monospace;fill:#cdd6df} |
| 24 | .label{font:600 15px Inter,Arial,sans-serif;fill:#f0f3f5} |
| 25 | .btn-text{font:600 15px Inter,Arial,sans-serif;fill:#f6f8fa} |
| 26 | .btn-rule{font:500 13px "SFMono-Regular",Menlo,Consolas,monospace;fill:#ffffff} |
| 27 | .key{font:800 13px "SFMono-Regular",Menlo,Consolas,monospace;fill:#141516} |
| 28 | .notice{font:600 17px Inter,Arial,sans-serif;fill:#eaf2ee} |
| 29 | .notice-rule{font:600 15px "SFMono-Regular",Menlo,Consolas,monospace;fill:#ffffff} |
| 30 | </style> |
| 31 | </defs> |
| 32 | |
| 33 | <rect width="1600" height="1900" fill="url(#bg)"/> |
| 34 | <text x="80" y="88" class="page-title">Reasonix 授权交互 Mock</text> |
| 35 | <text x="80" y="126" class="page-sub">展示规则可见化、命令前缀授权、文件编辑共享授权、危险命令降级、持久化 Notice 与去重覆盖提示。</text> |
| 36 | |
| 37 | <!-- Mock 1 --> |
| 38 | <g transform="translate(80 180)" filter="url(#shadow)"> |
| 39 | <rect width="720" height="480" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 40 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 41 | <text x="28" y="44" class="section-title">1. Bash：精简为前缀授权</text> |
| 42 | <text x="28" y="104" class="muted">Allow tool call</text> |
| 43 | <rect x="28" y="124" width="664" height="58" rx="10" fill="#15181b" stroke="#333942"/> |
| 44 | <text x="44" y="158" class="mono">bash — go test ./...</text> |
| 45 | |
| 46 | <g transform="translate(28 210)"> |
| 47 | <rect width="142" height="54" rx="9" fill="#5f4630" stroke="#ca8b45"/> |
| 48 | <circle cx="27" cy="27" r="13" fill="#f4a84b"/> |
| 49 | <text x="23" y="32" class="key">1</text> |
| 50 | <text x="52" y="32" class="btn-text">允许一次</text> |
| 51 | </g> |
| 52 | <g transform="translate(188 210)"> |
| 53 | <rect width="230" height="74" rx="9" fill="#263328" stroke="#62a66e"/> |
| 54 | <circle cx="27" cy="28" r="13" fill="#76d083"/> |
| 55 | <text x="23" y="33" class="key">2</text> |
| 56 | <text x="52" y="26" class="btn-text">本会话允许</text> |
| 57 | <text x="52" y="52" class="btn-rule">Bash(go test:*)</text> |
| 58 | </g> |
| 59 | <g transform="translate(438 210)"> |
| 60 | <rect width="264" height="74" rx="9" fill="#263328" stroke="#62a66e"/> |
| 61 | <circle cx="27" cy="28" r="13" fill="#76d083"/> |
| 62 | <text x="23" y="33" class="key">3</text> |
| 63 | <text x="52" y="26" class="btn-text">总是允许（保存）</text> |
| 64 | <text x="52" y="52" class="btn-rule">Bash(go test:*)</text> |
| 65 | </g> |
| 66 | <g transform="translate(28 312)"> |
| 67 | <rect width="118" height="54" rx="9" fill="#302328" stroke="#8a4c58"/> |
| 68 | <circle cx="27" cy="27" r="13" fill="#ef6b7c"/> |
| 69 | <text x="23" y="32" class="key">4</text> |
| 70 | <text x="52" y="32" class="btn-text">拒绝</text> |
| 71 | </g> |
| 72 | <text x="28" y="438" class="tiny">效果：选择 2/3 后，后续 go test ./internal/control 不再重复弹审批。</text> |
| 73 | </g> |
| 74 | |
| 75 | <!-- Mock 2 --> |
| 76 | <g transform="translate(840 180)" filter="url(#shadow)"> |
| 77 | <rect width="720" height="480" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 78 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 79 | <text x="28" y="44" class="section-title">2. CLI：同样展示具体规则</text> |
| 80 | <rect x="28" y="104" width="664" height="324" rx="12" fill="#0f1215" stroke="#343a42"/> |
| 81 | <text x="50" y="140" class="mono-small">⏸ 需要你的许可</text> |
| 82 | <text x="50" y="174" class="mono-small">将调用工具 bash go test ./...</text> |
| 83 | <text x="50" y="216" class="mono-small">1. 本次允许</text> |
| 84 | <text x="50" y="244" class="mono-small">2. 本会话允许 Bash(go test:*)</text> |
| 85 | <text x="50" y="272" class="mono-small">3. 总是允许 Bash(go test:*)（保存到配置）</text> |
| 86 | <text x="50" y="300" class="mono-small">4. 拒绝</text> |
| 87 | <text x="50" y="342" class="mono-small">选择 [1/2/3/4]（兼容 y/a/p/n）</text> |
| 88 | <text x="28" y="456" class="tiny">效果：终端用户不需要猜“授权范围”到底是什么。</text> |
| 89 | </g> |
| 90 | |
| 91 | <!-- Mock 3 --> |
| 92 | <g transform="translate(80 720)" filter="url(#shadow)"> |
| 93 | <rect width="720" height="480" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 94 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 95 | <text x="28" y="44" class="section-title">3. 文件修改：session 共享，持久化按路径</text> |
| 96 | <text x="28" y="104" class="muted">Allow tool call</text> |
| 97 | <rect x="28" y="124" width="664" height="58" rx="10" fill="#15181b" stroke="#333942"/> |
| 98 | <text x="44" y="158" class="mono">edit_file — src/app.go</text> |
| 99 | <g transform="translate(28 218)"> |
| 100 | <rect width="142" height="54" rx="9" fill="#5f4630" stroke="#ca8b45"/> |
| 101 | <circle cx="27" cy="27" r="13" fill="#f4a84b"/> |
| 102 | <text x="23" y="32" class="key">1</text> |
| 103 | <text x="52" y="32" class="btn-text">允许一次</text> |
| 104 | </g> |
| 105 | <g transform="translate(188 208)"> |
| 106 | <rect width="238" height="74" rx="9" fill="#20252b" stroke="#4a5360"/> |
| 107 | <circle cx="27" cy="28" r="13" fill="#aeb7c2"/> |
| 108 | <text x="23" y="33" class="key">2</text> |
| 109 | <text x="52" y="26" class="btn-text">本会话允许</text> |
| 110 | <text x="52" y="52" class="btn-rule">Edit</text> |
| 111 | </g> |
| 112 | <g transform="translate(448 208)"> |
| 113 | <rect width="244" height="74" rx="9" fill="#263328" stroke="#62a66e"/> |
| 114 | <circle cx="27" cy="28" r="13" fill="#76d083"/> |
| 115 | <text x="23" y="33" class="key">3</text> |
| 116 | <text x="52" y="26" class="btn-text">总是允许（保存）</text> |
| 117 | <text x="52" y="52" class="btn-rule">Edit(src/app.go)</text> |
| 118 | </g> |
| 119 | <g transform="translate(28 324)"> |
| 120 | <rect width="118" height="54" rx="9" fill="#302328" stroke="#8a4c58"/> |
| 121 | <circle cx="27" cy="27" r="13" fill="#ef6b7c"/> |
| 122 | <text x="23" y="32" class="key">4</text> |
| 123 | <text x="52" y="32" class="btn-text">拒绝</text> |
| 124 | </g> |
| 125 | <text x="28" y="438" class="tiny">效果：本会话允许 edit/write/multi_edit 共享；保存时只允许这个路径。</text> |
| 126 | </g> |
| 127 | |
| 128 | <!-- Mock 4 --> |
| 129 | <g transform="translate(840 720)" filter="url(#shadow)"> |
| 130 | <rect width="720" height="480" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 131 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 132 | <text x="28" y="44" class="section-title">4. 危险 Bash：不提供前缀授权</text> |
| 133 | <text x="28" y="104" class="muted">Allow tool call</text> |
| 134 | <rect x="28" y="124" width="664" height="58" rx="10" fill="#15181b" stroke="#63363f"/> |
| 135 | <text x="44" y="158" class="mono">bash — rm -rf /tmp/build</text> |
| 136 | <g transform="translate(28 218)"> |
| 137 | <rect width="142" height="54" rx="9" fill="#5f4630" stroke="#ca8b45"/> |
| 138 | <circle cx="27" cy="27" r="13" fill="#f4a84b"/> |
| 139 | <text x="23" y="32" class="key">1</text> |
| 140 | <text x="52" y="32" class="btn-text">允许一次</text> |
| 141 | </g> |
| 142 | <g transform="translate(188 208)"> |
| 143 | <rect width="258" height="74" rx="9" fill="#20252b" stroke="#4a5360"/> |
| 144 | <circle cx="27" cy="28" r="13" fill="#aeb7c2"/> |
| 145 | <text x="23" y="33" class="key">2</text> |
| 146 | <text x="52" y="26" class="btn-text">本会话允许</text> |
| 147 | <text x="52" y="52" class="btn-rule">Bash(rm -rf /tmp/build)</text> |
| 148 | </g> |
| 149 | <g transform="translate(468 208)"> |
| 150 | <rect width="224" height="74" rx="9" fill="#263328" stroke="#62a66e"/> |
| 151 | <circle cx="27" cy="28" r="13" fill="#76d083"/> |
| 152 | <text x="23" y="33" class="key">3</text> |
| 153 | <text x="52" y="26" class="btn-text">总是允许（保存）</text> |
| 154 | <text x="52" y="52" class="btn-rule">Bash(rm -rf /tmp/build)</text> |
| 155 | </g> |
| 156 | <g transform="translate(28 324)"> |
| 157 | <rect width="118" height="54" rx="9" fill="#302328" stroke="#8a4c58"/> |
| 158 | <circle cx="27" cy="27" r="13" fill="#ef6b7c"/> |
| 159 | <text x="23" y="32" class="key">4</text> |
| 160 | <text x="52" y="32" class="btn-text">拒绝</text> |
| 161 | </g> |
| 162 | <text x="28" y="438" class="tiny">效果：危险命令不会出现 Bash(rm -rf:*) 这种宽授权。</text> |
| 163 | </g> |
| 164 | |
| 165 | <!-- Mock 5 --> |
| 166 | <g transform="translate(80 1260)" filter="url(#shadow)"> |
| 167 | <rect width="720" height="420" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 168 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 169 | <text x="28" y="44" class="section-title">5. 保存成功 Notice</text> |
| 170 | <rect x="28" y="112" width="664" height="92" rx="12" fill="#15251b" stroke="#4a9860"/> |
| 171 | <circle cx="60" cy="158" r="18" fill="#76d083"/> |
| 172 | <text x="54" y="165" class="key">i</text> |
| 173 | <text x="88" y="150" class="notice">授权已保存到 /workspace/reasonix.toml</text> |
| 174 | <text x="88" y="178" class="notice-rule">Bash(go test:*)</text> |
| 175 | <rect x="28" y="246" width="664" height="84" rx="12" fill="#101316" stroke="#333942"/> |
| 176 | <text x="48" y="280" class="mono-small">[permissions]</text> |
| 177 | <text x="48" y="308" class="mono-small">allow = ["Bash(go test:*)"]</text> |
| 178 | <text x="28" y="374" class="tiny">效果：用户知道写入的是项目配置，而不是用户全局配置。</text> |
| 179 | </g> |
| 180 | |
| 181 | <!-- Mock 6 --> |
| 182 | <g transform="translate(840 1260)" filter="url(#shadow)"> |
| 183 | <rect width="720" height="420" rx="18" fill="url(#card)" stroke="#3b424b"/> |
| 184 | <rect x="0" y="0" width="720" height="72" rx="18" fill="#252a30"/> |
| 185 | <text x="28" y="44" class="section-title">6. 已覆盖 / 去重 Notice</text> |
| 186 | <rect x="28" y="112" width="664" height="92" rx="12" fill="#17212a" stroke="#4b708f"/> |
| 187 | <circle cx="60" cy="158" r="18" fill="#80b7e8"/> |
| 188 | <text x="54" y="165" class="key">i</text> |
| 189 | <text x="88" y="150" class="notice">授权已由 /workspace/reasonix.toml 中的规则覆盖</text> |
| 190 | <text x="88" y="178" class="notice-rule">Bash(go test:*)</text> |
| 191 | <rect x="28" y="246" width="664" height="84" rx="12" fill="#101316" stroke="#333942"/> |
| 192 | <text x="48" y="280" class="mono-small">新请求：Bash(go test ./internal/control)</text> |
| 193 | <text x="48" y="308" class="mono-small">已有规则：Bash(go test:*) → 不重复写入</text> |
| 194 | <text x="28" y="374" class="tiny">效果：配置不会因为多次“总是允许”越来越乱。</text> |
| 195 | </g> |
| 196 | |
| 197 | <text x="80" y="1774" class="page-sub">这些 mock 对应当前实现：按钮显示具体 rule；prefix scope 只在安全可推导时出现；持久化后通过 Notice 显示保存路径或覆盖规则。</text> |
| 198 | </svg> |
| 199 |